本文转载自“前端之巅”
作者｜David Gilbertson
译者｜无明
根据 Webpack 术语表，有两种不同的文件分割类型：
-
捆绑拆分：创建更多、更小的文件（但每个请求都需要加载它们）以获得更好的缓存效果。
-
代码拆分：动态加载代码，用户只下载他们正在查看的内容所需的代码。
捆绑拆分
捆绑拆分背后的想法非常简单。如果你有一个巨大的文件，哪怕只是修改了一行代码，用户也必须再次下载整个文件。但是，如果你将它分成两个文件，那么用户只需要下载被修改的那个文件，浏览器会从缓存中获取另一个文件。
捆绑拆分与缓存有关，因此对于首次访问网站的用户来说，有没有拆分其实并没有什么不同。
代码拆分（不加载不需要的代码）
基于路由的动态加载（特定于 React）
总结：如果用户会多次访问你的网站，请将你的代码拆分为很多小文件。如果你的网站有些部分是大部分用户不会访问到的，请动态加载这些代码。