Help us understand the problem. What is going on with this article?

【Netlify】Netlify / GithubPages / Heroku の速度比較

More than 1 year has passed since last update.

Netlifyとは

WEBサイトのホスティングサービス
https://www.netlify.com/

netlify.png

Netlifyに関する投稿

はじめに

静的サイトを作成する機会があり、Netlify / GithubPages / Heroku の速度比較を行いましたので、参考情報として投稿させていただきます。

Herokuは静的サイトのホスティングサービスではありませんが、個人的によく利用するサービスなので比較対象に含めました。

速度比較に利用したソース

画像(60~100KB)が10個表示されるページです。
ページ全体としては780KB程度のサイズになります。

ソース

source.png

プレビュー

site-chrome.png

結果

各サービスにデプロイしたあとに3回ずつスーパーリロード(キャッシュをクリアして更新)させて、読み込みにかかった時間を測定しました。

Netlifyは自動的にCDNが利用されるらしく、比較したサービスの中では最速でした。

サービス名(プラン) 読み込み速度
Netlify (free) 140~180 ms
GithubPages 260~400 ms
Heroku (free) 1200~2500 ms

備考:HerokuはHTML/CSSだけではデプロイできないため、ルートディレクトリに0バイトのindex.phpを配置しました。また、リージョンはUSでした。


以下は測定に利用した各サービスについてのメモです。

速度比較に利用したプラン

速度比較に利用した各サービスのプランは以下の通りです。

  • Netlify (free)
  • GithubPages
  • Heroku (free)
サービス(プラン) 制限
Netlify (free) 帯域:100GB/月
ストレージ:100GB
APIリクエスト:
 500リクエスト/分
 3デプロイ/分
GithubPages リポジトリの容量(推奨):1GB
サイトの容量:1GB
帯域:100GB/月
ビルド:10回/時間
Heroku (free) 未認証アカウント:550時間/月まで
認証済みアカウント:1000時間/月まで
その他:30分間何も操作が行われないとスリープモードになる

参考

画像

猫の画像は以下のサイトのフリー素材を利用させていただきました。
ぱくたそ-フリー素材・無料写真ダウンロード

NaokiIshimura
Ruby on Rails Engineer.
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした