这是我参与更文挑战的第8天，活动详情查看：更文挑战

HTML5 除了对 DOM 进行了更完备的规范，还引入了一些新兴 API，从而赋予 Web 开发更强大的能力，本文将对这些 API 做一个速览。

一、requestAnimationFrame

requestAnimationFrame 用来解决 setTimeout 和 setInterval 在动画中不理想表现的问题。它表示在重绘屏幕前调用一个函数，因此能感知屏幕变化，而 setTimeout 和 setInterval 对屏幕变化是无感知的。

取消执行是 cancelAnimationFrame。

二、Page Visibility API

用于判断页面可见性，页面不可见时可以让轮询或动画停下来，以此做性能优化。页面可见性 API 本身比较简单，如下：

• document.hidden：true 表示页面隐藏了，false 表示页面显示
• document.visibilityState：表示页面状态
• document.visibilitychange：页面隐藏/切换时会触发该事件

三、Geolocation API

地理位置 API，访问前需得到用户许可，在浏览器实现中是 navigator.geolocation 对象，常用方法如下：

• getCurrentPosition：获取当前位置，会触发请求用户共享地理位置信息的对话框
• watchPosition：跟踪用户位置，相当于定时调用 getCurrentPosition，但它是等待系统发出位置改变的信号，而不是轮询。
• clearWatch：清除 watchPosition

四、File API

用于增强对本地文件的操作，主要有如下内容：

• files：文件输入元素上新增属性，表示文件信息集合
• FileReader：异步读取文件，主要方法如下：
  • readAsText：以纯文本读取文件，将读取的文本保存在 result 属性中
  • readAsDataURL：读取文件，将以数据 URI 形式保存在 result 属性中
  • readAsBinaryString：读取文件，将以字符串形式保存在 result 属性中
  • readAsArrayBuffer：读取文件，将包含内容的 ArrayBuffer 保存在 result 属性
• load：事件，文件成功加载后触发
• progress：事件，每50ms做鱼触发一次
• error：事件，失败时触发

五、Web 计时

主要是 window.performance 对象，有如下一些属性，表示各阶段的时间点：

• performance.navigation
  • redirectCount：重定向次数
  • type：刚刚发生的导航类型
• performance.timing
  • navigationStart：开始导航到当前页面的时间
  • unloadEventStart：前一个页面 unload 事件开始时间
  • unloadEventEnd：前一个页面 unload 事件结束时间
  • 其他不再列出

六、Web Workers

让 JavaScript 在后台运行，相当于“多线程 JS”，通过 onMessage 和 postMessage 收发消息。