前端pwa简介

什么是PWA

Progressive Web Application，全称“渐进式网页应用”，是Google 在2016年提出的概念，2017年落地的web技术。目的是在移动端利用提供的标准化框架，在网页应用中实现和原生应用相近的用户体验的渐进式网页应用。

引用官方介绍：

1.可靠——即时加载，即使在不确定的网络条件下也不会受到影响。
当用户从主屏幕启动时，service work可以立即加载渐进式Web应用程序，完全不受网络环境的影响。service work就像一个客户端代理，它控制缓存以及如何响应资源请求逻辑，通过预缓存关键资源，可以消除对网络的依赖，确保为用户提供即时可靠的体验。
2.快速
据统计，如果站点加载时间超过3s，53% 的用户会放弃等待。页面展现之后，用户期望有平滑的体验，过渡动画和快速响应。
3.沉浸式体验—— 感觉就像设备上的原生应用程序，具有沉浸式的用户体验。
渐进式Web应用程序可以安装并在用户的主屏幕上，无需从应用程序商店下载安装。他们提供了一个沉浸式的全屏幕体验，甚至可以重新与用户接触的Web推送通知。Web应用程序中，可以通过manifest.json控制应用程序的显示方式和启动方式，指定主屏幕图标、启动应用程序时要加载的页面、屏幕方向，甚至可以指定是否显示浏览器Chrome。

核心 Service Workers

Service worker是一个JavaScript worker 运行在 web worker上下文，因此它不能直接访问DOM，service worker 可以通过postMessage 接口与跟其相关的页面进行通信,发送消息,从而让这些页面在有需要的时候去操纵 DOM 。不同于主线程，它运行在其他线程中，所以不会造成主线程阻塞。它设计为完全异步，同步API（如XHR和localStorage）不能在service worker中使用。

Service workers 本质上充当Web应用程序(服务端)与浏览器(客户端)之间的代理服务器。
可以提供有效有效的离线体验，拦截网络请求。还可以推送通知。

使用注册Service worker

if ("serviceWorker" in navigator) {
   
    window.addEventListener