个人网站技术原理

在喧嚣的算法之外,构建属于自己的数字花园。

↓ 探索基石
个人网站概念图

静态站点生成 (SSG)

告别数据库与后端运行时,回归纯粹的 HTML/CSS/JS。

构建时渲染 (Build-time Rendering)

Hugo / Astro / Next.js 等框架在部署前将 Markdown 与模板编译为纯静态文件。用户访问时服务器仅返回预生成的 HTML,无需任何服务端计算,TTFB 趋近于零。

SSG构建流程

岛屿架构 (Islands Architecture)

默认输出零 JS 的纯静态 HTML。仅在需要交互的组件(如评论区、搜索框)处“注水”激活,实现极致的首屏性能与 SEO 友好。

Git 作为 CMS

文章内容以 Markdown/MDX 形式存储在 Git 仓库中。每一次提交即是一次发布,天然具备版本控制、协作审阅与自动回滚能力。

排版与阅读体验

内容管理与排版系统

让文字呼吸,让阅读成为一种沉浸式的享受。

  • 语义化标记与无障碍 严格遵循 HTML5 语义标签,配合 ARIA 属性,确保屏幕阅读器与搜索引擎能精准理解文章结构与层级。
  • 响应式排版 (Responsive Typography) 基于视口宽度的流体字号(clamp()),动态调整行高、段间距与最大阅读宽度,在任何设备上都保持最佳可读性。
  • 暗色模式与色彩系统 通过 CSS 变量与 prefers-color-scheme 媒体查询,自动适配系统主题,并针对代码块、引用、链接分别优化对比度。

全球分发与边缘计算

无论读者身在何处,都能获得本地般的加载速度。

传统单源服务器
高延迟 + 单点故障

所有请求回源至单一机房,跨国访问缓慢,遭遇流量峰值或 DDoS 攻击时极易宕机。

CDN + Edge Functions
毫秒级响应 + 无限弹性

静态资源缓存至全球数千个边缘节点;动态逻辑(如重定向、A/B测试)在离用户最近的边缘执行,彻底消除回源延迟。

“你的文字,
不应被任何平台的生死所绑架。”

IndieWeb 独立精神 RSS / Atom 订阅 Webmention 去中心化互动 永久链接 (Permalink)