说明
玩转 webpack 学习笔记
vite 发布 2.0 版本
Vite 是一种新型前端构建工具，能够显著提升前端开发体验。它主要由两部分组成：
- 一个开发服务器，它基于 原生 ES 模块 提供了 丰富的内建功能，如速度快到惊人的 模块热更新（HMR）。
- 一套构建指令，它使用 Rollup 打包你的代码，并且它是预配置的，可输出用于生产环境的高度优化过的静态资源。
更早实践 bundless 的工具：Snowpack
Snowpack 是一个闪电般快速的前端构建工具，专为现代网络而设计。 它是开发工作流程中更重、更复杂的打包工具（如 webpack 或 Parcel）的替代品。 Snowpack 利用 JavaScript 的本机模块系统（称为 ESM）来避免不必要的工作并保持快速，无论您的项目有多大。
浏览器对ESM的支持情况
https://caniuse.com/?search=javascript%20modules
HTTP/1.1 的请求数限制
打包会合并文件，减少请求数
HTTP/2 越来越多的应用在主流网站
比如CSDN网站：
比如抖音网站：
资源加载差异
打包成一个文件
bundless：浏览器请求多个文件
bundle 浏览器最开始会加载一个 bundle.js 文件
bundless 直接加载原文件，不是加载构建好的
打包速度的对比
- bundless 的冷启动时间大大缩短
- bundless 的 HMR 速度不受整个项目体积影响
- bundless 的单文件粒度的缓存更优
开发体验的对比
以 webpack 里面的 sourcemap 类型举例
bundle 依赖 sourcemap，并且类型很多
bundless 直接打 debugger 就行，调试起来相对简单
