【前　　言】
我最初接觸PWA是在2017年年初，當(dāng)時參加了一個前端分享會，其中一個主題就是與PWA相關(guān)的，介紹了PWA的Service Worker和安裝到桌面的能力，以及這門技術(shù)未來的發(fā)展趨勢，聽完這個分享后，我就為PWA的一些能力所吸引。
Web本身的優(yōu)勢就非常明顯，如可分享，可搜索，無須下載，在任何設(shè)備上有相同的展示等，現(xiàn)在再加上PWA的能力，讓W(xué)eb在原有的基礎(chǔ)上具備了類原生應(yīng)用程序的功能，這對于Web開發(fā)者來說是一個福音，可以讓W(xué)eb提供更好的用戶體驗，也能帶來更多紅利。隨后，我便開始了對PWA的學(xué)習(xí)和探索之路。
在實際工作中，有很多場景適合使用PWA，這也使我的PWA實踐之路有了一個很好的前提條件。在實踐的過程中，并沒有想象的那么順利，PWA的大多數(shù)概念都有一些理解成本，一不小心就會犯錯，大多數(shù)情況下是一邊“挖坑”一邊“填坑”。當(dāng)然，最后在很多合適的場景中，我發(fā)現(xiàn)PWA的接入確實帶來了非常好的效果，為業(yè)務(wù)產(chǎn)品帶來了更多價值，提升了用戶體驗。
本書是一本PWA技術(shù)入門和實踐的圖書。通過本書，你可以對PWA有較深入的理解并進(jìn)行一些項目實踐。本書對PWA的核心技術(shù)做了比較透徹的講解，對PWA中可能遇到的問題及一些注意事項也進(jìn)行了充分說明。閱讀過程中，所有的PWA知識點基本都可以在本書中找到說明。本書既可以作為一本PWA的入門圖書，也可以作為一本PWA的使用手冊。遇到關(guān)于PWA的問題時，請閱讀這本書，相信本書可以讓你找到問題的解決方法。
●第1章介紹PWA的發(fā)展歷程及生態(tài)環(huán)境，并為你開啟第一個PWA應(yīng)用示例，讓你對PWA有一個基本了解。
●第2章介紹PWA的一些前置技術(shù)及預(yù)備知識，讓你后面的學(xué)習(xí)過程更順暢，如果你對這部分知識已有所了解，則可以跳過這一章。
●第3章開始對PWA最核心的部分—Service Worker進(jìn)行講解，這一章詳細(xì)講解了Service Worker的各個知識點、注意事項及實踐。
●第4章開始進(jìn)入 PWA的核心API部分，在這一章中，你可以學(xué)習(xí)PWA的一些核心API，包含安裝到桌面、新一代網(wǎng)絡(luò)請求、消息通知、后臺同步、離線緩存、消息推送，該章中各小節(jié)屬于并行知識點，可根據(jù)需求閱讀任意一節(jié)。
●第5章介紹PWA使用過程中的一些配套工具，包括調(diào)試工具、評測工具和提效工具，等等，讓你的PWA開發(fā)過程更順暢。
●第6章為PWA的實踐部分，針對不同的功能需求進(jìn)行實踐講解。
●第7章講解Web的系統(tǒng)集成能力，讓系統(tǒng)集成能力配合PWA，使Web可以和應(yīng)用程序相媲美。
本書主要面向有一定Web開發(fā)基礎(chǔ)的讀者，以及想學(xué)習(xí)PWA或者需要一本全面的PWA手冊的開發(fā)者。
本書中用到的項目代碼可以通過GitHub下載，地址為https://github.com/lecepin/PWA-Book。


==================================================


