テクニカル
Service Worker
ブラウザとネットワークの間で動くスクリプト。キャッシュ制御やオフライン対応を担う。
Service Workerとは？
Service Workerは、Webページとは独立してブラウザのバックグラウンドで動作するスクリプトです。
ネットワークリクエストを仲介し、キャッシュ制御・オフライン対応・プッシュ通知などを実現します。
PWAの中核技術であり、一度訪れたページのリソースをキャッシュして、再訪問時やオフライン時に高速表示します。
HTTPS環境でのみ動作します。
Service Workerの使い方・実践方法
Service Workerでできることは次のとおりです。
- リソースのキャッシュによる再訪問時の高速化
- オフラインでもページを表示
- バックグラウンド同期・プッシュ通知
- ネットワーク戦略（キャッシュ優先/ネットワーク優先）の制御
Service Workerで押さえるべきポイント
Service Workerのキャッシュ戦略を誤ると、更新したはずのコンテンツが古いまま表示される事故が起きます。
バージョニングとキャッシュ更新の仕組みを設計に組み込むことが、安全な運用の前提になります。
Service Workerを実践するなら
Saguru なら、月額270円から、SEOキーワード調査・上位サイト分析・自サイトSEO診断のすべてが使えます。
「Service Worker」を理解した上で、すぐに実践に移せます。
登録なしで1日5回まで無料 ／ メール登録で1日30回 ／ ベーシック月額270円 ／ 自サイトをSEO診断
Service Workerについてよくある質問
Service WorkerはSEOに影響する？
適切に使えば表示速度とオフライン体験を改善します。
ただしクロール対象のコンテンツを隠さない配慮が必要です。
ただしクロール対象のコンテンツを隠さない配慮が必要です。
HTTPでも動く？
いいえ。
セキュリティ上、HTTPS（とlocalhost）でのみ動作します。
セキュリティ上、HTTPS（とlocalhost）でのみ動作します。
古いキャッシュが表示される問題は？
キャッシュのバージョニングと更新ロジックを実装することで防げます。