LoginSignup
50
35

More than 3 years have passed since last update.

ZEIT Nowで静的サイトの速度を15倍改善した話

Last updated at Posted at 2019-11-27

はじめに

公開されているコンテナの脆弱性をまとめるサイトを運用しています。
image
https://containers.goodwith.tech/

サイトのホストには、当初Netlifyを利用していて、ファイルサイズの大きいデータがある場合、データのダウンロードにとても時間がかかっていたのですが、ためしにZEIT Nowを利用したところ、劇的に速度が改善しました。

その後、それぞれのサービスの違いなどをまとめたものを記事にします。

結論

  • 大きなファイルを扱う場合はZEIT Nowが圧倒的に速い
    • ZEIT NowはBroti圧縮なので多少ファイルサイズが小さくなる
    • ZEIT NowのWTTFが長いので何かしら最適化処理を行っているのかも
  • 最終的には、どちらも利用して比較してみるのがいいと思う

HTTP responseで見た比較表

ざっくりした違いをまとめました。

ZEIT Now netlify
URL https://vulnimage-4wgya6bpg.now.sh/ https://containers-goodwithtech.netlify.com/
protocol HTTP/2 HTTP/2
圧縮形式 Broti gzip
証明書 Let's Encrypt Authority X3 DigiCert SHA2 Secure Server CA
WTTF (10MBダウンロード時) 1.2~2.0sec 100~500msec
Download (10MBダウンロード時) 100~500msec 20~30sec
MAX_CONCURRENT_STREAMS
(並列ダウンロード/ストリーム)
128 150

雑な見解を言うと、ZEIT Nowの方が新しい技術を採用しています。

MAX_CONCURRENT_STREAMSに関しては Google Developerの記事が参考になります。複数のファイルを読み込む場合、基本的には数が大きい方が有利です。

詳細

Netlify

curl

    $ curl -I https://containers-goodwithtech.netlify.com/jsons/vaikas:nodejsservice/trivy.json 
    HTTP/2 200
    accept-ranges: bytes
    cache-control: public, max-age=0, must-revalidate
    content-length: 10456206
    content-type: application/json
    date: Sat, 02 Nov 2019 18:47:03 GMT
    etag: "9a7a82ab949f5eca3a33a545963f047f-ssl"
    age: 1
    server: Netlify
    x-nf-request-id: aa867750-0a7d-46af-a13f-4b6f09248853-28026257

Lighthouse

10MBのデータをダウンロード時のタイムライン
10MBのデータをダウンロード時

now.sh

curl

    $ curl -I https://vulnimage.tomoyamachi.now.sh/jsons/vaikas:nodejsservice/trivy.json 
    HTTP/2 200
    date: Sat, 02 Nov 2019 18:35:59 GMT
    content-type: application/json; charset=utf-8
    cache-control: public, max-age=0, must-revalidate
    content-length: 10456206
    content-disposition: inline; filename="trivy.json"
    access-control-allow-origin: *
    accept-ranges: bytes
    etag: W/"73c2159a3893c7ec49a81685696797519f7d0e4342cf77c51eed18905a1b28f1"
    x-now-cache: MISS
    x-now-trace: hnd1
    server: now
    x-now-id: hnd1:mzb2v-1572719759100-c8367fe1ed25
    strict-transport-security: max-age=63072000

Lighthouse

10MBのデータをダウンロード時のタイムライン
10MBのデータをダウンロード時

まとめ

両方、めちゃくちゃよくできたサービスで、基本無料で利用できるのに選択肢があるとか、めちゃくちゃ贅沢ですね。
今後もまだ使っていないサービスがあったら積極的に試してみて、他サービスと比べてみようと思いました。

50
35
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
50
35