为什么选 Vite | Vite 官方中文文档 (vitejs.dev)
- 在很久以前,javascript是没有模块化的,就是一个整体,所以为了将文件分成很小的模块文件,才出现“打包”这个概念
- 之前的拆分工具像webpack,rollup等,因为项目越来越大,需要很长时间才能启动开发服务器,热替换的作用也不太明显,需要很长时间才会显示修改的内容,影响了开发者的体验
为了解决拆分成很小的模块文件
为了解决不花很长时间启动开发服务器
因此,es6出现了javacscript的模块化,可以不借助webpack这些打包工具,也能实现将整个文件拆分成一个又一个很小的模块文件。
vite将项目中的代码分为依赖代码和源代码
依赖代码就是项目依赖的第3方库,第3方插件
源代码就是项目中自己写的业务代码
vite在最开始的时候,将依赖代码和源代码区分出来后,就用esbuild将依赖的代码就是第3方插件库重新进行一次打包,这就是依赖预先构建。
vite使用了es6的模块化来获取源代码就是自己写的代码,这让浏览器也参与了进来。
同时vite也使用浏览器的http请求头,来加速页面的重新加载,源代码在请求的时候,判断304状态,进行协商缓存。依赖代码在请求的时候,会使用浏览器的cache-control进行强缓存,一旦依赖的代码缓存下来,就不再第2次发请求。
上面使用http的协商缓存和强缓存,让浏览器再次参与进来,为我们做了很多事情