Javascript 缩小和 HTML5 清单答案

【问题标题】：Javascript minification and HTML5 manifestJavascript 缩小和 HTML5 清单
【发布时间】：2025-12-26 20:10:11
【问题描述】：

我们创建了一个 HTML5 应用程序，它也可以在离线模式下工作。 HTML 元素包含 manifest 属性，我们的 manifest 包含所有必要的文件，以便能够离线使用应用程序。我们正在尝试找到一种方法以自动方式缩小我们的 javascript 文件，但也有一个有效的清单文件（无需在缩小后手动编辑清单文件）。大多数情况下，在处理缩小的 javascript 文件时，最好在文件名中使用版本号或查询字符串变量，以确保加载了缩小的 javascript 文件的新版本，但与清单结合使用时效果不佳不支持更改查询字符串变量或不同文件名的文件。

我们已经尝试过 AjaxMin 和 SquishIt，但无法使其正常工作。你们有任何想法或可行的解决方案来使这种组合发挥作用吗？

我们的 HTML：

<html manifest="app.manifest">

我们的清单：

CACHE MANIFEST

NETWORK:
data

CACHE:
scripts/application/application.js
scripts/application/database.js
scripts/application/knockout.extensions.js
scripts/application/main.js
scripts/application/models.js
scripts/application/prototype.extensions.js
etc...

谢谢！

【问题讨论】：

我不确定我是否理解；为什么不在缓存清单中简单地列出 all.js（或任何你想调用的名称）？
如果您更改清单，请确保文件的 SIZE 发生更改。这是因为标准要求重新加载清单文件——连同所有要缓存的项目——当它的 SIZE 与缓存的不同时。我认为不会检查修改时间或其他哈希值。这可能比看起来更困难，因为“VERSION 1”和“VERSION 2”等具有完全相同的字符数，因此更改版本号通常效果不佳。我的诀窍是添加“X”（或某些字符）的注释，并始终在任何新版本的末尾附加一个。
为了刷新缓存的项目，您需要重新加载清单文件，如我在上一条评论中所述。否则，即使您的文件同名，浏览器也不会加载新版本，而是继续使用旧的缓存版本。

标签： javascript html minify offline-caching

【解决方案1】：

如果您想推送更新，您只需将清单更改一个或多个字节。大多数人使用带有版本号的评论。

#version 0.1

当浏览器显示缓存的页面时，它会在后台下载清单。如果更改，它将重新下载*清单中的所有文件。你的新 JS 文件也是如此。所以这就是触发下载新文件所需要做的一切。正确下载所有内容后，将在您下次加载页面时使用新文件。

(*) 重新下载时，浏览器将发送 Last-Modified 和/或 E-Tag 标头，因此如果文件未修改，服务器可以返回 304（以减少带宽使用）。此外，一些浏览器会尊重 expires 标头，因此发送不远的将来的 expires 标头，甚至更好的是过去，因为使用 appCache 时基于 expires 标头的缓存是无用的。

另外请注意，如果没有发送过期消息，firefox 将根据最后修改的标头猜测过期值。如果文件有一段时间没有更改，并且您正在使用 appcache，则无法强制 firefox 重新下载该文件，除非更改它的文件名（几乎失去理智试图弄清楚为什么 FX 没有更新一些文件）。

不确定您的缩小问题是什么。新的 JS 现在是否可以工作，或者您无法让浏览器使用新文件？

【讨论】：

【解决方案2】：

你有一些构建过程或发布过程来缩小你的 JavaScript，对吗？现在，您必须在该过程中重新生成更新版本的清单。在您的构建工具（make、rake、ant 或其他）重新构建新的缩小 JavaScript 之后，它还需要生成一个指向新 JavaScript 文件的新清单文件。

【讨论】：