使用谷歌托管jQuery-ui或自定义下载jQuery UI？

Question

我正在使用jquery-ui的幻灯片功能的网站.

谷歌托管的jquery-ui缩小版重达63KB - 这是针对整个图书馆的.仅滑动功能的自定义下载重量为14KB.

显然,如果用户已经缓存了谷歌托管版本,那么这是一个不费吹灰之力,但如果他们没有,则需要更长时间才能加载,因为我可以将自定义jquery-ui幻灯片功能放在我的main.js文件中.

我想这归结为有多少其他网站使用jquery-ui(如果这只是普通的jquery,上面的内容会很简单,因为大量的网站使用jquery,但我有点不确定使用jquery jQuery的用户界面)...

在上面的场景中,我无法弄清楚最好的事情是什么？

Answer 1

我想说，如果定制选择性构建那么小，无论是绝对的还是相对的，都有充分的理由选择这条路径。

加载 JavaScript 资源有几个含义，按以下事件顺序排列：

1. 加载：请求/响应通信，或者在缓存命中的情况下 - 获取。请记住，无论是否有 CDN，通信仅影响首页。如果您的网站是采用传统的“全页请求”样式（而不是 SPA 等）构建的，那么这实际上就不是问题了。
2. 解析：JS引擎需要解析整个资源。
3. 执行：JS引擎执行整个资源。这意味着任何初始化/加载代码都会被执行，即使这是托管页面中未使用的功能的初始化。
4. 内存使用情况：内存使用情况取决于整个资源。这包括静态对象和函数（也是对象）。

考虑到这一点，拥有较小的资源在其他方面比简单加载更有优势。更重要的是，对如此小的资源的请求在通信方面可以忽略不计。如果它是公司徽标的迷你版本，位于屏幕底部的某个地方，甚至没有人注意到，您甚至不会三思而后行。

作为旁注和潜在的优化，如果您的站点提供任何专有库或一组不太常见的库，您可以将所有这些库捆绑在一起，包括 jQuery UI 子集，并且您的用户将只有一个请求，再次使得这个有利。