是否有必要在CDN可用的情况下对资源进行网络打包



我是webpack的新手,最近我发现与Jquery和bootstrap CDN加载方法相比,将Jquery和bootstrap资源webpack到bundle.js的速度更慢

虽然webpack使我的Jquery或Bootstrap资源更小,增加了我的网络加载时间,但在我的情况下使用Jquery或Bootstrap CDN会更快。

我想我的Linux服务器可能性能不太好。

要从我自己的普通服务器加载资源,如果你没有一个好的web服务器,使用CDN从公共更好的服务器加载会更好,对吧?

是否应该捆绑常用的库(如jquery、bootstrap等(在很大程度上取决于以下因素(可能不是一个完整的列表(:

从技术上讲,以下两个因素是关键(可能不是完整的列表(:

浏览器缓存:浏览器倾向于缓存网站使用的文件,以便在后续使用中提高网站性能。尽管这取决于如何在JS文件请求上设置HTTP头(Cache control、No Cache、Etag、Expires、Pragma等(,但大多数网站都允许这种缓存,以提高性能。

库大小:文件越大,下载、加载、解释和执行所需的时间就越多;请记住,JavaScript是一种解释语言。

考虑到这些因素,以下是我想到的两种方法(广义的,不全面的(:

正在使用的库和CDN的流行性:当用户浏览各种不同的网站时,浏览器可能已经缓存了来自流行CDN的流行库。CDN上的库在全球范围内也被大量缓存。这将大大提高您的网站性能。

树摇动:如果在将库包含到bundle中的同时执行树摇动,则可以大大减少加载时间,因为您只将那些函数捆绑在真正使用的库上。如果不使用树摇动,整个库可能会被加载(作为bundle的一部分或单独的(。但是,这只有在绑定库时才可能实现。IMO,当我的应用程序很小并且只使用库中的几个函数时,这更有用。

我的解释可能并不完美和全面,但你可能会明白,这在很大程度上取决于你使用的库,它在你的应用程序中是如何使用的,等等

希望这能有所帮助!

最新更新