loading jquery - 防止 CDN 服务器往返

loading jquery - prevent CDN server roundtrip

我的页面从 https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js

加载 jQuery

在重复加载时,查看 chrome 开发工具网络选项卡,我看到 jquery.min.js 的 return 状态为“304 未修改”,有时 time/latency一秒。

我还可以在 devtools 中看到 jquery 的响应 header 是 'Expires:Thu, 31 Dec 2037 23:55:55 GMT' ,仍然是 returned 304

对于我站点的其他文件,例如 cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js ,我看到 return 状态为“200 OK”和“( from cache)' 尺寸过小并且它们有超短 latenct/time(我猜这意味着 100% 缓存结果没有远程往返)

如果 jquery url 存在于缓存中,我如何告诉浏览器使用它 而无需任何远程流量 ?我需要最快的网站加载时间。

谢谢!

当 Chrome 将文件(例如您的 jquery.min.js 文件)放入缓存时,它会跟踪服务器说上次修改它的时间。每当它再次看到该文件时,它会询问服务器它是否已更改,您看到的 304 响应表明服务器已确认没有更改并且 Chrome 应该使用缓存版本。

如果没有这样的检查,您的页面将无法知道位于您提供的 URL 的文件是否已更改。另请参阅此处的答案:How “304 Not Modified” works?.

但是, 浏览器并不总是需要进行此检查。提供的文件也有一个 Expires 值,它告诉浏览器在检查是否有更改之前要等待多长时间。如果您之前获取的文件没有 "expired",浏览器将直接使用其缓存中的文件。

当您看到 200 OK(from cache) 指示符时,表示该文件是直接从缓存中使用的。

参见:

Yahoo's performance best practices

使用 F5 刷新将始终向 Web 服务器请求所有资源 - 尽管其中大部分将以 304 返回。

这是设计使然,是一件好事 - 用户一般不应该手动刷新页面,如果他们这样做,那么您应该给他们机会获取更新的资源。

我建议通过打开 Fiddler 进行测试(只是为了避免在 Chrome 开发工具中查看缓存响应的噪音),并像普通用户一样操作,并查看在期间实际发生了多少 HTTP 流量一个普通的用户会话,看看是否有什么你真的可以调整。