今回は、Firefoxの開発ツール（デベロッパーツール）の帯域制限機能を使用して通信速度の制限を行います。
Chromeの開発ツールの帯域制限機能には劣りますが、Firefoxでも似たような機能を使用することができます。
帯域制限の必要性
基本的にWebサイトの開発で、わざわざ通信速度の遅い環境で開発を行うことはまずないと思いますが、ユーザーの環境によっては、通信速度が遅い場合もあり、実際にそのような環境ではWebサイトがかなり違って見えることがあります。
帯域制限をして通信速度を制限することで、通信速度の遅い環境での動作確認を行うことができます。
帯域制限を使用する
まずはじめに、Firefoxの開発ツールを開きます。開発ツールの開き方は、下記のような方法があります。
- F12
- Ctrl + Shift + I
- サイトを右クリック → 調査
- メニューバー → その他のツール → ウェブ開発ツール
するとこのような画面が表示されます。
ネットワークを選択します。
右側の帯域制限なしをクリックして好きな帯域制限を適用します。
それぞれの項目の詳細は以下の通りです。
| 項目 | ダウンロード速度 | アップロード速度 | 最小レイテンシ |
|---|---|---|---|
| GPRS | 50 Kbps | 20 Kbps | 500 ms |
| Regular 2G | 250 Kbps | 50 Kbps | 300 ms |
| Good 2G | 450 Kbps | 150 Kbps | 150 ms |
| Regular 3G | 750 Kbps | 250 Kbps | 100 ms |
| Good 3G | 1.5 Mbps | 750 Kbps | 40 ms |
| Regular 4G / LTE | 4 Mbps | 3 Mbps | 20 ms |
| DSL | 2 Mbps | 1 Mbps | 5 ms |
| Wi-Fi | 30 Mbps | 15 Mbps | 2 ms |
まとめ
残念ながら、Chromeと比べるとだいぶ機能が少ないように感じますが、Firefoxの開発ツールの帯域制限機能を使用して通信速度の制限を行いました。
過去には帯域制限をするアドオンもあったようですが、現在はリンク切れになっているようです。 機会があれば、アドオンを作ってみたいと思います。
