Contents
現在的網頁應用程式都會架構成前端與後端，然後中間透過 Restful API 或是 GraphQL 來做遠端的資料請求
但是重複的資料一再對遠端服務做請求，一來沒效率，二來現在有些後端採用 Serverless 或是以 API 呼叫次數為計費，前端能盡量減少遠端 API 呼叫，除了能增加前端的反應速度，也可以減少後端的開銷
RFC 5861 - HTTP Cache-Control Extensions for Stale Content 就定義了這個需求，但是 RFC 5861 並不是網路的標準，僅供參考
今天要介紹的 React Hook 程式庫 – SWR ( stale-while-revalidate ) ，即是根據這份 RFC 5861 實現了這個快取功能，透過 SWR 對遠端做資料請求，會先查詢本地端的快取( Cache )，如果快取沒有對應的資料才會從遠端請求，這讓網頁前端的反應更快，可以 讓使用者體驗更好
專案功能特色
- 傳輸和通訊協議不可知資料獲取 – fetch function 是由你來定義，或是用第三方程式庫
- 快速頁面瀏覽
- 重新確認關注點 ( Revalidation on focus ) - 當視窗取得 focus 的時候
- 間隔輪詢 – 所以可用 idle 的時間定期更新 cache
- 局部修改 (Local mutation )
- 分頁
- 支援 TypeScript
- Suspense mode – 請參考 React Suspense mode
- Minimal API
專案網址
相關資訊
- 開源響應式 NoSQL 資料庫 – 這個開源資料庫也可以當作是 local 端的快取，而且支援後端資料庫的同步功能，其用途比較偏向開發離線功能的前端
- 一定要使用 SWR 的三個理由