、クロームのEthereal：ネットワークパネル
1、ネットワークパネル
•コントローラ：コントロールパネルの外観と機能
•フィルタ：フィルタリソースの表示要求リスト
•Commandキー（Mac）またはCtrl（ウィンドウ/ Linux）を押しながら、その後、フィルタをクリックして複数のフィルタを選択することができます
•概要：表示HTTPリクエスト、レスポンスの軸
•要求リスト：デフォルトの時系列、選択表示欄
•概要：要求の合計数、データの総量、費やした時間の合計
図2に示すように、コントローラ
ページ要求間で保存されたをロードするには、ログを保存します
問題が再現することができ、比較的貧しいユーザーのネットワーク
第二に、フィルタ
1、フィルター：種類別
XHR、JS、CSS、IMG、メディア、フォント、ドク、WS（のWebSocket）、マニフェスト、またはその他の（ここに記載されていない任意の他のタイプ）
の多型は、Command（Mac）またはCtrlキー（WindowsやLinux）を押したまま
時間によるフィルタ：概要パネルには、スクロールバーをドラッグします
隠しデータのURL：CSSとBASE64形式にHTMLファイルに埋め込まれた他の小さな画像は、HTTPリクエストの数を減らすために
前隠します
隠れた後、
図2に示すように、フィルタ：フィルタのプロパティ（A）
ドメイン：指定したドメインからのリソースのみを表示します。あなたは、複数のドメインを含めるようにワイルドカード文字（*）を使用することができます
ドメイン：* alicdn.com方法：GET
応答ヘッダを有している：指定されたリソースを表示するHTTPレスポンスヘッダを含んでいます
、実行中のWebSocketはリソースを見つけることができます：：使用である：あるから、キャッシュバッファがリソースを見つけるために読み出すことができます
次のとおりですから、キャッシュ
未確認の前に
選択した後、
大より：リソースを表示するには、（バイト単位で）指定されたサイズよりも大きいです。1000年の値は1Kに設定されていると等価です
方法：リソース・タイプ検索指定してHTTPの表示方法
リソース指定されたMIMEタイプを表示：MIMEタイプ
のマルチ属性空間との間にAND演算によって実現を
図3に示すように、フィルタ：フィルタのプロパティ（B）
•混合コンテンツ：現在表示されている：、またはリソースのみ（表示された混合コンテンツ）：すべての混在したコンテンツのリソース（すべての混合コンテンツ）を表示。
•スキーム：保護されていないHTTPを介してディスプレイは、（スキーム：HTTP）または保護されたHTTPS（スキーム：https）でリソースを取得します。
•のSet-Cookieドメイン：ディスプレイおよびリソースとドメイン属性の値を持っているが、一致Set-Cookieヘッダーを指定します。
•セットクッキー名：ショーの名前と指定した値Set-Cookieヘッダーと一致するリソースを持っています。
•セットクッキー値：表示が指定された値とSet-Cookieヘッダーに一致する資源の価値を持っています。
•ステータスコード：のみ指定されたコードと一致するHTTPステータスコードのリソースを表示。
AND演算空間を実現し、複数のプロパティ間
リクエストの第三に、ソートされたリスト
タイム・ソート、デフォルト
•列で並べ替え
時間によって•ソート
開始時間：上部に発行され、最初の要求
応答時間：上部にあるダウンロードを開始する最初のリクエスト
終了時間：最初の要求が先頭に終了した
合計期間：接続のセットアップ時間と要求が要求/応答時間が一番上に最短であります
待ち時間：上部の要求に応じて最短待ち時間
要求リスト（A）
•名：リソースの名前
•ステータス：HTTPステータスコード
•タイプ：要求されたリソースのMIMEタイプ
要求リスト（II）
イニシエータ：リクエストオブジェクトまたはプロセスを開始します。：それは次の値があり
•パーサ（構文解析器）：クロームHTMLパーサ開始した要求
•マウスオーバー表示JSスクリプト
•リダイレクト（リダイレクト）：HTTPリダイレクトは、要求を開始しました
•スクリプト（スクリプト）：スクリプトをリクエスト開始
他（ほか）•を：いくつかの他のプロセスやアクションは、例えば、リンク上のユーザーのクリックがページにジャンプしたり、アドレスバーにURLを入力して、要求を開始
要求リスト（C）
•サイズ：（パケットヘッダと本体を含む）サーバによって返された応答の大きさサイズ抽出した後に表示することができる
•時間：合計時間、要求から受信した応答の最後のバイトに
•滝：各要求に関連する活動視覚分析チャート
要求リスト
第四に、コンテンツのプレビュー要求
プレビュー要求内容（A）
ビューヘッド
•クッキーを確認してください
•プレビューをレスポンスボディ：付きビュー画像
•レスポンスボディをチェックし
、詳細な時間分布•
•エクスポートデータのフォーマットはHARある
資源の•ビュー非圧縮サイズ：使用する大規模なリクエスト行
コンテンツのプレビュー要求（II）
•ブラウザのローディング時間（概要、要約、要求リスト）
色DOMContentLoadedイベントが青に設定されている•、ロードイベントを赤色に
クリップボードにコピー•要求データ
- •コピーリンクアドレス：クリップボードに要求されたURLをコピー
- •コピー応答：クリップボードにコピーされた応答の飛び地
- •cURLのようにコピーします。申請フォームをコピーするためのコマンドカール
- •コピーは、すべてのcURLのとおりのcURLコマンドのシリーズを形成するために、すべての要求をコピーします
- •HARように、すべてのコピー：HARへの要求の形式ですべてのデータをコピーします
•ダウンストリームの表示要求は：ホバー要求のShiftキーを押しながら、緑は、上流、下流の赤があります
第五に、ブラウザのロード時間
トリガープロセス：
•HTML構文解析構造
•外部スクリプトやスタイルシートファイルのロード
•の解析をし、//スクリプトコードを実行するスクリプトの一部は、ページをブロックしますロードされている
。•DOMツリーの構築が完了した// DOMContentLoadedイベント
•ロード写真やその他の外部ファイル
•ページのロード/ /ロード・イベント
1、詳細な配信要求時間（A）
•キューイング：ブラウザ要求は、以下の場合にキューイングされます
- •優先度の高い要求があります
- •このソースは、6つのオープンTCP接続制限は唯一のHTTP / 1.0とHTTP / 1.1のために、到達しました
- •ブラウザが短いディスクキャッシュに領域を割り当てています
•失速：何らかの理由で要求がキューイングによるかもしれストップ説明
。•DNSルックアップを：ブラウザ要求は、IPアドレスに解決されている
•プロキシ交渉を：ブラウザがプロキシサーバーとの協議を要求しています
図2に示すように、詳細な配信要求時間（B）
•リクエストが送信された：リクエストを送信
ServiceWorker準備•：ブラウザは、労働者サービス開始され
ServiceWorkerに•要求を： 'ワーカーサービスにリクエストを送信し、再
•待機（TTFB）：ブラウザーは最初のバイトの応答を待っています。TTFBは、最初のバイト時間に表している
（最初のバイトまでの時間）。この時間は、往復遅延時間が含まれており、サーバが使用される応答時間に準備ができている
コンテンツダウンロード•：ブラウザが応答を受信している
プッシュを受信•：データブラウザは、HTTP / 2サーバープッシュを経由して、この応答を受信している
ブラウザが読んでいる：プッシュを読む•前撮影に受信したローカルデータ
