Node.jsのレスポンスでgzip圧縮を有効化…転送量削減の手順

Node.jsでもgzip圧縮配信を有効にしたい。

もしapacheとかのソフトを使ってる場合、
設定 .htaccess とかで有効にできるから簡単です。

でもNode.jsでは .htaccess は使えません。

そこで転送量を減らすための対策として、
Node.jsでgzip配信を有効化する手順を紹介します。

このページの目次

gzip圧縮とは何？転送量削減に有効
１．初めにcompressionをインストール
２．全HTTPレスポンスでgzip圧縮を有効に
３．gzip圧縮配信が有効かどうか確認する
gzip圧縮配信する下限（threshold）も設定可能
転送量削減ならgzip圧縮配信がベスト

gzip圧縮とは何？転送量削減に有効

gzip圧縮は元々linuxで使われてる奴です。

▼ 詳しい解決はWiki君を参照

gzip圧縮とは、ファイル圧縮方法の一つで、テキストファイルをサーバー上で自動的に圧縮して配信することが可能になります。gzip圧縮を適用することで、Webページのサーバーとユーザーが使用しているPCで通信しているデータサイズを小さくすることができます。一般的にgzip圧縮によるファイルの圧縮率は約60~70%と言われています。
引用元　：　https://digitalidentity.co.jp/blog/creative/gzipcompress.html

gzipというのは広く使われてる形式。

平均圧縮率が60～70%ほどなので、サーバー転送量を減らせるメリットがあります。これはAWSとかの従量課金を減らすのにとても有効です。

あとデータ量が減らせて表示速度も速くなる

１．初めにcompressionをインストール

gzip配信にはあるライブラリを使用します。

その名も compression というライブラリ

環境的には Node.js + Express.js で動きます。

▼ 早速インストールしてみる

> npm i compression

1	> npm i compression

最新バージョンは6.14.12の模様

２．全HTTPレスポンスでgzip圧縮を有効に

この設定は本当にとても簡単です。

▼ 例えばexpress側でgzip圧縮配信を有効にする例

const express = require('express');
const app = express();

///圧縮ライブラリ compression を使用
const compression = require('compression');

// 全HTTPレスポンスでgzip配信有効化
app.use(compression());

/// あとは普通のGETとかPOSTの処理が続く…
/// 以下はGETレスポンスの例
app.get('/hello', async (req, res, next)=>{
  /// 適当にJSONレスポンスを返す
  const message = 'hello';
  const response = [];
  for(i=0;i<1000;i++){
    response.push(message);
  }
  res.status(200).json(response);
});

/// 3000番ポートで待機
app.listen(3000, function () {
  console.log('listening on port 3000');
});

const express = require('express');

const app = express();

///圧縮ライブラリ compression を使用

const compression = require('compression');

// 全HTTPレスポンスでgzip配信有効化

app.use(compression());

/// あとは普通のGETとかPOSTの処理が続く…

/// 以下はGETレスポンスの例

app.get('/hello', async (req, res, next)=>{

/// 適当にJSONレスポンスを返す

const message = 'hello';

const response = [];

for(i=0;i<1000;i++){

response.push(message);

}

res.status(200).json(response);

});

/// 3000番ポートで待機

app.listen(3000, function () {

console.log('listening on port 3000');

});

たったこれだけ。

見てわかる通り、 app.use(compression()); を書いた時点ですべてが完了しています。GET/POST/PUTなど全HTTPリクエストのレスポンスでgzip配信が有効になります。

本当にこれ以外に書くことがない…超簡単

３．gzip圧縮配信が有効かどうか確認する

本当にgzip圧縮されてるか確認したい…

そういう時は開発者ツールを使います。

まずChrome開発者ツールをF12を押して開き、
その中からNetworkタブを開いてみてください。

そしたら対象のレスポンスをクリック

あとはResponse Headersの中身を見るだけです。

▼ Content-Encodingがgzipなら成功

ちなみに確認時はCtrl+F5でリロードして確認します。

gzip圧縮配信する下限（threshold）も設定可能

このcompressionを使って気づいたことが１つ

データ量が少ない場合はgzipが有効にならない

具体的には1KB以下だと圧縮がされないようです。

もしその閾値（threshold）を変えたい場合、
以下のようなオプションを設定することもできまzす。

▼ thresholdオプションの設定

app.use(compression({
  threshold: 300
}));

app.use(compression({

threshold: 300

}));

※ この例だと300bytes以下だと圧縮無効

もし threshold: 0 にすると逆に増えることもあるため、300～1000の間にしておくのが無難かなと思います。ちなみにデフォルトの値は1000です。

ここは各自の環境で調整してください。

転送量削減ならgzip圧縮配信がベスト

転送量を削減するならgzip圧縮は外せないです。

▼ 特にこういう環境ではなおさら

転送量に重量課金されるクラウドサービス
例えばAWSとかAzureとかgcpとか…

以上、Node.jsでのgzip圧縮配信でした。ではまた

Node.jsのレスポンスでgzip圧縮を有効化…転送量削減の手順

gzip圧縮とは何？転送量削減に有効

１．初めにcompressionをインストール

２．全HTTPレスポンスでgzip圧縮を有効に

３．gzip圧縮配信が有効かどうか確認する

gzip圧縮配信する下限（threshold）も設定可能

転送量削減ならgzip圧縮配信がベスト

関連記事

プロフィール

人気記事

検索してみる