0

一些统计数据，我才能说明情况，

total JS code = 122 MB
minified = 36 MB
minified and gzip = 4 MB

我想一口气把整个 4 MB 下载下来（页面上有一个加载进度指示器），解压缩它们，但还没有解析它们。当此时可能不需要大量代码时，我们不希望代码在浏览器内存中扩展。当遇到具有相应 js 文件名的脚本标记时，应该进行解析。

意图：更快地一次性下载 js 文件，但从浏览器的角度保持行为不变。

是否存在这样的解决方案？我的想法还算正常吗？如果是，我知道如何获取 gzip，我想知道如何将它们保存在浏览器缓存中，以便在遇到脚本标记时浏览器不会再次触发 XMLHttpRequest。

4

2 回答 2

0

诀窍是利用 HTTP 缓存指令。首先看一下这个。您应该只需要获取一次 JS 代码，因为您可以安全地设置缓存指令来指示浏览器无限期地保留 JS 文件（视空间而定）。在这种情况下，无限期通常是指 2035 年。

当您准备好使用新版本的 JS 文件更新所有浏览器端缓存时，只需使用缓存清除查询字符串即可。任何序列号或时间和日期都可以，或者一个简单的版本号，例如；

<script src="/js/myfile.js?v2.1"></script>

一些缩小框架会为您处理缓存清除。例如，一个好的技术是那些对内容进行 MD5 处理并将其用作缓存破坏器查询字符串的技术。这样，每当您的源 JS 更改时，浏览器都会请求新版本（因为 QS 嵌入在您的 HTML 脚本标签中），然后再次缓存尽可能长的时间。

XMLHttpRequest 将尊重您设置的缓存优先级。

在您问题的另一部分，我相信您要问的是您是否可以下载一个组合脚本文件，然后仅在页面上使用单独的脚本标签引用其中的一部分。不——我不相信你能做到。如果要引用单个文件，则需要为要单独使用的每条 GZIPped 内容提供 HTTP URL 和缓存指令。但是，您可能会发现这与一个大文件一开始的性能一样甚至可能更高，具体取决于您可以实现多少并行化。

这里有一个巧妙的技巧是预先加载很多你需要的东西。谷歌多年来一直在主页上这样做。基本上，它们预先加载资源堆栈（当然是图像，但也可能是 JS）。因此，当您考虑要输入什么搜索查询时，他们已经在缓存中加载了您在后续页面上需要的内容。

因此，您可以在需要之前使用 XMLHttpRequest 来获取您的 JS 文件（无需解析它们）。然后，当您的<script/>标签引用它们时，它们已经被下载，您只需要解析它们。

于 2013-07-28T13:58:18.467 回答
0

除了 cirrus 关于使用 HTTP 缓存的观点之外，您还可以分解仍然相当大的 4mb 文件，并且仅在需要该功能时才加载它们。

它是更多的 HTTP 请求，但 4MB 是一次性的。

建议类似 require.js 在需要时加载适当的文件： http ://requirejs.org/docs/start.html

于 2013-07-28T14:06:33.343 回答