web Worker和Service Worker 以及PWA学习

因公司移动端产品的需求，需要设计一套离线的模式。移动端是使用原生app壳子嵌套webview的模式，本来壳子已经提供了本地的数据库以供缓存数据使用。同时集成了Manifest 的功能。这个咋一听不就是PWA嘛，又能离线 。又能缓存文件。

pwa是集成了App Manifest和Service Worker了 其中前者可以缓存文件，比如一个项目中的所有的文件都可以进行缓存，这样的话，离线的话就可以直接使用读取缓存中的文件。因为还没有具体实践过现在就说说学习的一些理解和思想。等具体实践过后在来补充一下。

Service Worker  是一个独立于主线程之外的子线程，主要是用于离线请求，请求代理、转发、拦截等操作。同时可以实现消息推送。这个暂时不考虑，需要各个浏览器GCM服务。在国内还是稍微困难点。

Service Worker 只是一个常驻在浏览器中的 JS 线程，它本身做不了什么。它能做什么，全看跟哪些 API 搭配使用。
1，跟 Fetch 搭配，可以从浏览器层面拦截请求，做数据 mock；

2，跟 Fetch 和 CacheStorage 搭配，可以做离线应用；

3，跟 Push 和 Notification 搭配，可以做像 Native APP 那样的消息推送，

提到独立于主线程之外的子线程这个时候就多嘴提一下 web Worker

web Worker 是一个独立于主线程之外的子线程，因为Worker不能读取本地文件，所以脚本必须要从网络中来。主线线程调用postMessage向worker发送消息（比如发送需要处理的数据）然后通过onmessage来获得woker处理后的数据，

Web Worker 有两个特点：1，只能服务于新建它的页面，不同页面之间不能共享同一个 Web Worker。2，当页面关闭时，该页面新建的 Web Worker 也会随之关闭，不会常驻在浏览器中。）

ServiceWorker 有两个特点：1，Service Worker 不是服务于某个特定页面的，而是服务于多个页面的, 2，（按照同源策略） Service Worker 会常驻在浏览器中，即便注册它的页面已经关闭，Service Worker 也不会停止。本质上它是一个后台线程，只有你主动终结，或者浏览器回收，这个线程才会结束。生命周期、可调用的 API 等等也有很大的不同。）

 

文中Service Worker参考地址 https://github.com/youngwind/blog/issues/113