r-yanyoのブログ

アイコン画像

ブログを最適化する

(1)gzipでコンテンツを圧縮する

  • blog

dev.to と阿部寛のホームページどっちが速いですか?というめっちゃ面白い記事を見ました。

その記事では Google のPageSpeed Insightsという Web ページを評価するためのツールを利用して、dev.to と阿部寛のホームページを比較しています。

ということでこのブログの評価を見てみます。

スコアは41と結構酷くなってしまいました。この記事を書くちょっと前に計測したときは 90 超えていたのに、記事やコードを増やしたら一気に悪くなってしまいました。(ちなみに阿部寛のホームページのスコアは 92 らしい)

で、このPageSpeed Insightsは Web ページが遅い原因も教えてくれて、このブログではコンテンツを gzip 圧縮していないよとのことでした。コンテンツっていうのは HTML とか JavaScript とか CSS とか画像とか、とにかく全部です。

このブログのサーバサイドはExpressで書かれていて、そのドキュメントを見ると、以下のようにして gzip 圧縮をしたコンテンツを送信してくれるそうです。

var compression = require('compression')
var express = require('express')
var app = express()
app.use(compression())

で、実際にやってみると、

となり、スコアは92まで上昇しました。他にも遅い原因としてキャッシュを利用していないことが分かったので、それは後で解決します。たぶん。