前言

想起这个思路的缘由是在medium上看到很多关于PWA的文章，但是国内接受度似乎还不高，因此我也没太在意，看了下PWA的简洁，知道它的一些优点之后就没打算深入学习。直到今天看见一篇文章这样形容PWA：

可以把它（PWA）理解为国外版的小程序

这让我对PWA的实现产生了一定的兴趣。

为什么

这个问题的原因其实官网有详细的阐述，我这里用比较通俗的语言解释一下：

1. 首先我们要了解的是原生应用对于我们来说体验确实是要比web应用好的，而PWA 能做到原生应用的体验，这就产生了很大的价值，因为它并不是去重新做一个原生应用，而是经过应用一些新技术进行改进，在安全、性能和体验三个方面都有很大提升。而这样的技术，目前是有一套还算固定的解决方案的。
2. 它可以在web端打开，也可以通过桌面图标打开，同时它提供的 Service Worker 能够让用户在网络条件很差的情况下也能瞬间加载并且展现，并且这种桌面图标举有类似于原生应用的一些操作逻辑。
3. 同时他也克服了一些原生应用需要更新或者去软件商店下载等问题，又或者是web应用无版本等问题，因为PWA永远是最新版。

体验的话大家在移动端直接搜lavas，会出现让你把lavas添加到主屏幕的选项，或者angular的官网也有PWA式的官方文档的上手说明,dev也做出了体验很好的PWA。

说到我看到的那段话，小程序为什么能流行起来，一个是用户想在最短时间内获取服务而小程序不需要下载APP，一个是商家想通过自己的平台从线上引流，扩大营销渠道，沉淀用户的需求 ，PWA想做的也是相似的事情，甚至更加全面。

是什么

具体讲之前，我们还是要先搞懂PWA，渐进式网络应用，一个很突出的特点就是渐进式，学习Vue的同学肯定不陌生，为什么要强调渐进式，一个是因为应用的迁徙不是一蹴而就的，另一个是PWA确实先行的标准还没有非常成熟，解决方案也不是非常成熟，可以说还在一个稳步上升的阶段。

那么说回来，我们有必要在这个时候学吗？

这就不得不说到网络性能优化的问题，我们从前端工程师的角度来看这个面试被问烂的问题， 答案无非是CDN、CSS Sprite、文件的合并压缩、异步加载、资源缓存，而Service Worker，这个新东西可以做到甚至离线状态下秒开并浏览站点。

这个特性的具体实现原理我也不清楚，我们作为使用者最关注的无非是这个特性能不能被使用，好消息是效果还不错：

怎么用

我想做React的应该都用过create-react-app这个官方脚手架，也有人安装完就会把src文件夹下清空自己写，也有人会注意到一个文件，还有index.js 中的这样一段话：

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: http://bit.ly/CRA-PWA
serviceWorker.unregister();

也就是说，如果我们想要启动service worker这个东西，只要换成register()即可。
具体的一些操作大家可以去creat-react-app的官网去查看。这里只是简单的做一个介绍。

除此之外，对于Vue，我们上文提到的lavas也是一种解决方案。

最后需要说的

尽管PWA做的已经很不错了，但是我们需要注意的是，在国内微信小程序如此火热的今天，PWA在国内的前景真的不明朗，毕竟小程序的一些优化做的和原生应用也是非常相近了，而且这两者针对的痛点在一定程度上是有重合的。

但其实不影响我们去学习，对吧。