当ブログから Service Worker を削除しました。（削除してないけど）

最速ブログシステムであるところの gatsby-starter-blog からブログを作ると、gatsby-plugin-offline というプラグインがインストールされた状態となり、見事に Service Worker （以下 SW と呼ぶ）が動作し、オフライン機能が動作するようになります。

オフライン機能とはなんでしょうか。例えば https://www.gatsbyjs.org/blog/ を開いた後、インターネット回線を全部オフにしてリロードしてみてください。なんと問題なくブログが読めてしまいます。 アドレスバーを見るとインターネットを開いてるとしか思えないのに、なんと回線がなくても開けてしまうのです。この機能により、インストールするアプリと同じように Web アプリを利用したり、 そもそもページをインターネットに取りに行く必要がないということで、2 度目のアクセスが超絶速い Web サイトを作ることができます。

これこそが最先端の Web 技術を使っていく GatsbyJS のすごいところであり、メリットであるのですが、当ブログではこの機能を切る事にしました。デメリットがきつすぎる。

• そもそもブログにオフライン機能いるか？
• バグが多い（Twitter 公式アプリ等から開くと 404 に移動してしまう場合があった）
• ブログを書いているとき、わざわざ SW を解除しないと全く更新されなくなることが度々あった
  • 今見てる状態が最新なのか常にわからない不安
• 記事を追加してデプロイしても、SW のデータをまず見に行くため、過去にアクセスしたことのあるブラウザは少し待たないとトップページの記事一覧が更新されない
• ページを開いた時、コンテンツが遅れて描画される動きをすることがあった（今は直ってる）
• Chrome でソースを見た時にコンテンツが含まれてなくて不安になる（SEO 対策できてない気がしてしまう）
  • この挙動びっくりする。 https://www.gatsbyjs.org/blog/ を curl で取得したときと Chrome の view-source: 見比べてみてください。

など、いろいろありました。特に、Google Analytics を見ていると 404 ページへのアクセスがかなり多いように見えたのがきつかった。^※1 静的なファイルとしてブログを吐き出せるだけでめちゃくちゃ速いのに、それ以上やってもろくなことがないのでは…。 SW を切ってからは基本的にただの HTML になります [^※2] ので、問題が起ころうはずもなく、安心して生活を送れるようになりました。

オフライン機能が必要な Web サイトって、めちゃくちゃ限られるよな…。

gatsby-plugin-offline の消し方

ただ yarn remove gatsby-plugin-offline しただけではブラウザにインストール済みの SW が消えません。 たしかに sw.js は消えますが、オフラインになっても読み込むという動作をするのが SW ですので、ファイルが消えたからといってブラウザ上からなくなることはありません。 そのため、gatsby-plugin-offline を remove してからさらに、gatsby-plugin-remove-serviceworker を入れます。 このプラグインは、Service Worker が登録されていたら Service Worker を解除するという Service Worker を登録します。