toMedia

性能优化

Fumadocs MDX 性能优化指南

Fumadocs MDX 作为打包器插件运行,对于大型文档站点需要考虑性能问题。该系统足以处理拥有近 500+ MDX 文件的大型文档站点。

图片优化

图片通过 Remark Image 功能自动优化。在 MDX 中引用图片时:

![Hello](./hello.png)

系统会将其转换为静态导入:

import HelloImage from './hello.png';
<img alt="Hello" src={HelloImage} />

这确保图片会根据你的 React 框架自动优化(如 Next.js Image API)。

性能限制

虽然 Fumadocs MDX 可以处理大量文档集,但在规模较大时可能出现问题:

  • 内存使用:大量 MDX 文件可能导致构建和开发模式中内存使用极高
  • 编译开销:打包器执行的大量优化工作并非为数百个 MDX 文件设计

优化方案

远程内容加载

创建自定义内容源,按需处理内容而非预编译。这种方式可以提高构建速度,但会牺牲打包器级别的优化。

懒加载

实现 MDX 内容的延迟加载模式。详见懒加载文档

核心建议

主要策略是使编译按需进行,即内容仅在被请求时才加载。

On this page