【序　　言】
如今，互聯(lián)網(wǎng)大流量早已進(jìn)入了移動端，國內(nèi)主流互聯(lián)網(wǎng)產(chǎn)品的移動端流量已經(jīng)普遍超過整體流量的80%。在移動端應(yīng)用開發(fā)中，我們要面臨為不同操作系統(tǒng)（Android、iOS、Windows 10）、不同設(shè)備（手機(jī)、平板）開發(fā)應(yīng)用的問題，為此我們需要投入額外的成本應(yīng)對這些差異。就算我們投入了成本，開發(fā)出了產(chǎn)品，在下載和安裝環(huán)節(jié)，仍然存在很大的推廣成本問題。統(tǒng)計學(xué)研究表明，安裝煩瑣是用戶放棄嘗試更多應(yīng)用的主要原因之一。
PWA技術(shù)可以很好地解決這些問題。PWA運用現(xiàn)代的Web API能力為Web進(jìn)行了擴(kuò)展和增強，使Web具有與原生應(yīng)用程序類似的體驗度和能力。作為一種W3C的規(guī)范實現(xiàn)，PWA可以正常地運行在各個平臺的瀏覽器中，真正做到一套代碼解決所有平臺一致性問題。同樣，由于PWA具備安裝成本幾乎為0的特點，它非常適合實現(xiàn)Web端到應(yīng)用端的過渡，提升轉(zhuǎn)化率。
目前，國內(nèi)外越來越多的網(wǎng)站對PWA進(jìn)行了接入，如星巴克、優(yōu)步、推特、臉書、淘寶、餓了么，等等，接入后的性能和轉(zhuǎn)化率都有明顯提升。如今谷歌、微軟、英特爾等公司為PWA投入了技術(shù)支持和發(fā)展，Web的主流框架React、Vue等對PWA提供了快速接入方案，主流的瀏覽器廠商也緊跟其后，共同為PWA生態(tài)系統(tǒng)提供支持。
然而，根據(jù)我近幾年對國內(nèi)業(yè)界和前端社區(qū)的觀察，可以說PWA在國內(nèi)還沒有發(fā)揮出它應(yīng)有的作用。在這里，我嘗試分析一下其中的原因，以及未來趨勢。
第一，至少近三年，國內(nèi)前端領(lǐng)域的技術(shù)發(fā)展，除了跟隨國外最新動向之外，總的趨勢是業(yè)務(wù)屬性較強的技術(shù)更受重視。其中，最令人矚目的小程序相關(guān)技術(shù)，以及低代碼搭建相關(guān)技術(shù)，就是典型—兩者分別迎合了國內(nèi)頭部互聯(lián)網(wǎng)公司流量分發(fā)強管控的現(xiàn)實需求，以及中國互聯(lián)網(wǎng)產(chǎn)業(yè)逐步轉(zhuǎn)向企業(yè)服務(wù)的大背景。
PWA作為一個中立性很強的技術(shù)組合，盡管主要由Google推動，但其開放性以及主要著眼點在于優(yōu)化具體的產(chǎn)品體驗而非滿足業(yè)務(wù)訴求的特點，導(dǎo)致它在國內(nèi)主要由社區(qū)推動，聲量明顯不如商業(yè)推動力強的技術(shù)，處于一種“大家各取所需，卻不知道別人也在各取所需”的微妙境地。
面對這種狀況，作為技術(shù)人，我們要理性看待，而不是像一些跟風(fēng)者一樣片面地去肯定或者否定一項技術(shù)。事實上，PWA作為一個漸進(jìn)式的技術(shù)組合，其中的若干技術(shù)，比如Service Worker、離線存儲，乃至性能評估工具Lighthouse等，早已因其極強的實用性，在國內(nèi)得到了廣泛應(yīng)用。
第二，一項工程技術(shù)的落地，除了原理論證以及各種功能點與性能指標(biāo)的驗證之外，還需要一個成本頗高的“踩坑”過程。這不是找一兩個實習(xí)生通過Demo做個演示就可以解決的，而是需要實實在在的經(jīng)驗積累，其中既包含實現(xiàn)細(xì)節(jié)、性能優(yōu)化、技術(shù)權(quán)衡、應(yīng)對國內(nèi)特殊場景的技巧等知識的積累，又包含開發(fā)、運維、數(shù)據(jù)統(tǒng)計等必不可少的開發(fā)工作鏈路上的基礎(chǔ)設(shè)施建設(shè)與經(jīng)驗積累。
一直以來，PWA技術(shù)領(lǐng)域都缺乏優(yōu)質(zhì)、可靠的中文技術(shù)資料。對其做調(diào)研的團(tuán)隊，一方面直接參考官方文檔，一方面只能通過各種技術(shù)博客等不可靠的渠道獲取一些零散的信息，通過拼湊和嘗試積累經(jīng)驗，這無形中推高了技術(shù)調(diào)研的成本。
而你現(xiàn)在看到的這本書可以作為一個好的開始。作為第一本出現(xiàn)在我視野中的中文PWA技術(shù)書籍，這本書的優(yōu)點在于，它既不是文檔翻譯，也不是手把手教你敲命令，把開發(fā)技術(shù)寫成“菜譜”，而是涵蓋了從理論準(zhǔn)備到實操流程，再到經(jīng)驗分享的一本“全鏈路書籍”。它可以幫你真正理解PWA，同時獲得一些由作者親自驗證過的工程落地中“踩坑”的經(jīng)驗。從這個角度來說，這本書完全可以稱為“PWA民間中文指南”，有了它，我們終于擁有了一些可靠的、系統(tǒng)化的、本地化的、開箱即用的PWA技術(shù)資產(chǎn)。
第三，PWA的定位在于讓開發(fā)者快速開發(fā)出同時具備“優(yōu)質(zhì)的Web，輕盈的應(yīng)用”兩種屬性的產(chǎn)品。而這樣的屬性，在粗放發(fā)展的互聯(lián)網(wǎng)業(yè)態(tài)中，暫時沒有得到應(yīng)有的重視。
然而，事情正在發(fā)生變化。
在大家都在談?wù)摗盎ヂ?lián)網(wǎng)下半場”的時代，我們有必要思考“下半場”對于我們而言有什么樣的具體含義。我的個人理解是，所謂上半場，比的是人無我有，人慢我快；而下半場，比的是人有我優(yōu)，人粗放我精致，我們現(xiàn)在正在見證這樣的市場轉(zhuǎn)變。而PWA，作為一種顯著提高用戶體驗的技術(shù)，必然在這個過程中展現(xiàn)出它的優(yōu)勢，誰能更快更好地利用這種優(yōu)勢，誰就能在新階段的前端技術(shù)競爭中占領(lǐng)先機(jī)。
綜上，這是一本值得期待的書，它在一定程度上彌補了國內(nèi)PWA領(lǐng)域技術(shù)書籍的空白，并且將這個任務(wù)完成得相當(dāng)漂亮。如果有人請我分享前端技術(shù)書單，我想這本書應(yīng)該會位列其中。
—知乎知名技術(shù)作者　欲三更
2020年4月于杭州