1. 資源下線offline模式
    1. static site assets會自動被cache,下一次開起就超快
    2. 遠離wifi時app還是可以使用
  2. 開起時顯示splash screen
  3. 支援push notifications
  4. 網頁可以在手機首頁home screen下載一個app icon
  5. 網頁設計基本上會長的像手機app一樣


Service Workers

  • Service workers (client-side proxies that pre-cache key resources) enable PWAs to load instantly and provide an instant, reliable experience for users, regardless of the network state
  • This is a browser capability to provide an intermediate layer between the Web App and the network, which runs in the background (even when the application is closed). This “network” layer is capable of listening and sending requests, notifications or even capturing connectivity changes
  • 實作PWA是靠web browser內建在背景跑的一個程式
  • React已經內建好browser的service worker功能,請看src/servicewWorker.js。只需要呼叫serviceWorker.register();就搞定了
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));

// 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: