Vite Code Splitting详解

一、Code Splitting简介

打包构建中的代码拆分（Code Splitting）是一种优化技术，它将应用程序的代码拆分成多个小块（chunks），并在需要时按需加载这些代码块。这种技术的目的是提高应用程序的性能和用户体验，主要有以下几个原因：

1，减少初始加载时间

当应用程序的代码被打包成一个单独的文件时，用户在访问应用程序时需要下载整个文件，这可能导致长时间的加载延迟。通过代码拆分，可以将应用程序的关键代码和初始加载所需的最小功能模块放在主文件中，而将其他代码块延迟加载。这样可以减少初始加载时间，使用户更快地看到应用程序的内容。

2，按需加载

应用程序通常具有多个页面或功能模块，用户在访问应用程序时并不总是需要加载所有的代码。比较典型的例子就是路由组件。与当前路由无关的组件并不用加载。而项目被打包成单 bundle 之后，无论是初始化Chunk还是异步Chunk(动态import)，都会打包进同一个产物，也就是说，浏览器加载产物代码的时候，会将两者一起加载，导致许多冗余的加载过程，从而影响页面性能。通过代码拆分，可以将不同页面之间的代码拆分成独立的代码块，并在用户访问相关页面时按需加载相应的代码块。这样可以