为什么localStorage不用于存储静态资源?

0 javascript html5 application-cache local-storage

这个问题在逻辑上遵循这个问题:

HTML5应用程序缓存是否相关?

很明显,热门网站没有使用HTML 5应用程序缓存来保存静态资源.

只需检查<html>标记中的清单属性即可.它不在那里.

进一步研究HTML5 localStorage也没有被使用.

作为测试案例,我看了一下

  • www.google.com
  • www.twitter.com
  • www.facebook.com

只需进入控制台并输入

localStorage.
Run Code Online (Sandbox Code Playgroud)

并且控制台应该弹出一个键列表.

这些站点都没有将其静态数据保存到磁盘中吗?

为什么是这样?

对于没有改变的资源来说,打击网络似乎是浪费资源.

详细说明.如果单击"重新加载",该页面将重新下载静态资源.使用Google,您甚至可以在URL路径中看到"静态"一词.但是对于这个问题,我使用了这个词的概念意义.

Pau*_*ite 6

很明显,热门网站没有使用HTML 5应用程序缓存来保存静态资源.

您误解了应用程序缓存的设计目的.这是应用程序缓存规范的第一段:

为了使用户能够继续与Web应用程序和文档进行交互,即使他们的网络连接不可用 - 例如,因为他们在ISP的覆盖范围之外旅行 - 作者可以提供清单,列出Web所需的文件应用程序脱机工作,并导致用户的浏览器保留文件的副本以供脱机使用.

http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#introduction-5

因此,应用程序缓存旨在允许Web应用程序作者在网络连接不可用时使其应用程序正常工作.

我无法想象谷歌,Twitter或Facebook如何在没有网络连接的情况下有效地工作.它们都依赖于用户在其服务器上与大量数据(在Twitter和Facebook的情况下,关于其他用户的数据)进行交互.没有网络连接,它们本身就没用了.

同样,localStorage不是为存储可能更改的页面资源而设计的.(我认为你建议这些网站可以在localStorage中存储CSS,JavaScript和图像文件 - 如果我误解了,请道歉.)

本规范引入了两种相似的机制,类似于HTTP会话cookie,用于在客户端存储结构化数据......

第一个是针对用户执行单个事务但可能同时在不同窗口中执行多个事务的场景而设计的...

第二种存储机制设计用于跨越多个窗口的存储,并且持续超出当前会话.特别是,出于性能原因,Web应用程序可能希望在客户端存储兆字节的用户数据,例如整个用户创作的文档或用户的邮箱......

http://www.w3.org/TR/webstorage/#introduction

为了使用localStorageCSS,JavaScript和图像文件,您需要在页面中检查页面localStorage所需的每个资源的一些JavaScript ,然后(不知何故)检查服务器以查看是否有更新版本,如果有更新版本,请抓住它必要的,然后将资源添加到页面的DOM(如果它是新的,则将其存储在localSorage中).

这是基本上复制Web浏览器已经执行的缓存的大量代码.当您的JavaScript正在检查localStorage和服务器时,页面停止渲染.而当浏览器本身下载CSS和图像文件时,页面可以继续进行渲染.