我在一个网站上工作,我们正在使用jquery-ui的幻灯片功能。
google托管的jquery-ui的缩小版重63KB——这是整个库的重量。仅幻灯片功能的自定义下载重14KB。
显然,如果用户缓存了Google托管的版本,这是很容易的,但是如果他们没有缓存,加载时间会更长,因为我可以把自定义jquery-ui slide函数放在main.js文件中。
我猜这归结于有多少其他网站使用jquery-ui(如果这只是为了正常的jquery,上述将是一个没有大脑的网站使用jquery的负载,但我有点不确定按照jquery-ui的使用)…
在上述情况下,我不知道该怎么做才好。我想说,如果自定义选择构建很小,无论是绝对的还是相对的,都有很好的理由选择这个路径。
加载JavaScript资源有以下几个含义,按照事件的顺序:
- Loading:请求/响应通信,或者在缓存命中抓取的情况下。请记住,CDN与否,通信只影响第一页。如果你的网站是建立在一个传统的"整页请求"风格(相对于SPA之类的),这实际上成为一个没有问题。 解析: JS引擎需要解析整个资源。
- 正在执行: JS引擎执行整个资源。这意味着任何初始化/加载代码都会被执行,即使这些初始化的功能在宿主页面中没有使用。
- 内存使用情况:内存使用情况取决于整个资源。这包括静态对象以及函数(也是对象)。
考虑到这一点,拥有更小的资源在一些方面是有利的,而不仅仅是简单的加载。更重要的是,对如此小的资源的请求在通信方面可以忽略不计。如果它是一个迷你版的公司标志,在屏幕底部的某个地方,甚至没有人注意到,你甚至不会多想它。
作为旁注和潜在的优化,如果您的站点提供任何专有库或一组不太常见的库,您可以将所有这些库捆绑在一起,包括jQuery UI子集,并且您的用户将只有一个请求,这再次使其具有优势。
使用Google托管版本
- 很可能用户最近访问了一个网站,加载了托管在谷歌服务器上的jQuery-UI。
- 它将从你的服务器上卸下负载,并使其他元素加载得更快。浏览器从一个域加载固定数量的资源。从Google服务器加载jQuery-UI将确保它与驻留在您服务器上的其他资源并发下载。
雅虎开发者网络推荐使用CDN。他们的全部理由张贴在这里。https://developer.yahoo.com/performance/rules.html
他们网站上的这句话真的让我印象深刻。"从用户的角度来看,将你的内容部署在多个地理位置分散的服务器上将使你的页面加载速度更快。"
我不是专家,但我的拙见就是这些。有了CDN,你可以肯定有减少延迟,加上如上所述,用户最有可能从谷歌托管的其他网站上捡到它。另外,我一直关心的是,节省带宽。