如何加快大多数页面资源已经被浏览器缓存的网站答案

【问题标题】：How to speed up a web site where most page resources are already cached by the browser如何加快大多数页面资源已经被浏览器缓存的网站
【发布时间】：2009-02-05 22:23:01
【问题描述】：

我想改善网站的页面加载时间。它是一个 Web 应用程序（想想类似 Web 邮件），用户相对较少会长时间使用该网站。

由于几乎所有页面请求都来自已经使用过该站点的用户，因此图像、css 和外部 javascript 资源将在之前的请求期间被浏览器缓存。由于浏览器不需要再次请求这些资源，我对以下性能提示不会对我的响应速度有任何改进吗？：

CSS 精灵
使用备用域名并行下载图像
Javascript 的位置包括在页面底部

有没有人有任何性能提示可以提高此类网站的响应时间。

【问题讨论】：

标签： performance web-applications

【解决方案1】：

这是加速 Web 应用程序的好资源： Yahoo: Best Practices for Speeding Up Your Web Site

为了从客户端缓存中受益，请确保按照这些做法的说明发送“Expires”和“Cache-Control”标头。

【讨论】：

【解决方案2】：

你的意思是网站已经在客户端缓存中，所以在他们一次性下载之后，后续的加载时间可以忽略不计，你如何在那里优化？

在这种情况下，我可以提出一些建议。首先，减少对服务器的 HTTP 请求数。这意味着：

如果客户想要前往服装 > 男士 > 鞋履，请使用弹出式菜单帮助他们更快地到达那里（当然，除非您想强制使用风景优美的路线）。
在同一个 HTTP 请求中加载所有内容（重复用户一次点击），然后用户 JS 按需隐藏/显示信息。

其次，您可以使用 AJAX，这样客户端就不必在每次从服务器收到响应时重新绘制整个屏幕。

第三，您可以设置较长的缓存过期时间，这样客户端就不会在短时间内继续检查更新。这将进一步优化已经存在的缓存层。

顺便说一句，即使图像已经被缓存，我仍然认为将它们托管在不同的服务器上会带来更好的性能。原因是浏览器限制了从一个域并行下载的数量，它仍然需要检查图像是当前的还是过期的（使用 HEAD 请求）。因此，将它们托管在多个域上将使这部分任务更快。不过这里可能是错误的，浏览器可能会以不同的方式处理此特定场景。

【讨论】：

【解决方案3】：

我认为您需要进行一些分析。首先确定您希望支持的所有浏览器是否实际上缓存您希望它们缓存的内容（如果需要，请在请求期间检查您的网络流量）。一些浏览器有有趣的缓存规则。如果这里有任何问题，请修复它们！

接下来，检查每个请求正在检索的内容。如果您的 HTML/CSS/Javascript 过于冗长，则需要发送更多数据，并为客户端处理更多数据。

查看服务器端、网络端和客户端的时序。查看服务器提供静态文件需要多长时间，以及脚本运行多长时间。查看服务器和客户端之间的往返时间是否相当短（在某些情况下，您可能希望重新定位服务器）。还要确保您的页面在客户端的渲染速度不会慢，无论是由于脚本速度慢、内容过多还是渲染复杂。

【讨论】：

【解决方案4】：

要真正了解您的客户的情况，您需要使用 Wireshark（或同等产品）来观察发生的传输情况。这将准确地告诉您该客户端在第一个请求和后续请求中获取了什么，以及客户端接收哪些请求需要很长时间。

【讨论】：