25

我正在研究加载静态文件时的浏览器性能,这个疑问出现了。

有人说使用 CDN 静态文件(即 Google Code、jQuery latest、AJAX CDN...)性能更好,因为它从另一个域请求而不是整个网页。

其他提高性能的方法是将Expires标头设置为几个月后,强制浏览器缓存静态文件并减少请求。

我想知道哪种方式最好,考虑性能以及是否可以将两者结合起来。

4

5 回答 5

71

如果您正在对网站进行 Web 性能优化 (WPO),也称为前端优化 (FEO),最终最好同时使用这两种技术。他们可以惊人地携手合作。虽然如果我必须选择一个而不是另一个,我肯定会在任何一天选择缓存。事实上,我想说的是,即使您要使用 CDN,也必须为所有 Web 项目设置适当的资源缓存。

缓存

设置Expires标头和资源缓存是必须的,并且应该在 100% 的时间内为您的资源完成。真的没有理由不做缓存。在 Apache 上,启用mod_expires.cmod_headers.c. HTML5 Boilerplate 项目在.htaccess 文件中有很好的实现示例,如果您的服务器是 nginx、lighttpd 或 IIS 等其他服务器,请查看这些其他服务器配置

如果有人有兴趣学习缓存,这里是一本很好的读物:Mark Nottingham's Caching Tutorial

内容交付网络

您提到Google Code, jQuery latest, AJAX CDN了,我只想简单地谈谈 CDN,包括那些您付费并托管自己的资源的 CDN,但如果您只是使用 jquery 托管文件 cdn 或从http://cdnjs.com/加载某些内容,这同样适用例子。

我想说 CDN 不如设置服务器端标头缓存重要,但 CDN可以提供显着的性能提升,但您的内容交付网络性能会因提供商而异。

如果您的流量是全球受众并且 CDN 提供商拥有许多全球边缘/对等位置,则尤其如此。它还将显着降低您的虚拟主机带宽和 CPU 使用率(一点),因为您将一些工作卸载到 CDN 以提供资源。

在极少数情况下,如果 CDN 的延迟最终比您的服务器慢,CDN 可能会对性能产生负面影响。此外,如果您过度优化并使用过多的资源并行化(使用多个子域,如 cdn1、cdn2、cdn3 等),最终可能会降低用户体验并导致额外的 DNS 查找开销。这里需要一个良好的平衡。

另一个可能发生的负面影响是 CDN 是否关闭。它已经发生了,而且还会再次发生。免费 CDN 更是如此。如果 CDN 由于某种原因出现故障,您的网站也会出现故障。这是另一个潜在的单点故障 (SPOF)。对于 javascript 资源,您可以变得聪明并从 CDN 加载资源,如果它失败,无论如何,然后检测并加载本地副本。下面是一个从 ajax.googleapis.com 加载 jQuery 的示例,带有后备(取自 HTML5 Boilerplate):

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.2.min.js"><\/script>')</script>

除了明显的免费 API 资源(jquery、google api 等)之外,如果您使用 CDN,您可能需要支付使用费,因此它会增加托管成本。当然,对于某些 CDN,您甚至必须支付额外费用才能访问某些位置,例如亚洲节点可能比北美节点要额外付费。

于 2012-10-16T15:20:56.540 回答
5

对于公共应用程序,请使用 CDN。缓存有助于重复请求,但不适用于第一个请求。为了确保在第一页访问时快速加载使用 CDN,该文件很有可能已经被另一个站点缓存。正如其他人已经提到的那样,CDN 结果当然也被大量缓存。

但是,如果您有一个 Intranet 网站,您可能希望自己托管文件,因为它们通常从内部源加载比从 CDN 加载更快。然后,您还可以选择将多个文件合并为一个以减少请求数量。

于 2012-10-16T15:15:12.757 回答
4

CDN 具有提供多个服务器并自动将您的流量路由到离您的客户端最近的位置的好处。这可以加快交付速度,并根据位置进行优化。

此外,静态内容不需要特殊的应用程序服务器(如动态内容),因此能够将其卸载到 CDN 意味着您可以完全减少流量。流式视频剪辑可能太大而无法缓存或不应该被缓存。但是您不一定要支持该带宽。CDN 将为您承担该流量。

它并不总是与缓存有关。小型应用程序 Web 服务器可能只想提供动态内容,但需要针对很少更改的重磅媒体的解决方案。CDN 为您处理扩展问题。

于 2012-10-16T14:10:04.157 回答
1

同意@Anthony_Hatzopoulos (+1)

CDN 补充了缓存;在某些情况下,它还有助于优化缓存指令。

例如,我工作的一家公司已将行为学习算法集成到其 CDN 中,以识别和动态缓存生成的对象。

通常,这些对象是不可缓存的(即 [Cache-Control: max-age=0] Http 标头)。但在这种情况下,系统能够识别缓存的可能性并覆盖原始 HTTP 标头方向。(例如:一个动态生成的流行产品应该被缓存,或者流行的搜索结果页面,虽然是动态生成的,但随着时间的推移仍然以相同的形式呈现给成千上万的用户)。

是的,在您问之前,系统还可以识别个性化数据并且非常新鲜,以防止误报... :)

由于反向代理 CDN 技术,才有可能实现这样的算法。这是 CDN 和缓存如何相互补充,以创建更好、更智能的加速解决方案的示例。

于 2012-10-17T14:54:52.033 回答
0

在这些专家的引用之上,解释是完美的理解 CDN 技术和缓存我只是提供我的个人经验,我曾在 joomla 德行网站上工作,不幸的是它不允许更新新的 joomla 和德行版本,因为它太多定制产品页面中的字段,因此一旦访问者达到 900/DAY 和批次用户无法将他们的项目放入他们的购物篮,因为每次调用批次 js 和 ajax 调用订单项目需要太多时间

优化网站后,我们决定使用CDN,然后性能真的变好了,根据gtmetrix的记录,第一个YSlow Score是50%,然后优化+CDN后达到74%

https://gtmetrix.com/reports/www.florihana.com/jWlY35im

从 CDN 的仪表板中,您可以看到哪个数据中心的成本最高和收费最高的数据,以改善您的营销:

在此处输入图像描述

但是是的,要配置 CDN,它必须注意清除时间并平衡资源 CDN 的数量,如果它关闭了一些问题,您需要找出哪个资源 CDN 原因

希望这会有所帮助

于 2018-05-18T13:42:19.130 回答