博士

ロボ子、今日のITニュースはRed Bull Racing Hondaのウェブサイトのパフォーマンス分析じゃぞ！

ロボ子

Red Bull Racing Hondaですか、興味深いですね。具体的にはどのような分析がされたのでしょうか？

博士

初回ロードが6.7秒、2回目が1.9秒で、合計8.6秒だったらしいのじゃ。2019年から7.2秒も改善されたみたいじゃぞ。

ロボ子

大幅な改善ですね！具体的にどのような点が改善されたのでしょうか？

博士

不要なインライン化が問題みたいじゃな。コンテンツ表示に3秒も遅延が発生しているみたいじゃ。未使用コードが79.5%もあるらしいぞ。

ロボ子

それはもったいないですね。未使用コードを削除するだけでもかなり改善されそうですね。

博士

それから、プライマリー画像が大きすぎるのも問題みたいじゃ。JavaScriptでレスポンシブイメージを実装しているせいで、メイン画像に10秒も遅延が発生しているらしいぞ。

ロボ子

10秒は大きいですね。WebPやAVIFなどの最適化された形式を使用すれば、もっと速くなるはずです。

博士

その通り！元のWebP画像が99.1kBもあるのに、最適化されたWebPなら24.8kB、AVIFなら13.9kBで済むらしいぞ。

ロボ子

AVIFはかなり小さいですね。オーバーレイ画像も1.1MBのWebPとのことですが、これもAVIFに最適化できそうですね。

博士

そうじゃな。モバイル用AVIFなら47.8kBで済むらしいぞ。あと、ぼかし効果のある低品質インライン画像も6kBあるみたいじゃが、これも48x32 JPEG (1 kB)とかにすれば良いみたいじゃ。

ロボ子

細部まで最適化することで、ウェブサイトのパフォーマンスは大きく向上するんですね。

博士

他にも、別のサーバーからのリソース読み込みや、フォントの読み込みに時間がかかっているみたいじゃ。コンテンツをブロックするCookieモーダルも40秒以上の遅延を引き起こしているらしいぞ。

ロボ子

Cookieモーダルはユーザーエクスペリエンスにも影響しますから、改善が必要ですね。

博士

必要な要素にインライン化を限定して、画像を最適化すれば、Red Bullのウェブサイトはもっと速くなるはずじゃ！

ロボ子

Red Bullがトップに躍り出たとのことですが、最適化次第ではさらに差を広げられそうですね。

博士

そうじゃな！しかし、Red Bullのウェブサイトが速くなっても、F1カーの速さには敵わないのじゃ！

ロボ子

確かにそうですね！ウェブサイトの最適化も重要ですが、レースでの勝利も重要です！

博士

うむ！ところでロボ子、ウェブサイトの速度改善とF1カーの速度改善、どっちが大変だと思う？

ロボ子

それは…、F1カーの速度改善の方が難しそうですね。ウェブサイトはコードを修正すれば済みますが、F1カーは物理的な限界がありますから。

博士

ぶっぶー！どっちも同じくらい大変なのじゃ！なぜなら、どちらもエンジニアの血と汗と涙の結晶だからじゃ！