Upgrade to Pro — share decks privately, control downloads, hide ads and more …

エディター付きのReact開発環境を ブラウザーだけで実装した話

Hori Godai
March 17, 2024
1.6k

エディター付きのReact開発環境を ブラウザーだけで実装した話

ぜひmosya Reactで遊んでみてください!

https://mosya.dev/react

Hori Godai

March 17, 2024
Tweet

More Decks by Hori Godai

Transcript

  1. 1 ブラウザーとサーバー間のプロキシーとして動作 2 キャッシュ機能 3 プッシュ通知機能 Push APIを使うことでサーバーからの通知を検知してそれをブラウザーに表示させることができます。 Service Workerはリクエスト結果などをキャッシュとしてキャッシュストレージに保存することができます。

    この機能によってオフラインでもサイトを表示することが可能になったりします。 プレビュー環境の実装にServiceWorkerを利用 Service Workerはブラウザーからサーバーへのリクエスト時にそのリクエストに介在して、リクエストやレスポ ンスに対して変更を加えることができます。これをうまく利用することでリクエストされたファイルをコンパイ ルするコンパイラとして機能させられます。