ネットワーク状態と接続品質

機能

• 現在のオンライン状態と、ページを開いてから起きた online / offline の切り替え回数
• ⚠️ navigator.onLine は「接続があるか」だけであると明記。上流の無い Wi-Fi でもオンラインと報告されます
• connection の推定種別・推定下り帯域・推定往復遅延・データセーバー。各項目に「推定値であり実測ではない」と注記します
• ⚠️ Firefox や Safari が connection を提供しない場合は、空白や 0 ではなく明示します
• このページの読み込み段階：DNS、TCP、TLS、TTFB、コンテンツ受信、DOMContentLoaded、load
• 段階が破線のときは理由（DNS キャッシュ、接続の再利用、https でない）を説明し、0 とは書きません
• リソースを種別ごとにまとめて件数とサイズ合計を表示。リソースは順次読み込まれるため再集計もできます
• ⚠️ サイズが取得できないクロスオリジンは件数を別に示して合計から除外し、合計が必ず小さめになると説明します
• 最も遅いリソースと、スナップショット全体のワンクリックコピー。読み取りはすべてローカルです

使い方

1. ページを開くとすぐに、オンライン状態・読み込み段階・リソース統計が表示されます
2. 切り替え履歴を見るには、切断してから再接続してください。オンライン状態の欄に追記されます（メモリ上のみ、再読み込みで消えます）
3. 接続情報の欄に「提供されていません」と出れば、そのブラウザーは connection 未実装です。Chrome か Edge で表示されます
4. 「再集計」でリソースを更新し、「コピー」でスナップショット全体を取得できます

よくある質問

速度テストや ping をしないのはなぜですか

他人のネットワークに通信を発生させるうえ、このサイトのやり方ではないからです。ここにあるのはブラウザーがすでに記録した情報だけです：自分自身の読み込みにどれだけ掛かったか、どのリソースを取得したか、どの種別の回線と判断しているか。実際の帯域は専用の速度テストでお願いします。ここはそれを装う場ではありません。

下り帯域が「推定値」と書かれているのはなぜですか

navigator.connection.downlink は過去のスループットから推定した値で、実測ではないからです。速度が変化した直後は遅れて反映され、しかも 1 本の接続についての推定です。実測として扱うと誤った結論につながるため、各値の横にその正体を記しています。

合計転送量が小さすぎるのはなぜですか

クロスオリジンのリソースは既定でサイズが取得できないためです。相手が Timing-Allow-Origin を返さない場合、transferSize は 0 になります。このページはそれらを別に数えて合計から除外するため、合計は必ず小さめに出ます。正確なサイズは開発者ツールの Network パネルで確認してください。

connection のデータが出ないのはなぜですか

navigator.connection は非標準のインターフェースで、Firefox と Safari は長らく実装していないためです。ネットワークの問題ではなくブラウザーの選択です。Chrome か Edge なら表示されます。