我刚接触Browserify,正试图找出如何使其在客户端需要下载的内容方面更加高效。
我的Web应用程序使用了许多不同的第三方库和自定义代码。使用Browserify似乎是将所有内容打包成一个大的bundle.js
文件的普遍做法。对我来说,这种方法非常低效,原因有几个:
例如,假设您的bundle.js
包含lib1、lib2、lib3、customLib
。
- 如果Web应用程序的某个部分仅需要
lib1
,客户端仍然必须下载一个巨大的bundle.js
,最终只使用其中的25%。浪费下载的字节数,增加页面加载时间。 - 如果
customLib
是您经常迭代的一块代码,则每次更改时,您的客户端都必须重新下载bundle.js
,再次下载大量未更改的第三方库...
Web应用程序的其他部分可能会使用lib2
和lib3
,但客户端可能永远不会去那里,这样就肯定会浪费带宽下载整个bundle.js
。
我看到有人建议将捆绑包分成多个部分。但是有什么意义呢?如果一个页面使用lib1
,另一个页面使用lib1
和lib2
,还有另一个页面使用lib2
和lib3
,那么如何拆分它们呢?你将其分成多个部分,是否会偏离bundle.js
的优势?
Browserify似乎备受推崇,所以我希望我只是没有理解其中的问题。一起打包许多库和自定义脚本的正确方法是什么?人们称Browserify为“脚本加载器”,但我以前见过的所有脚本加载器(例如yepnope
等)都使用逻辑来确定要下载哪些脚本,这似乎是更有效的解决方案,而Browserify似乎希望客户端下载所有内容...