HTML5 LocalStorage 作为缓存和单个资产请求

Question

我想知道以下概念的限制，缺点是什么：

要求：

1. 支持 LocalStorage 的浏览器。
2. 服务器端异步非阻塞 i/o 技术。

让我们想象一下以下请求流程：

1. 客户端 GET / 请求 -> 服务器。我们将此阶段称为“问候”，这是一个有趣的阶段，因为客户端现在发送（当然也是通过标头）：

   • ip
   • 浏览器
   • 浏览器版本
   • 语言
   • 字符集

2. 服务器 -> 客户端 (200 OK)

3. 客户端 -> 如果正常 -> 与服务器建立websocket

一旦建立了 websocket，我们就进入了“资产流”阶段。

1. 服务器 -> 查找匹配的资产（样式表、图像、javascript 文件、字体等），特定于：语言、浏览器、特定分辨率assets) 并通过 websocket 流式传输它们。

2. 服务器 -> 请求（websocket，资产异步流）

好处 1. 没有多个请求通过线路避免 DNS 查找等。

好处 2。 将这些资产缓存在 localStorage 中，这是下一阶段。

1. 请求 -> 放入 LocalStorage 缓存。
2. 请求 -> 渲染网站。

我想知道一些意见，什么可能是个好主意，什么可能不是等等。

我的第一个想法是：

• 此架构不支持 CDN
• 我们需要一个请求来获取 javascript / html 以启动 WebSocket 等。

我希望我的问题很清楚。

Answer 1

有趣的方法，绝对值得思考。让我成为你的恶魔的拥护者：

好处 1. 没有多个请求通过线路避免 DNS 查找 等等

确实如此，尽管这只是您第一次访问页面/站点时的问题。通过现代浏览器实现的预取，它也得到了一定程度的缓解。重要的是要记住，浏览器会并行下载多个资源，这比批量下载整个有效负载可能更快，而且响应速度肯定更快。

利用当今的技术，就网络客户端而言，您已经可以使用少量资源来提供完整的页面和应用程序（所有资源都可以压缩！）：

1. HTML
2. 合并和缩小 CSS 文件作为一个资源
3. 同样适用于 JS
4. 图像精灵

好处 2. 在 localStorage 中缓存这些资产...

浏览器已经缓存了这些资产！此外，还有经过验证的智能技术可以使这些缓存失效（这是软件开发中的第二大挑战）。

其他需要考虑的事项：

1. 不要低估 CDN。他们是救生员 潜伏。您的方法在第一次时对延迟不友好 请求。
2. AJAX 和渐进增强方法可以优化 Web 应用程序 体验让它感觉就像一个桌面应用程序。
3. 您需要重新发明或修改 FireBug 等工具才能正常工作 一个包含所有资源的流。没有Web开发可以 想象现在没有这些工具。
4. 如果浏览器本身不支持这种方法，那么您将 仍然有很多时间编程和让浏览器知道 您的流包含什么以及如何处理它。到你的时候 处理流并触发所有必要的事件（在最佳 序列！）您可能无法获得预期的收益。

祝你好运！