Question

本地存储

HTML5 存储为 web 站点提供了一种将信息存储到电脑上，并且能够在以后将数据取出的能力。这个概念非常类似于 Cookie，但是它可以存储很大量的信息。Cookie 有大小限制。浏览器每次请求新的页面的时候都要讲 cookie 内容发送回服务器（这意味着会占用一定的时间和带宽）。HTML5 存储在你的计算机上，web 站点在页面加载完成之后使用 JavaScript 进行访问。

FAQ

Q: 本地存储真的是 HTML5 的一部分吗？为什么它是一个独立的标准？

A: 简单的答案是：是的，本地存储是 HTML5 的一部分。更完整的答案是，本地存储曾经是 HTML5 主标准的一部分，但后来被分离出来，因为 HTML5 Working Group 中有些人抱怨说 HTML5 太大了。这听起来像是将一个大饼分成几个小块可以减少类别数……好吧，他们就是这么想的——欢迎来到奇怪的标准世界！

我们使用第一种技术来检测浏览器是否支持 HTML5 本地存储。如果浏览器支持 HTML5 存储，那么全局的 window 对象将会有一个 localStorage 属性；否则该属性将会是 undefined 的。不过，对于老版本的 Firefox，这种检测方法有一个 bug：如果 cookie 被禁用，这个测试将引发一个异常。为了解决这个问题，我们需要使用 try…catch 块。

function supports_local_storage() {
    try {
        return 'localStorage' in window && window['localStorage'] !== null;
    } catch(e){
        return false;
    }
}

如果你不愿意自己编写代码，当然也可以使用 Modernizr(1.1 或更新版本)：

if (Modernizr.localstorage) {
    // window.localStorage is available!
} else {
    // no native support for local storage :(
    // maybe try Gears or another third-party solution
}

注意，JavaScript 是大小写敏感的。Modernizr 的属性叫做 localstorage （全部是小写字母），而 DOM 的属性则是 window.localStorage 。

FAQ

Q: HTML5 存储数据库的安全性怎么样？是不是每个人都能读取？

A: 只要能物理访问你的计算机的人都可以查看（甚至是修改）HTML5 存储数据库。但是通过浏览器，任何站点只能读取、修改自己的值，不能访问别的站点存储的内容。这被称作“同源限制”。

Web Workers

Web Workers 允许浏览器在后台运行 JavaScript 代码。使用 web workers，你可以创建可以在同一时刻运行的多个“线程”（类似你的计算机可以在同一时刻运行多个应用程序）。这些“背景线程” 可以用于执行复杂的数学计算、网络请求或者在主页面响应用户的滚动、点击或者输入时访问本地数据等。

我们可以使用第一种技术检测 web workers。如果浏览器支持 Web Worker API，则全局的 window 对象会有一个 Worker 属性；否则该属性将会是 undefined 的。

function supports_web_workers() {
    return !!window.Worker;
}

如果你不愿自己编写代码，可以使用 Modernizr(1.1 或更高版本) 做相关检测：

if (Modernizr.webworkers) {
    // window.Worker is available!
} else {
    // no native support for web workers :(
    // maybe try Gears or another third-party solution
}

注意 JavaScript 是大小写敏感的。Modernizr 的属性是 webworkers （全部是小写字母），而 DOM 则是 window.Worker 。

离线 Web 应用程序

离线浏览静态页面是很简单的：只需要连接 Internet，加载 web 页面，然后断开连接，根据你的计划阅读页面就可以了。但是如何离线使用 web 应用程序，比如 Gmail 或者 Google Docs？HTML5 就允许任何人（不仅仅是 Google）创建一个能够离线工作的 web 应用程序。

离线 web 应用程序和在线 web 应用程序一样的启动。第一次访问一个允许离线使用的 web 站点的时候，服务器会告诉浏览器那些文件是要在离线工作时使用到的。这些文件可以是任何文件——HTML、JavaScript、图像，甚至视频。一旦浏览器下载下来所有必须的文件，你就可以在不连接 Internet 的时候重新访问这个 web 站点。浏览器会注意到你在离线，就会自动使用已经下载下来的文件。当你恢复在线时，你所做的任何修改都将上传到远程 web 服务器。

我们使用第一种技术检测离线支持。如果浏览器支持离线 web 应用程序，那么全局的 window 对象即有一个 applicationCache 属性；否则的话这个属性值将是 undefined 。所以我们有下面的检测方式：

function supports_offline() {
    return !!window.applicationCache;
}

我们也可以使用 Modernizr (1.1 或更新版本) 检测是否支持离线 web 应用程序：

if (Modernizr.applicationcache) {
    // window.applicationCache is available!
} else {
    // no native support for offline :(
    // maybe try Gears or another third-party solution
}

同样注意，Modernizr 的属性是 applicationcache (全部小写字母)，而 DOM 对象则是 window.applicationCache 。