2015-08-29 26 views
10

我正在使用jquery-ui中的幻灯片功能的网站上工作。使用谷歌托管的jQuery-ui或自定义下载的jQuery UI?

Google托管的jquery-ui缩小版本重63KB - 这是针对整个图书馆的。只有滑动功能的自定义下载重量为14KB。

很显然,如果用户缓存了Google托管版本,那么这是一个不用花费的时间,但是如果他们没有,它将需要更长的时间才能加载,因为我可以在我的main.js中包含自定义jquery-ui幻灯片函数文件。

我想它归结为有多少其他网站使用jquery-ui(如果这只是正常的jQuery的上述将是一个无脑的负载网站使用jQuery,但我有点不确定每使用jquery-ui)...

我无法弄清楚在上述情况下做什么是最好的事情?

+0

我不是这方面的专家,但有趣的问题。我的直觉告诉我去​​谷歌CDN。尽管该文件较大,但由于全球各地谷歌服务器的可用性和可靠性,它仍有可能会继续下载。另外一点你已经提到过,用户可能已经有了缓存的jQuery-ui的google cdn版本。这里有一个链接,我发现并阅读之前评论有一些有用的信息。 [3为什么你应该让谷歌主机为您的jquery](http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/) – Trevor

+0

说实话,通过谷歌CDN加载63k字节和来自您网站的14k字节之间的速度差异几乎可以忽略不计。如果我是你,我会问自己,如果在Google或你自己的网站上保持正确版本的jQuery UI更容易,但绝对不是来自Google的63 kB来自你的网站的加载速度是否比13 kB要快。 –

回答

4

我会说如果自定义选择性构建是那么小,绝对和相对,有一个很好的理由选择路径。

加载一个JavaScript资源有几方面的含义,在事件的顺序如下:

  1. 加载:请求/响应通信,或者在高速缓存命中的情况下 - 抓取。请记住CDN与否,通信只会影响第一页。如果您的网站采用传统的“完整页面请求”风格(而不是SPA等),则从字面上看,这不是一个问题。
  2. 解析:JS引擎需要解析整个资源
  3. 执行:JS引擎执行整个资源。这意味着任何初始化/加载代码都会被执行,即使这是主机页面中未使用的功能的初始化。
  4. 内存使用:内存使用依赖于整个资源。这包括静态对象以及函数(也是对象)。

考虑到这一点,拥有更小的资源在超越简单加载的情况下具有优势。更重要的是,对这种小资源的请求在通信方面可以忽略不计。如果没有人注意到它是屏幕底部的某个公司徽标的迷你版本,你甚至都不会想到它。

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

+1

我会回答这个问题,并补充说使用CDN只能在首页加载时具有_possible_优势;在那之后,资源被缓存并从磁盘加载,无论它来自哪个站点。 – Kenney

+0

@肯尼 - 是的,这也是一个好点。 – Amit

2

围棋与谷歌托管版本

  1. 很可能是用户必须最近访问加载jQuery的UI托管在谷歌服务器的网站。
  2. 它会从您的服务器取消加载并使其他元素加载速度更快。
  3. 浏览器从一个域加载固定数量的资源。从Google服务器加载jQuery-UI将确保它与驻留在服务器上的其他资源同时下载。
2

雅虎开发者网络建议使用CDN。他们的全部理由都张贴在这里。 https://developer.yahoo.com/performance/rules.html

这个引用来自他们的网站真的让我印象深刻。 “跨越多个地理位置分散的服务器部署您的内容将使您的网页从用户的角度更快加载。”

0

我不是专家,但我的两美分是这些无论如何。使用CDN,您可以确保延迟时间缩短,而且如前所述,用户最有可能从Google托管的其他网站中选择它,而且我一直关心的事情是节省带宽。