八股文之：HTML5 + BOM + DOM

HTML5的新特性：

拖放（ Drag and drop）
语义化标签（ header、nav、 footer、 aside、 article、 section）
音视频（ audio、 video）
画布（ Canvas）
地理（ Geolocation）
本地存储（ localStorag、sessionStorage）
表单控件 （calendar、date、time、 email、url、 search）
WebWork（多线程处理）
WebSocket（长链接双向通讯协议）

浏览器线程：

一个浏览器至少存在三个线程：
js引擎线程(处理js)：JavaScript引擎是基于事件驱动单线程执行的，JS引擎一直等待着任务队列中任务的到来然后加以处理，浏览器无论再什么时候都只有一个JS线程在运行JS程序
渲染线程(渲染页面)：负责渲染浏览器界面，当界面重绘(repaint)或回流(reflow)时,该线程就会执行。GUI渲染与JS引擎是互斥的，当JS引擎执行时GUI线程会被挂起，GUI更新会被保存在一个队列中等到JS引擎空闲时立即被执行
浏览器事件触发线程(控制交互):当一个事件被触发时该线程会把事件添加到待处理队列的队尾，等待JS引擎的处理,如：setTimeOut、鼠标点击、AJAX异步请求

WebWork：

运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能
限制：脚本文件同源，无法读取本地文件，无法访问DOM节点、window、document、全局变量、全局函数、无法调用alert、confirm之类的函数，可以使用XMLHttpRequest发出ajax请求
webWork分为两种类型：专用线程（只能被创建它的页面访问）、共享线程（可以被多个页面访问）
专用线程用法：使用 onmessage() ， postmessage()通信
            let worker = new Worker("1.js",{})
共享线程用法：用到port属性，接收监听connect
            let worker = new SharedWorker("2.js")
用途：加密数据,可以使用XMLHttpRequest预取数据,预渲染,复杂数据处理(检索、排序、过滤、分析),[预加载图片](zhuanlan.zhihu.com/p/79484282)
注：启动worker会比较耗费资源
用法参考：http://www.ruanyifeng.com/blog/2018/07/web-worker.html

WebSocket