AI 摘要：这篇文章介绍了如何为 Shiki 代码高亮库实现按需加载语言解析器的功能，以减少加载时间和流量消耗。通过改造现有的组件代码，使其能够在需要时才加载特定的语言模块。此外，文章也探讨了在 Next.js 应用中如何处理 Shiki 组件的服务端渲染问题，以及如何避免页面在首次加载时的布局移动（CLS）。这些优化措施有助于提升页面性能和用户体验。

innei.in

Shiki 性能优化 - 按需加载语法解析

Shiki 是一个非常优秀的代码高亮库。 https://github.com/shikijs/shiki 众所周知，代码高亮库包含了众多的语言解析器，导致加载比较缓慢，并且加载太多无用的解析器造成大量流量浪费。 这一节我们来实现按需加载 Shiki 需要的语言解析器。 动态加载 开始之前