10yroの開発日記

福岡にある株式会社10yro(トイロ)のエンジニアが書いています

ブラウザ上でのネットワーク速度制限

ブラウザで通信速度を変更したり、オフラインにしたりする方法を記載します。

開発していて動作確認やテスト時などに、ブラウザをオフラインにしたりネットワークの速度を遅くしたりしたいケースがあるかと思います。

そんな時に使えるブラウザ(Dev tool)の機能を紹介します。

ブラウザで [F12] キーを押すと開発者ツールが開きます。

開いた開発者ツールの中でネットワークアイコンの横にドロップダウンリストが表示されています。

※基本的に何もしていなければ「No throttling」になっていると思います。

ここを開くと以下のようにいくつか選択肢があります。

ここで、「Fast 3G」や「Slow 3G」を選択するとそれに応じて回線速度が遅くなり

「Offline」を選べば以下のようにブラウザ上のみオフラインの状態となるなど回線速度の設定ができます。

さらに細かい設定がしたい場合は [Custom] から細かい指定も可能となっています。

Webアプリでのネットワークが繋がっていない場合のテストや 通信速度が遅く(または大容量通信)時間がかかる場合のテストをしたいときなど PC自体をオフラインにしたり、データを多く用意するなどせずに確認できるためラクですね。

以上、ブラウザ上での回線速度を制御する方法でした。