问题

现代文档站点常常依赖沉重的 JavaScript 运行时来呈现静态文本。对于使用老旧手机或慢速网络的用户，这些站点需要数秒才能加载。处理器要解析庞大的 JS 包会导致"输入延迟"，阅读体验变得糟糕。

为什么重要

技术文档应当人人可访问。强迫硬件受限的用户下载一套庞大的框架，是给学习人为设置障碍。轻量的站点能确保无论硬件或网速如何，所有人都能获取产品信息。

方法

采用 HTML 优先 (HTML-First) 策略。docmd 采用零框架架构，主要内容会在构建过程中渲染为标准 HTML。这能让浏览器主线程保持畅通，即便在入门级设备上也能顺滑滚动、即时跳转。

实现

1. 极小的运行时占用

默认情况下，docmd 不使用 React 或 Vue 来构建核心 UI。这种预渲染方式让初次"首次内容绘制 (FCP)"几乎即时完成。要保持这种性能：

• 限制自定义脚本：避免在 customJs 配置中加入大型第三方库。
• 使用浏览器原生特性：依赖标准 CSS 与 HTML5 元素。

2. 策略性的插件管理

虽然 插件 能带来强大功能，但它们也会带来性能开销。例如 Mermaid 插件 需要庞大的引擎才能渲染图表。如果您的用户使用低端设备，请改用静态图片替代客户端渲染。

3. 响应式与优化的媒体

避免给移动端用户发送过大的图片。使用 WebP 等现代格式，并考虑使用 <picture> 标签对响应式资源进行细粒度控制。

<picture>
  <source srcset="/assets/mobile-hero.webp" media="(max-width: 600px)">
  <img src="/assets/desktop-hero.webp" alt="功能概览" loading="lazy">
</picture>

使用 loading="lazy" 属性可以确保图片只在进入用户视口时才开始下载，从而节省带宽。

4. 高效的搜索索引

docmd 会按作用域生成搜索索引，从而保持较低的内存占用。但对于超大规模的站点，Search 插件 仍可能占用较多内存。请按照 Local-First 搜索指南 中的方法对索引进行优化。

取舍

为低端设备优先考虑性能，意味着放弃复杂 3D 可视化这类"重型"交互功能。这是一项有意识的设计选择 —— 它把包容性与速度放在视觉复杂度之上，确保您的文档能为最广泛的人群所用。