Webpack捆绑如何减少React等流行库的重复下载?

时间:2017-08-17 07:48:20

标签: javascript webpack module bundle bundler

我的理解是Webpack会将您的所有代码及其依赖库(例如React)捆绑到一个js文件中。然后当有人访问您的网站时,他们会下载包含所有内容的捆绑包然后运行它。这是否意味着即使访问者访问过之前在React上运行过的其他站点,他仍然会下载包含React的捆绑包并运行它?这不是导致不必要的下载,因为该用户已经有React吗?

1 个答案:

答案 0 :(得分:1)

Webpack的一个用途是将所有代码捆绑在一个文件中,以减少下载时间。在http中,对大文件的请求比对几个小文件的请求要高得多。

回答你的第一个问题:是的,导航到另一个应用程序的用户也必须下载你的脚本。

对于你的第二个问题:不,它不会导致不必要的下载。有很多东西会使你的软件包变得独一无二,而且在不同域的应用程序之间实现缓存会非常困难(而且非常不安全)。想象一个网站,其反应代码中包含恶意代码。您不希望浏览器在您自己的应用中重复使用此代码。

但是,为了提高性能,您可以使用浏览器缓存在下载时将捆绑包保存在客户端PC中。多亏了这一点,他们无需在每次访问您的应用时下载脚本,只有在捆绑包过期或更改时才会下载。

也许this link可以帮助您了解如何为您的webpack构建添加捕获功能。