Newly available 主要ブラウザの最新版で対応済み。古いブラウザが対象外なら使用可能。

概要

Service Worker の登録時に { type: 'module' } を指定することで、Service Worker 内で import/export 構文が使用可能になります。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
api.ServiceWorker.ecmascript_modules
91
91
147
15
91
15
ステートメント
service worker support

サービスワーカーで利用可能

91
91
147
15
91
15
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 2件
実装メモ
  • ネストされたワーカーのサポートはSafari 15.5で導入されました。
  • ネストされたWorkerでのスクリプト読み込みがSafari 16.4で導入されました。
注釈 2件
実装メモ
  • iOS15.5のSafariでネストされたワーカーのサポートが導入された。
  • ネストされたワーカーでのスクリプト読み込みは、iOS 16.4のSafariで導入されました。

基本構文

JAVASCRIPT
navigator.serviceWorker.register('/sw.js', { type: 'module' });

実務での使いどころ

  • JavaScript modules in service workers の活用

    Service Worker 内で ES Modules の import/export を使用可能にする機能。

注意点

  • 古いブラウザ(IE等)では対応していない。対象ブラウザを確認すること。

アクセシビリティ

  • JavaScript による動的更新時は、aria-live リージョンで変更をスクリーンリーダーに通知する。

Powered by web-features