Html 使用本地存储的页面版本，而不是其他请求

我正在做一个网络项目，性能是一个非常重要的问题

编辑：

情况： 我想添加一些有关用户工作流程的详细信息：

用户访问我的网站的欢迎页面

http://example.org/

他点击一个链接以访问页面

http://example.org/mypage

onclick

-已执行链接的处理程序

处理程序使用XHR加载数据

处理程序创建

http://example.org/mypage

动态地

处理程序使用文件系统API将mypage保存到本地

文件系统：http://example.org/mypage

编辑：（

文件系统：http://example.org/mypage

是存储在客户端的

文件系统中的本地ressource）

处理程序使用“

historyapi

from

http://example.org/

（欢迎页面的URL）至

http://example.org/mypage

（用户希望看到的页面）

用户同时访问另一个页面

稍后，用户输入

http://example.org/mypage

直接插入位置栏

浏览器显示/加载

文件系统：http://example.org/mypage

（这是

http://example.org/mypage

）而不是

http://example.org/mypage

。这意味着：浏览器不创建新请求，而是使用

http://example.org/mypage

如何让浏览器使用本地存储的页面版本，而不是创建新请求编辑：-这就是我想在上面列表的#10中做的事情

编辑：

我的问题: 客户端已经创建/生成了

http://example.org/mypage

在上面列表的第2到第7页。我不需要在其他时间创建该页面。这就是为什么我不希望浏览器为

http://example.org/mypage

这就是我想做的：

如果

文件系统：http://example.org/mypage

已创建（如果用户已访问

http://example.org/mypage

）：

使用

文件系统：http://example.org/mypage

而不是

http://example.org/mypage

否则：

发送

http://example.org/mypage

试图解决：

我不能使用清单文件的回退部分来执行类似以下操作：编辑：（除了源代码）

回退： 文件系统：http://example.org/mypage

为了让浏览器使用存储在文件系统中的本地版本，因为只有在用户脱机时才使用回退指令，否则将忽略它们编辑：但我想使用

文件系统：http://example.org/mypage

而不是

http://example.org/mypage

，即使用户在线

我知道我可以在服务器生成的页面的响应头中使用Expire字段，以便不创建新请求并使用缓存版本

但是如果我使用JS和XHRs在客户端动态创建一个页面呢编辑：（我在<代码>情况中描述了这种情况）在客户端创建页面时，无法让客户端缓存该页面。这就是为什么我使用文件系统API手动“缓存”页面，将其存储在客户端

为了提高性能，我尝试存储用户已经在本地访问过的任何页面。当用户再次访问某个页面时，我会向他显示该页面的本地存储的旧版本，我的脚本会创建一个XHR，以确定该页面是否同时更改

但是，如何让浏览器使用页面的本地版本呢？ 我可以使用文件系统API在客户端本地保存生成的页面，也可以使用历史API为生成的页面选择一个URL，以便在浏览器的位置栏上显示它。
当用户现在访问另一个站点，然后按下后退按钮时，我可以通过事件处理程序捕获onPopState事件。
该事件处理程序可以使用文件系统API加载动态创建的文件。
但是，如果用户不使用“后退”按钮，并且直接在位置栏中键入我使用历史API注册的URL，我该怎么办？

---

然后浏览器将不使用本地存储的页面版本，浏览器将创建从服务器加载页面的请求。

不要将动态数据放入应用程序缓存。如果您想在页面中放置动态数据，那么可以使用AJAX从服务器获取数据，将数据存储在中，并通过JavaScript使用存储中的数据填充页面（您可以为此连接到historyapi）

顺便说一下，这不起作用，因为回退条目必须在同一个域上：

FALLBACK:
http://example.org/mypage filesystem:http://example.org/mypage

---

一旦页面位于应用程序缓存中（即，它是本地存储的），浏览器将始终使用应用程序缓存中的版本，直到清单更新或用户删除缓存。您在页面上放置的到期头实际上并不重要，除非您放置的到期时间较长，并且您经常更新清单，那么应用程序缓存很可能会从浏览器缓存中填充，而不是从服务器刷新。这就是为什么您放在应用程序缓存中的东西应该是静态文件。使用AJAX获取动态内容。

您可以使用URL对层次结构中的实际链接进行编码，例如URL的锚定部分中的“mypage”，即。然后，您可以使用window.location.hash获取#后面的字符串，并执行您想要的任何操作。只要确保你的根（或任何你想要的在fr中）