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


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


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