HTML5 缓存——是否可以为单个 URL 设置多个不同的缓存? [英] HTML5 Cache -- Is it possible to have several distinct caches for a single URL?

问题描述

每个 URL 都可以链接到一个缓存清单.但我想要多个缓存清单链接到同一个 URL.原因如下:

我想缓存的一些文件很少更新而且很大.因此，每次缓存更新时，这些大文件都会重新下载，即使它们可能没有更改.所以我想拆分缓存.一个缓存用于很少更新的大文件，另一个缓存用于经常更新的轻文件.

你们知道如何拆分 HTML5 缓存吗?

解决方案

最有效的方法是:

a) 对清单的 CACHE 部分中提到的所有资源使用远期到期日期 (max-age)，并为 CACHE 部分中的每个文件添加时间戳后缀，例如:

<前>缓存:menu_1355817388000.jstoolbar_1355817389100.js

b) 当服务器上的上述任何文件发生更改时，重新生成/更新清单以更改时间戳.下次只会下载具有修改时间戳的文件.任务完成.

注意:在浏览器中重新加载页面两次，因为在第一次刷新时浏览器只下载清单并使用旧的缓存资源来绘制页面.这样做是为了加快显示页面的速度(有一些技巧可以处理这个双重刷新问题，但它们超出了您的问题范围)

在这篇我在appcache上见过的长但最好的文章中查看更多信息.

Every URL can be linked to a single cache manifest. But I want several cache manifests linked to a same URL. Here is the reason:

Some files I want to be cached are rarely updated and large. So everytime the cache gets updated these large files get re-downloaded even though they may not have been changed. So I want to split up the cache. One cache for theses rarely updated large files and another cache for the often updated light files.

Do you guys have any idea how to split up an HTML5 cache?

解决方案

The most efficient way is:

a) Use far-future expiration date (max-age) on all resources mentioned in manifest's CACHE section and add timestamp suffix to each file in the CACHE section, e.g.:

CACHE:
menu_1355817388000.js
toolbar_1355817389100.js

b) When any of the above files change on the server, regen/update manifest to change the timestamp. Only the file with the modified timestamp will get downloaded next time. Mission accomplished.

Note: Reload the page twice in the browser, as on the first refresh browser downloads just the manifest and uses old cached resources to paint the page. This is done to speed up displaying the page (there are tricks to handle this issue of double refresh, but they are outside the scope of your question)

See more info in this long but best article I ever seen on appcache.

这篇关于HTML5 缓存——是否可以为单个 URL 设置多个不同的缓存?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！