总结
- webpack是全部编译打包后然后启动
- vite是先启动，然后再按需编译
- 所以项目越大，vite的优势就越明显
打包过程
- webpack是从入口文件，然后递归进行分析依赖，然后构建依赖图，然后将所有打包成bundle。
- vite是直接启动一个ESM静态服务器，然后直接将es代码丢给浏览器，请求到某个文件然后vite再去编译它。
构建方式
- webpack要将所有用到的依赖进行编译和打包，还要经过各种loader处理，loader是js写的，速度是以s/min来进行计量的
- vite在生产环境使用Rollup进行构建，开发环境使用ESbuild来处理（ts转义，jsx转义，依赖预构建）Esbuild是使用GO语言编写的，速度以ms/s来计量的。生产环境使用Rollup进行打包，然后tree-sharking,动态导入优化都很成熟
热更新
-
Webpack改了某一个文件，会进行依赖图的更新，部分依赖会重新编译构建
-
vite是改了某一个文件，只会重新编译这个文件和这个文件依赖的模块
