浏览器中带有浏览器的缓存

Question

如果我使用CDN为jquery之类的.js库提供服务，或者通过多个“脚本”标记对我的客户机作出反应，那么浏览器会缓存这些文件，然后重新使用它们，而不是再次请求它们，以加快初始加载时间。

使用browserify，所有.js库都绑定到一个.js文件中，所以客户端不需要每次都下载整个.js包吗？这不会使初始加载时间变慢吗？

例如，

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js')>
//get from cache if present
<script src='mycomponents.js'> // should get from server

用褐变，

<script src='mybundle.js'> //包括jquery + mycomponents，始终来自服务器

Answer 1

根据您正在使用的服务器，它将告诉客户端浏览器是否可以从缓存中提供文件。通常，如果您的脚本被修改(这意味着任何捆绑脚本)，或者当它是第一次访问时，客户端需要请求整个包。否则，它将发送304个状态代码，表示可以使用缓存的文件。

如果您使用CDN，客户端很可能不需要下载所有依赖项，因为他可能在访问其他网站时缓存了这些依赖项。在第一次访问或更新时，要下载的唯一文件是您的组件脚本，该脚本可能会更频繁地更新，或者缓存会更快过期。

Browserify有利于生产力和依赖性管理。如果您正在寻找性能，我建议您使用CDN。

但是请记住CDN可能会失败，所以更喜欢在服务器上使用故障转移脚本。

<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<script>if (typeof jQuery === "undefined") { document.write('<script src="assets/js/jquery.min.js">\x3C/script>') }</script>

Answer 2

CDN的缓存头配置方式意味着浏览器不必每次下载文件。

如果希望浏览器缓存资产，可以使用显示为在这页上的标头为资产提供服务。