Vite结合Esbuild如何实现长尾词优化，显著提升项目性能？

本文共计2112个文字，预计阅读时间需要9分钟。

目录+前言+初探Esbuild+关键API+-+Transform+Build+Plugin+Esbuild+在Vite中的巧妙使用+预构建+Middlewares+内容转换+结束语+前言+在上文中，为什么有人会说vite+快，有人却说vite+慢？+中，我们提到了...

目录

• 前言
• 初探 Esbuild
• 关键 API - transfrom & build
• plugin
• Esbuild 在 Vite 中的巧妙使用
• 预构建
• middlewares 中内容转换
• 结束语

前言

在上一篇 为什么有人说 vite 快，有人却说 vite 慢？ 中，我们提到过开发模式下使用 Vite 会有首屏性能下降的负面效果。之所以会造成首屏性能下降，一方面是 dev server 需要完成预构建才可以响应首屏请求；另一方面是需要对请求文件做实时转换。

也许有的同学会问，是不是针对这两个方面做优化，就可以提升首屏性能呢？原则上这样是没有问题的，而且 Vite 也是这么做的。