捆绑包大小如何影响性能？

Question

假设webpack生成的最终捆绑包约为 15MB。
除了第一次在网站上加载缓慢之外，与比如说 500KB 捆绑包相比，是否存在任何重大的性能问题？ （即已丑化，或使用.min npm 封装）

Answer 1

JavaScript 在浏览器的主线程中解析、编译和执行，这意味着用户必须等待这一切才能与网站交互。

15MB 是很多 JS 代码。

有用于分析主要 web 浏览器中内置的性能的工具，您可以查看。

您可以在此处了解更多信息： https://web.dev/bootup-time/ 。

Answer 2

性能影响包括：

• 是时候通过网络传输了。 尤其要考虑与某些移动设备的慢速连接。 根据您的操作，您的页面可能在加载之前不会是交互式的。
• JS解析时间。 现代 JS 引擎速度很快，但您加载的代码越多，浏览器必须解析的内容就越多。
• JS 执行时间。 最好只打包您希望执行的代码。 您想要执行的代码越多，所需的时间就越长。 同样，在大部分完成之前，您的页面可能不会是交互式的，具体取决于详细信息。
• Memory 消耗。 一切都占用空间：代码本身、运行时变量、创建的 DOM 元素等。

使用您喜欢的浏览器的开发人员工具来分析代码的影响非常重要。 请务必删除您的网站并不真正需要的任何 JS。