客户端缓存JavaScript/CSS文件

4

我想知道为什么我们应该将Javascript和CSS文件合并在一起,因为这只对第一次页面加载有优势。在所有后续请求中,JS/CSS是从客户端浏览器缓存中加载的。那么它应该不会造成性能差异,或者我完全错了吗?


我认为你的想法是相反的。在第一次页面加载时,浏览器必须请求每一个资源。在随后的每个请求中,浏览器(可以)使用缓存的资源而不是从服务器获取,从而减少开销。这是你所问的吗,还是我完全错了? - Ian
2
如果我没记错的话,浏览器仍会发送请求以查看服务器是否有比缓存中的文件更新的版本。 - Sandy Gifford
2
第一印象非常重要。如果您的网站首次加载时间太长,用户可能会在完全加载之前关闭它。 - kapa
CSS/JS也不会永久缓存,具体细节我不确定,但我猜测每次用户关闭浏览器时会清除缓存?(或类似的操作) - Sean
1
但我认为提高性能的方法比减少JS/CSS文件更简单(除非您有超过5个,所有文件都很大)。 - Sean
1个回答

4
有几个原因:
  1. 浏览器通常对同时向给定站点发出的HTTP请求数量有限制(更多是出于礼貌而非真正的技术限制),你不希望scriptC.js和Z.css阻碍了scriptA.js和A.css的加载;
  2. 每个单独的HTTP请求都有延迟和带宽开销,即使它是一个“条件GET”请求,也会导致“304 - 未修改”的响应;
  3. 缓存有时会失效。在HTTP中,到期时间通常由服务器在HTTP响应的标头中设置。问题在于,服务器永远不知道发布更新需要多长时间,因此它必须不断地保险并给出“足够短”的到期日期。(使用HTML文件包含的资源的唯一生成名称是避免这个问题的一种方法...只需要检查封闭的HTML页面即可);

有一个小理由使用2个脚本:

  1. 您可以使用一个脚本立即开始执行,而另一个大脚本正在加载。

但是,所有这些都与终端用户感知的速度有关...尤其是在第一次加载页面时,当您想要赢得他们的注意力时。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接