捆绑如何提高性能？

Question

我知道捆绑允许从服务器提取更少的依赖文件。但是，如果那个捆绑的依赖文件的文件大小与捆绑的文件的大小相同。为什么会更快？

我了解了包拆分的概念，但是我们是否不需要在主html文件（我理解为用户首次登陆的页面）中指定包？

（对于这个问题的措辞不好，我感到抱歉。我对整个捆绑概念非常困惑，不知道如何使这个问题更具体。）

Answer 1

如果您的javascript应用程序只有一个版本，那么即使加载第一页，也将加载所有不必要的代码。我们可以利用js提供的异步功能，并按需加载块（通过代码拆分生成的模块）。 假设如果我的拳头页面上只有一些信息，并且我在第二页上的某些按钮上单击时显示了弹出窗口，那么我不需要在拳头页面上调用pop的代码，但是以后我可以在任何条件下加载该弹出窗口包。除此以外，我们的捆绑包当然应该被粉碎，缩小和压缩。

Answer 2

捆绑的好处

缩小

尽管即使未捆绑代码也可以缩小代码，但是捆绑代码可以实现更多的缩小，从而导致更快的加载时间。

例如，假设您有两个文件const { app, globalShortcut } = require('electron') app.on('ready', () => { // Register a 'CommandOrControl+Y' shortcut listener. globalShortcut.register('CommandOrControl+C', () => { // Do stuff when Y and either Command/Control is pressed. contents.copy() }) 和file1.js。 file2.js使用file1.js中的全局函数。

分别缩小文件要求file1.js和file1中的函数名称保持相同，因为缩小器无法知道file2中调用的函数（如果是）缩小），同时缩小file2。

另一方面，将文件打包并缩小它们可以使缩小器重命名函数或变量的每次出现，从而使代码更小。

此外，正如@gauraysingh所说，捆绑程序可以删除未使用的代码，例如函数。例如，假设您在应用程序中使用jQuery。打包代码时，打包程序和压缩程序可以删除所有未使用的jQuery方法，这意味着您将节省很多文件大小。

更少的HTTP请求

仅对绑定的代码执行一个HTTP请求比进行多个请求更快，并且使用的数据更少。