initial commit

7 files changed, 783 insertions, 0 deletions

diff --git a/files/ja/tools/network_monitor/index.html b/files/ja/tools/network_monitor/index.html
new file mode 100644
index 0000000000..6a2d2aea2a
--- /dev/null
+++ b/files/ja/tools/network_monitor/index.html
@@ -0,0 +1,61 @@
+---
+title: ネットワークモニター
+slug: Tools/Network_Monitor
+tags:
+  - Debugging
+  - Dev Tools
+  - Firefox
+  - Guide
+  - Networking
+  - Tools
+  - 'l10n:priority'
+translation_of: Tools/Network_Monitor
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>ネットワークモニターは、 Firefox が実行したすべてのネットワーク要求 (たとえばページの読み込みや <a href="/ja/docs/Web/API/XMLHttpRequest">XMLHttpRequests</a> による) について、各要求でどれだけ時間がかかったかや要求の詳細情報を表示します。</p>
+
+<h2 id="Opening_the_Network_Monitor" name="Opening_the_Network_Monitor">ネットワークモニターを開く</h2>
+
+<p>ネットワークモニターを開く方法はいくつかあります。</p>
+
+<ul>
+ <li><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd> (Mac では <kbd>Command</kbd> + <kbd>Option</kbd> + <kbd>E</kbd>) を押下します。</li>
+ <li>[ウェブ開発] メニュー (OS X や Linux では、[ツール] メニューのサブメニューです) で、[ネットワーク] を選択します。</li>
+ <li>メインツールバーまたはハンバーガーメニュー (<img alt="" src="https://mdn.mozillademos.org/files/12712/hamburger.png" style="height: 20px; width: 22px;">) の中にあるレンチのアイコン (<img alt="" src="https://mdn.mozillademos.org/files/12710/wrench-icon.png" style="height: 21px; width: 21px;">) をクリックして、[ネットワーク] を選択します。</li>
+</ul>
+
+<p>ブラウザーウィンドウの下部にネットワークモニターが現れます。要求を見るために、ページを再読み込みしましょう:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16245/network_monitor.png" style="border: 1px solid black; display: block; height: 541px; margin: 0px auto; width: 800px;"></p>
+
+<p>ツールバーを開いているときは、ネットワークモニターを選択していなくても常にネットワーク要求を記録します。つまり、例えばウェブコンソールを開いてページをデバッグした後、ページを再読み込みすることなくネットワークモニターに切り替えて、ネットワークアクティビティを確認できます。</p>
+
+<h2 id="UI_overview" name="UI_overview">UI の概要</h2>
+
+<p>UI は 4 つの主要な部分に分けられます:</p>
+
+<ul>
+ <li>メイン画面には<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>、<a href="/ja/docs/Tools/Network_Monitor/request_list">ネットワーク要求のリスト</a>、<a href="/ja/docs/Tools/Network_Monitor/request_details">ネットワーク要求の詳細ペイン</a>があります:</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16246/Network_Monitor_Closeup.png" style="border: 1px solid black; display: block; height: 747px; margin: 0 auto; width: 800px;"></p>
+
+<ul>
+ <li>別の画面に<a href="/ja/docs/Tools/Network_Monitor/Performance_Analysis">パフォーマンス解析</a>があります:</li>
+</ul>
+
+<p><img alt="Performance analysis view" src="https://mdn.mozillademos.org/files/16276/network_performance.png" style="border: 1px solid black; display: block; height: 1176px; margin-left: auto; margin-right: auto; width: 1382px;" title=""></p>
+
+<h2 id="ネットワークモニタの操作">ネットワークモニタの操作</h2>
+
+<p>次の記事では、ネットワークモニタを使用するさまざまな側面について説明します。</p>
+
+<ul>
+ <li><a href="/ja/docs/Tools/Network_Monitor/toolbar">ツールバー</a></li>
+ <li><a href="/ja/docs/Tools/Network_Monitor/request_list">ネットワークリクエストリスト</a></li>
+ <li><a href="/ja/docs/Tools/Network_Monitor/request_details">ネットワークリクエストの詳細</a></li>
+ <li><a href="/ja/docs/Tools/Network_Monitor/recording">ネットワークトラフィックの記録</a></li>
+ <li><a href="/ja/docs/Tools/Network_Monitor/Performance_Analysis">パフォーマンス分析</a></li>
+ <li><a href="/ja/docs/Tools/Network_Monitor/Throttling">スロットリング</a></li>
+</ul>
diff --git a/files/ja/tools/network_monitor/performance_analysis/index.html b/files/ja/tools/network_monitor/performance_analysis/index.html
new file mode 100644
index 0000000000..5532efabec
--- /dev/null
+++ b/files/ja/tools/network_monitor/performance_analysis/index.html
@@ -0,0 +1,32 @@
+---
+title: パフォーマンス分析
+slug: Tools/Network_Monitor/Performance_Analysis
+tags:
+  - '110n:priority'
+  - Dev Tools
+  - Firefox
+  - ガイド
+  - ツール
+  - デバッグ
+  - ネットワーク
+translation_of: Tools/Network_Monitor/Performance_Analysis
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>ネットワークモニタにはパフォーマンス分析ツールが含まれており、ブラウザーがサイトのさまざまな部分をダウンロードするのに必要な時間を表示できます。</p>
+
+<h2 id="パフォーマンス分析ツールの使用">パフォーマンス分析ツールの使用</h2>
+
+<p>パフォーマンス分析ツールを実行するには<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>のストップウォッチアイコンをクリックします。</p>
+
+<p>(また、ネットワークモニタを開いたばかりのときに、まだリクエストのリストが表示されていない場合は、メインウィンドウにストップウォッチアイコンが表示されます。)</p>
+
+<p>その後、ネットワークモニタはサイトを2回読み込みます。1回は空のブラウザキャッシュ、もう1回はプライム付きブラウザキャッシュです。これはユーザーが初めてサイトを訪問し、その後の訪問をシミュレートします。 それぞれの実行結果を並べて表示するか、ブラウザウィンドウが狭い場合は垂直方向に表示します。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16277/network_performance.png" style="border: 1px solid black; display: block; height: 1176px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<p>各実行結果は表と円グラフにまとめられています。テーブルはリソースをタイプ別にグループ化し、各リソースの合計サイズとそれらのロードに要した合計時間を表示します。付随する円グラフは、各リソースタイプの相対的なサイズを示しています。</p>
+
+<p>ネットワークモニターのネットワークリクエストリストに戻るには、左側の「戻る」ボタンをクリックします。</p>
+
+<p>円グラフのスライスをクリックすると、その実行のためのネットワークモニタが表示され、フィルタが自動的に適用されて<a href="/ja/docs/Tools/Network_Monitor#Filtering_by_content_type">そのリソースタイプのみ</a>が表示されます。</p>
diff --git a/files/ja/tools/network_monitor/recording/index.html b/files/ja/tools/network_monitor/recording/index.html
new file mode 100644
index 0000000000..e6f7ad6677
--- /dev/null
+++ b/files/ja/tools/network_monitor/recording/index.html
@@ -0,0 +1,28 @@
+---
+title: ネットワークモニターの記録
+slug: Tools/Network_Monitor/recording
+tags:
+  - '110n:priority'
+  - Dev Tools
+  - Firefox
+  - ガイド
+  - ツール
+  - デバッグ
+  - ネットワーク
+translation_of: Tools/Network_Monitor/recording
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>一時停止ボタンを使用してネットワークトラフィックの監視を一時停止および再開できます。</p>
+
+<h2 id="ネットワークトラフィックの記録を一時停止および再開する">ネットワークトラフィックの記録を一時停止および再開する</h2>
+
+<p>ネットワークモニタには、現在のページのネットワークトラフィックの記録を一時停止および再開するボタンがあります。これは、たとえば、デバッグ目的でページの安定したビューを取得しようとしているような状況で便利ですが、通常の状況下では永続的なネットワークリクエストによりビューが変化し続けます。一時停止ボタンを使用すると特定のスナップショットを見ることができます。</p>
+
+<p>メインネットワークモニターツールバーの左端の方にボタンが見つかりますが、それは典型的なポーズボタン、つまり <img alt="" src="https://mdn.mozillademos.org/files/15625/pause-icon.png" style="height: 23px; width: 34px;"> のように見えます。</p>
+
+<p>あなたはコンテキストでそれをここで見ることができます：</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15624/play-pause-network-traffic.png" style="border-style: solid; border-width: 1px; display: block; height: 305px; margin: 0px auto; width: 930px;"></p>
+
+<p>押すたびに、ボタンが再生アイコンに変わり、もう一度押すと記録したネットワークトラフィックを切り替えることができます。</p>
diff --git a/files/ja/tools/network_monitor/request_details/index.html b/files/ja/tools/network_monitor/request_details/index.html
new file mode 100644
index 0000000000..c8c41d4975
--- /dev/null
+++ b/files/ja/tools/network_monitor/request_details/index.html
@@ -0,0 +1,184 @@
+---
+title: ネットワークリクエストの詳細
+slug: Tools/Network_Monitor/request_details
+tags:
+  - '110n:priority'
+  - Dev Tools
+  - Firefox
+  - ガイド
+  - ツール
+  - デバッグ
+  - ネットワーク
+translation_of: Tools/Network_Monitor/request_details
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>リクエストの詳細ペインはリクエストリストのネットワークリクエストをクリックすると表示されます。このペインには、リクエストに関するより詳細な情報が表示されます。</p>
+
+<h2 id="ネットワークリクエストの詳細">ネットワークリクエストの詳細</h2>
+
+<p>行をクリックするとネットワークモニターの右側に新しいペインが表示され、リクエストに関するより詳細な情報が表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16261/network_request_details.png" style="display: block; height: 741px; margin-left: auto; margin-right: auto; width: 930px;"></p>
+
+<p>このペインの上部にあるタブを使用すると、次のページを切り替えることができます。</p>
+
+<ul>
+ <li><strong>Headers</strong></li>
+ <li><strong>Cookies</strong></li>
+ <li><strong>Params</strong></li>
+ <li><strong>Response</strong></li>
+ <li><strong>Cache</strong></li>
+ <li><strong>Timings</strong></li>
+ <li><strong>Security </strong>(安全なページのみ)</li>
+ <li><strong>Stack trace</strong> (リクエストにスタックトレースがある場合、たとえば、別のスクリプトによって呼び出されたスクリプトのみ)。これは Firefox 55 以降で利用可能です。</li>
+</ul>
+
+<p>ツールバーの右端にあるアイコンをクリックすると詳細ペインが閉じ、リストビューに戻ります。</p>
+
+<h3 id="Headers">Headers</h3>
+
+<p>このタブには、リクエストに関する基本情報がリストされます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16262/Network_Monitor_Closeup.png" style="border: 1px solid black; display: block; height: 747px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<p>これには次のものが含まれます：</p>
+
+<ul>
+ <li>リクエスト URL</li>
+ <li>リクエストメソッド</li>
+ <li>リモート IP アドレスとポート <em>(Firefox 39 から)</em></li>
+ <li>詳細を確認するためのMDN ドキュメントにリンクしている疑問符アイコン付きステータスコード (利用可能な場合)</li>
+ <li>送信された HTTP リクエストとレスポンスヘッダー</li>
+ <li>リクエストを編集して再送信するための <a href="/ja/docs/Tools/Network_Monitor">編集と再送信</a> ボタン</li>
+ <li>rawリクエストとレスポンスヘッダーを表示するRawヘッダーボタン</li>
+</ul>
+
+<p>表示されるヘッダをフィルタリングすることができます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16266/network_headers.png" style="border: 1px solid black; display: block; height: 295px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<p>ステータスコード行の各ヘッダーの横に疑問符のアイコンが表示されます。これは <a href="/ja/docs/Web/HTTP/Headers">HTTP ヘッダーの MDN ドキュメント</a>で、特定のステータスコードに関する詳細情報へのリンクです。</p>
+
+<h3 id="Cookies">Cookies</h3>
+
+<p>このタブには、リクエストまたはレスポンスとともに送信されたすべてのクッキーの詳細が一覧表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16265/network_cookies.png" style="border: 1px solid black; display: block; height: 748px; margin-left: auto; margin-right: auto; width: 2276px;"></p>
+
+<p>ヘッダーと同様に、表示されるクッキーのリストをフィルタリングできます。 Cookie属性の完全なリストが表示されます。レスポンスのクッキーの例の下のスクリーンショットを参照してください。</p>
+
+<p><img alt="cookies panel in firefox devtools network monitor, showing a number of cookie attributes including samesite" src="https://mdn.mozillademos.org/files/16108/highlight-samesite-attribute.png" style="display: block; height: 394px; margin: 0px auto; width: 1047px;"></p>
+
+<p>Firefox 62 ({{bug("1452715")}}) 以降、<code>samesite</code> 属性が表示されています。</p>
+
+<h3 id="パラメータ">パラメータ</h3>
+
+<p>このタブにはリクエストの GET パラメータと POST データが表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16333/params.png" style="display: block; height: 215px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<h3 id="レスポンス">レスポンス</h3>
+
+<p>レスポンスの完全な内容。レスポンスが HTML、JS、または CSS の場合、テキストとして表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16268/network_response.png" style="border: 1px solid black; display: block; height: 747px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<p>レスポンスが JSON の場合、検査可能オブジェクトとして表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16332/response_json.png" style="display: block; height: 268px; margin: 0 auto; width: 900px;"></p>
+
+<p>レスポンスが画像の場合、タブにプレビューが表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16331/response_pane_image.png" style="display: block; height: 347px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<h4 id="キャッシュ">キャッシュ</h4>
+
+<p>レスポンスがキャッシュされると(すなわち、304)、"Cache" タブにキャッシュされたリソースに関する詳細が表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16329/response_cache.png" style="border: 1px solid black; display: block; height: 245px; margin: 0px auto; width: 567px;"></p>
+
+<p>詳細には次のものが含まれています:</p>
+
+<ul>
+ <li>Last fetched: リソースが最後にフェッチされた日付。</li>
+ <li>Fetched count: リソースがフェッチされた現在のセッション内の回数。</li>
+ <li>Data size: リソースのサイズ。</li>
+ <li>Last modified: リソースが最後に変更された日付。</li>
+ <li>Expires: リソースの有効期限が切れる日付。</li>
+ <li>Device: リソースが取得されたデバイス ("disk" など)。</li>
+</ul>
+
+<h4 id="HTML_プレビュー">HTML プレビュー</h4>
+
+<p>レスポンスが HTML の場合、レンダリングされた HTML のプレビューがレスポンスペイロードの上にある [Response] タブ内に表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16272/settings_for_browser_debugger.png" style="border-style: solid; border-width: 1px; border: 1px solid black; display: block; height: 744px; margin: 0px auto; width: 900px;"></p>
+
+<h3 id="タイミング">タイミング</h3>
+
+<p>[タイミング] タブでは、ネットワークリクエストを、<a href="https://dvcs.w3.org/hg/webperf/raw-file/tip/specs/HAR/Overview.html">HTTP アーカイブ</a>仕様で定義された次のサブセットに分解します。</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">名前</th>
+   <th scope="col">説明</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Blocked</td>
+   <td>
+    <p>ネットワーク接続を待っているキューで費やされた時間。</p>
+
+    <p>ブラウザは、単一のサーバーに対して行うことができる同時接続の数に制限を設けています。Firefox のデフォルトは 6 ですが、<code><a href="http://kb.mozillazine.org/Network.http.max-persistent-connections-per-server">network.http.max-persistent-connections-per-server</a></code> の設定を使用して変更できます。すべての接続が使用中の場合、ブラウザは接続が解放されるまで、より多くのリソースをダウンロードすることはできません。</p>
+   </td>
+  </tr>
+  <tr>
+   <td>DNS resolution</td>
+   <td>ホスト名を解決するのにかかる時間。</td>
+  </tr>
+  <tr>
+   <td>Connecting</td>
+   <td>TCP 接続を作成するのにかかる時間。</td>
+  </tr>
+  <tr>
+   <td>Sending</td>
+   <td>HTTP リクエストをサーバーに送信するのにかかる時間。</td>
+  </tr>
+  <tr>
+   <td>Waiting</td>
+   <td>サーバーからのレスポンスを待っています。</td>
+  </tr>
+  <tr>
+   <td>Receiving</td>
+   <td>サーバー (またはキャッシュ) からのレスポンス全体を読み取るのにかかる時間。</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>それは、そのリクエストに対するタイムラインバーのより詳細な注釈付きのビューを提示します。これは、合計待ち時間がさまざまな段階にどのように分割されるかを示します。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16271/network_timings.png" style="border: 1px solid black; display: block; height: 749px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<h3 id="セキュリティ">セキュリティ</h3>
+
+<p>サイトが HTTPS 経由でサービスされている場合は、"Security" というラベルのタブが追加されます。これには、プロトコル、暗号スイート、証明書の詳細など、使用される安全な接続に関する詳細が含まれています。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16269/network_security.png" style="border: 1px solid black; display: block; height: 748px; margin-left: auto; margin-right: auto; width: 2276px;"></p>
+
+<p>[セキュリティ] タブには、セキュリティの弱点に関する警告が表示されます。 現在、2つの弱点について警告しています。</p>
+
+<ol>
+ <li>Using SSLv3 instead of TLS</li>
+ <li>Using the RC4 cipher</li>
+</ol>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10165/security-warning.png" style="display: block; height: 93px; margin-left: auto; margin-right: auto; width: 591px;"></p>
+
+<h3 id="スタックトレース">スタックトレース</h3>
+
+<p>Stack Trace タブには、スタックトレースがあるレスポンスのスタックトレースが表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16270/network_stack_trace.png" style="border: 1px solid black; display: block; height: 205px; margin: 0px auto; width: 900px;"></p>
diff --git a/files/ja/tools/network_monitor/request_list/index.html b/files/ja/tools/network_monitor/request_list/index.html
new file mode 100644
index 0000000000..ffc68317a5
--- /dev/null
+++ b/files/ja/tools/network_monitor/request_list/index.html
@@ -0,0 +1,337 @@
+---
+title: ネットワークリクエストリスト
+slug: Tools/Network_Monitor/request_list
+tags:
+  - '110n:priority'
+translation_of: Tools/Network_Monitor/request_list
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>ネットワークモニターのリクエストリストには、ページのロード中に行われたすべてのネットワークリクエストの一覧が表示されます。</p>
+
+<h2 id="ネットワークリクエストリスト">ネットワークリクエストリスト</h2>
+
+<p>デフォルトでは、ネットワークモニタにはページの読み込み中に行われたすべてのネットワークリクエストの一覧が表示されます。各リクエストはそれ自身の行に表示されます：</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16258/Network_request_list.png" style="border: 1px solid black; display: block; height: 328px; margin: 0px auto; width: 900px;"></p>
+
+<p>デフォルトでは、新しいページに移動するか現在のページをリロードするたびに、ネットワークモニタがクリアされます。<a href="/ja/docs/Tools/Tools_Toolbox#Common_preferences">設定</a>の [永続ログを有効にする] をオンにするとこの動作を無効にすることができます。</p>
+
+<h3 id="ネットワークリクエスト列">ネットワークリクエスト列</h3>
+
+<p>テーブルヘッダーを右クリックし、コンテキストメニューから特定の列を選択することによって、異なる列を切り替えることができます。"Reset Columns" オプションで初期設定に戻すこともできます。使用可能なすべての列のリストは次のとおりです。</p>
+
+<ul>
+ <li><strong>Status</strong>: 返された HTTP ステータスコード。これは、色分けされたアイコンとして表示されます。
+
+  <ul>
+   <li><img alt="" src="https://mdn.mozillademos.org/files/13136/1x.png" style="height: 17px; width: 17px;"> 情報のための青い丸 (1XXコード)。特に WebSocket のアップグレードには 101 (スイッチングプロトコル) が含まれています</li>
+   <li><img alt="" src="https://mdn.mozillademos.org/files/10941/200.png" style="height: 17px; width: 17px;"> 緑の丸は成功 (2XX コード)</li>
+   <li><img alt="" src="https://mdn.mozillademos.org/files/10945/300.png" style="height: 17px; width: 17px;"> オレンジの三角はリダイレクト (3XX)</li>
+   <li><img alt="" src="https://mdn.mozillademos.org/files/10943/4-500.png" style="height: 17px; width: 17px;"> 赤い四角はエラー (4XX と 5XX)</li>
+   <li><img alt="" src="https://mdn.mozillademos.org/files/10947/cached.png" style="height: 17px; width: 17px;"> 中空の灰色の円はブラウザのキャッシュから取得されたレスポンス。</li>
+  </ul>
+  正確なコードはアイコンの直後に表示されます。</li>
+ <li><strong>Method</strong>: 使用された HTTP リクエストメソッド。</li>
+ <li><strong>File</strong>: リクエストされたファイルのベース名。</li>
+ <li><strong>Protocol:</strong> データを転送するために使用されたネットワークプロトコル。この列はデフォルトでは表示されません。これは Firefox 55 の新機能です。</li>
+ <li><strong>Scheme:</strong> リクエストされたパスのスキーム (https/http/ftp/...)。 この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
+ <li><strong>Domain</strong>: リクエストされたパスのドメイン。
+  <ul>
+   <li>リクエストに SSL/TLS を使用し、接続に弱い暗号などのセキュリティの弱点があった場合は、ドメインの横に警告の三角形が表示されます。問題の詳細は <a href="/ja/docs/Tools/Network_Monitor#Security">[セキュリティ] タブ</a>で確認できます</li>
+   <li>IP アドレスを表示するにはドメインにカーソルを合わせます。</li>
+   <li>ドメインの横には、そのリクエストのセキュリティステータスに関する追加情報を示すアイコンがあります。 <a href="/ja/docs/Tools/Network_Monitor#Security_icons">セキュリティアイコン</a>を参照してください。</li>
+  </ul>
+ </li>
+ <li><strong>Remote IP</strong>: リクエストに応答しているサーバーの IP アドレス。この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
+ <li><strong>Cause</strong>: XHR リクエスト、{{htmlelement("img")}}、スクリプト、画像を要求するスクリプトなど、ネットワーク要求が発生した理由。これは Firefox 49 で新しく追加されました。</li>
+ <li><strong>Type</strong>: レスポンスの <code>Content-type</code></li>
+ <li><strong>Cookies:</strong> リクエストに関連付けられたリクエストクッキーの数。 この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
+ <li><strong>Set-Cookies:</strong> リクエストに関連付けられたレスポンスクッキーの数。この列はデフォルトで非表示になっています。これは Firefox 55 の新機能です。</li>
+ <li><strong>Transferred</strong>: リソースをロードするために実際に転送されたバイト数。リソースが圧縮されている場合は <strong>Size</strong> より小さくなります。Firefox 47 から、リソースが<a href="/ja/docs/Web/API/ServiceWorker_API">サービスワーカー</a>キャッシュからフェッチされた場合、このセルには "service worker" が表示されます。</li>
+ <li><strong>Size</strong>: 転送されたリソースのサイズ。</li>
+</ul>
+
+<p>上部のツールバーはこれらの列にラベルを付け、ラベルをクリックするとその列によるすべての要求がソートされます。</p>
+
+<h4 id="イメージサムネイル">イメージサムネイル</h4>
+
+<p>ファイルがイメージの場合、行にはイメージのサムネイルが含まれ、ファイル名の上にマウスを置くとツールチップのプレビューが表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16257/image_preview.png" style="border: 1px solid black; display: block; height: 334px; margin: 0px auto; width: 900px;"></p>
+
+<h4 id="セキュリティアイコン">セキュリティアイコン</h4>
+
+<p>ネットワークモニタは [ドメイン] 列にアイコンを表示します。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16194/network_message_list_63.png" style="border: 1px solid black; display: block; height: 191px; margin: 0 auto; width: 845px;"></p>
+
+<p>これによりリクエストのセキュリティステータスに関する追加情報が得られます。</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">アイコン</th>
+   <th scope="col">意味</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/11655/https.svg" style="height: 16px; width: 16px;"></td>
+   <td>HTTPS</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/11653/https-weak.svg" style="height: 16px; width: 16px;"></td>
+   <td>弱い HTTPS (例えば、弱い暗号が使用された場合)</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/11649/https-failed.svg" style="height: 16px; width: 16px;"></td>
+   <td>失敗した HTTPS (たとえば、証明書が無効だった場合)</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/11651/http.svg" style="height: 16px; width: 16px;"></td>
+   <td>HTTP</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/11657/localhost.svg" style="height: 16px; width: 16px;"></td>
+   <td>Localhost</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="https://mdn.mozillademos.org/files/16192/tracker_icon.png" style="height: 16px; width: 16px;"></td>
+   <td>URL がコンテンツブロッキングを有効にしてブロックされる既知のトラッカーに属していることを示します。</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>弱い HTTPS リクエストと失敗した HTTPS リクエストについては、<a href="/ja/docs/Tools/Network_Monitor#Security">[セキュリティ]タブ</a>に問題の詳細が表示されます。</p>
+
+<h4 id="原因列">原因列</h4>
+
+<p>「原因」列には、リクエストの原因を示します。これは通常かなり明白であり、一般的にこれとタイプの列項目との間の相関を見ることができます。最も一般的な値は次のとおりです。</p>
+
+<ul>
+ <li>document: ソースHTMLドキュメント</li>
+ <li>img: {{htmlelement("img")}} 要素</li>
+ <li>imageset: {{htmlelement("img")}} 要素</li>
+ <li>script: JavaScriptファイル</li>
+ <li>stylesheet: CSSファイル</li>
+</ul>
+
+<h3 id="タイムライン">タイムライン</h3>
+
+<p>リクエストリストには、各リクエストのさまざまな部分のタイムラインも表示されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16259/timeline.png" style="border: 1px solid black; display: block; height: 331px; margin: 0px auto; width: 900px;"></p>
+
+<p>各タイムラインには、その行の他のネットワークリクエストに対する相対的な水平位置が与えられているため、ページのロードに要した合計時間を確認できます。ここで使用される色分けの詳細については、<a href="/ja/docs/Tools/Network_Monitor#Timings">タイミング</a>ページのセクションを参照してください。</p>
+
+<p>Firefox 45 以降、タイムラインには 2 つの垂直線も含まれています：</p>
+
+<ul>
+ <li><span style="color: blue;">青い</span>線はページの <code><a href="/ja/docs/Web/Events/DOMContentLoaded">DOMContentLoaded</a></code> イベントがトリガーされるポイントを示します</li>
+ <li><span style="color: red;">赤い</span>線はページのロードイベントがトリガーされるポイントを示します</li>
+</ul>
+
+<h3 id="リクエストのフィルタリング">リクエストのフィルタリング</h3>
+
+<p>リクエストをコンテンツタイプ、XMLHttpRequests リクエスト、WebSocket リクエスト、URL、リクエストプロパティ別のいずれかでフィルタリングできます。</p>
+
+<h4 id="コンテンツタイプによるフィルタリング">コンテンツタイプによるフィルタリング</h4>
+
+<p>コンテンツタイプ別にフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>のボタンを使用します。</p>
+
+<h4 id="XHRのフィルタリング">XHRのフィルタリング</h4>
+
+<p>{{Glossary("XHR (XMLHttpRequest)", "XHR")}} のみを表示するには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の "XHR" ボタンを使用します。</p>
+
+<h4 id="WebSocketsのフィルタリング">WebSocketsのフィルタリング</h4>
+
+<p>WebSocket接続のみを表示するには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の "WS" ボタンを使用します。</p>
+
+<p>WebSocket 接続で交換されるデータを監視するには、<a href="https://addons.mozilla.org/ja/firefox/addon/websocket-monitor/">WebSocket Monitor アドオン</a>を試してください。</p>
+
+<h4 id="URLによるフィルタリング">URLによるフィルタリング</h4>
+
+<p>URL でフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor#Toolbar">ツールバー</a>の検索ボックスを使用します。検索ボックスの中をクリックするか、あるいは <kbd>Ctrl</kbd> + <kbd>F</kbd> (または Mac の場合は <kbd>Cmd</kbd> + <kbd>F</kbd> )を押して、入力を開始します。ネットワークリクエストのリストは、フィルタ文字列を含むリクエストのみをドメインまたはファイルの部分に含めるようにフィルタリングされます。</p>
+
+<p>Firefox 45 では、クエリ文字列に "-" 演算子をつけることでフィルタ文字列を含まないリクエストをフィルタリングできます。たとえば、"-google.com" というクエリでは、URL に "google.com" がないすべてのリクエストが表示されます。</p>
+
+<h4 id="プロパティによるフィルタリング">プロパティによるフィルタリング</h4>
+
+<p>特定のリクエストプロパティでフィルタリングするには、<a href="/ja/docs/Tools/Network_Monitor">ツールバー</a>の検索ボックスを使用します。検索ボックスは特定のキーワードを認識し、特定のリクエストプロパティによってリクエストをフィルタリングするために使用できます。これらのキーワードの後にコロンと関連するフィルター値が続きます。フィルター値は大文字と小文字を区別しません。マイナス (<code>-</code>) を前に付けると、フィルタは無効になります。異なるフィルタをスペースで区切って組み合わせることができます。</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">キーワード</th>
+   <th scope="col">意味</th>
+   <th scope="col">例</th>
+  </tr>
+  <tr>
+   <td><code>status-code</code></td>
+   <td>特定の HTTP ステータスコードを持つリソースを表示します。</td>
+   <td><code>status-code:304</code></td>
+  </tr>
+  <tr>
+   <td><code>method</code></td>
+   <td>特定の HTTP リクエストメソッドを介して要求されたリソースを表示します。</td>
+   <td><code>method:post</code></td>
+  </tr>
+  <tr>
+   <td><code>domain</code></td>
+   <td>特定のドメインからのリソースを表示します。</td>
+   <td><code>domain:mozilla.org</code></td>
+  </tr>
+  <tr>
+   <td><code>remote-ip</code></td>
+   <td>指定された IP を持つサーバーからのリソースを表示します。</td>
+   <td><code>remote-ip:63.245.215.53</code><br>
+    <code>remote-ip:[2400:cb00:2048:1::6810:2802]</code></td>
+  </tr>
+  <tr>
+   <td><code>cause</code></td>
+   <td>特定の原因タイプに一致するリソースを表示します。 タイプは、<a href="/ja/docs/Tools/Network_Monitor/request_list#Cause_column">原因列</a>の説明に記載されています。</td>
+   <td><code>cause:js</code><br>
+    <code>cause:stylesheet<br>
+    cause:img</code></td>
+  </tr>
+  <tr>
+   <td><code>transferred</code></td>
+   <td>特定の転送サイズまたは転送サイズが指定されたサイズに近いリソースを示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。例えば <code>1k</code> の値は <code>1024</code> に相当します。</td>
+   <td><code>transferred:1k</code></td>
+  </tr>
+  <tr>
+   <td><code>size</code></td>
+   <td>
+    <p>特定のサイズ (圧縮解除後) または指定されたサイズに近いサイズのリソースを表示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。<code>1k</code> の値は <code>1024</code> に相当します。</p>
+   </td>
+   <td><code>size:2m</code></td>
+  </tr>
+  <tr>
+   <td><code>larger-than</code></td>
+   <td>指定したサイズ (バイト単位) を超えるリソースを表示します。<code>k</code> はキロバイトの接尾辞として、<code>m</code> はメガバイトに使用できます。<code>1k</code> の値は <code>1024</code> に相当します。</td>
+   <td><code>larger-than:2000</code><br>
+    <code>-larger-than:4k</code></td>
+  </tr>
+  <tr>
+   <td><code>mime-type</code></td>
+   <td>指定された MIME タイプに一致するリソースを表示します。</td>
+   <td><code>mime-type:text/html</code><br>
+    <code>mime-type:image/png</code><br>
+    <code>mime-type:application/javascript</code></td>
+  </tr>
+  <tr>
+   <td><code>is</code></td>
+   <td><code>is:cached</code> および <code>is:from-cache</code> はキャッシュから来るリソースのみを示します。<br>
+    <code>is:running</code> は現在転送中のリソースのみを表示します。</td>
+   <td><code>is:cached</code><br>
+    <code>-is:running</code></td>
+  </tr>
+  <tr>
+   <td><code>scheme</code></td>
+   <td>指定されたスキームを介して転送されたリソースを表示します。</td>
+   <td><code>scheme:http</code></td>
+  </tr>
+  <tr>
+   <td><code>has-response-header</code></td>
+   <td>指定された HTTP レスポンスヘッダを含むリソースを表示します。</td>
+   <td><code>has-response-header:cache-control</code><br>
+    <code>has-response-header:X-Firefox-Spdy</code></td>
+  </tr>
+  <tr>
+   <td><code>set-cookie-domain</code></td>
+   <td>指定された値と一致する <code>Domain</code> 属性を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
+   <td><code>set-cookie-domain:.mozilla.org</code></td>
+  </tr>
+  <tr>
+   <td><code>set-cookie-name</code></td>
+   <td>指定された値と一致する名前を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
+   <td><code>set-cookie-name:_ga</code></td>
+  </tr>
+  <tr>
+   <td><code>set-cookie-value</code></td>
+   <td>指定された値と一致する値を持つ <code>Set-Cookie</code> ヘッダを持つリソースを表示します。</td>
+   <td><code>set-cookie-value:true</code></td>
+  </tr>
+  <tr>
+   <td><code>regexp</code></td>
+   <td>指定された {{Glossary("regular expression")}} と一致する URL を持つリソースを表示します。</td>
+   <td><code>regexp:\d{5}<br>
+    regexp:mdn|mozilla</code></td>
+  </tr>
+ </thead>
+</table>
+
+<h3 id="コンテキストメニュー">コンテキストメニュー</h3>
+
+<p>リスト内の行の"コンテキストクリック"は、次のオプションを含むコンテキストメニューを表示します。</p>
+
+<ul>
+ <li>Copy URL</li>
+ <li>Copy URL Parameters</li>
+ <li>Copy POST Data (only for POST requests)</li>
+ <li>Copy as cURL</li>
+ <li>Copy Request Headers</li>
+ <li>Copy Response Headers</li>
+ <li>Copy Response</li>
+ <li>Copy Image as Data URI (only for images)</li>
+ <li>Copy All As HAR</li>
+ <li>Save All As HAR</li>
+ <li>Save Image As (only for images)</li>
+ <li>Edit and Resend</li>
+ <li>Open in New Tab</li>
+ <li>Start <a href="/en-US/docs/Tools/Network_Monitor#Performance_analysis">Performance Analysis</a> for the page</li>
+</ul>
+
+<h4 id="Edit_and_Resend">Edit and Resend</h4>
+
+<p>このオプションを使用すると、リクエストのメソッド、URL、パラメータ、およびヘッダーを編集し、リクエストを再送信できるエディタが開きます。</p>
+
+<h4 id="新規タブで開く">新規タブで開く</h4>
+
+<p>リクエストを新しいタブで再送信します。非同期リクエストのデバッグには非常に便利です。</p>
+
+<h4 id="Copy_as_cURL">Copy as cURL</h4>
+
+<p>このオプションはネットワークリクエストを cURL コマンドとしてクリップボードにコピーするので、コマンドラインから実行することができます。 このコマンドには、次のオプションが含まれます。</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><code>-X [METHOD]</code></td>
+   <td>メソッドが GET または POST でない場合</td>
+  </tr>
+  <tr>
+   <td><code>--data</code></td>
+   <td>URL エンコードされたリクエストパラメータ</td>
+  </tr>
+  <tr>
+   <td><code>--data-binary</code></td>
+   <td>マルチパートリクエストパラメータの場合</td>
+  </tr>
+  <tr>
+   <td><code>--http/VERSION</code></td>
+   <td>HTTP バージョンが 1.1 でない場合</td>
+  </tr>
+  <tr>
+   <td><code>-I</code></td>
+   <td>メソッドが HEAD の場合</td>
+  </tr>
+  <tr>
+   <td><code>-H</code></td>
+   <td>
+    <p>各リクエストヘッダーごとに1つ。</p>
+
+    <p>Firefox 34から、"Accept-Encoding" ヘッダが存在する場合、cURL コマンドに <code>-H "Accept-Encoding: gzip, deflate"</code> の代わりに <code>--compressed</code> が含まれます。これは、レスポンスが自動的に解凍されることを意味します。</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h4 id="CopySave_All_As_HAR">Copy/Save All As HAR</h4>
+
+<p>これらのオプションはリストされたすべての要求に対して HTTP アーカイブ (HAR) を作成します。HAR 形式を使用すると、ネットワークリクエストに関する詳細情報をエクスポートできます。'Copy All As HAR' はデータをクリップボードにコピーし、'Save All As HAR' はアーカイブをディスクに保存するダイアログを開きます。</p>
+
+<p>Firefox 61 以降では、これらのオプションを簡単に発見できるようにツールバーメニューを追加しました ({{bug(1403530)}})。新しい 'HAR' ドロップダウンメニューには、'Copy All As HAR' コマンドと 'Save All As HAR' コマンドの両方と、'Import...' オプションがあります。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16056/har-dropdown.png" style="border-style: solid; border-width: 1px; height: 262px; width: 723px;"></p>
diff --git a/files/ja/tools/network_monitor/throttling/index.html b/files/ja/tools/network_monitor/throttling/index.html
new file mode 100644
index 0000000000..92b46a0b78
--- /dev/null
+++ b/files/ja/tools/network_monitor/throttling/index.html
@@ -0,0 +1,93 @@
+---
+title: スロットリング
+slug: Tools/Network_Monitor/Throttling
+tags:
+  - '110n:priority'
+  - Dev Tools
+  - Firefox
+  - ガイド
+  - ツール
+  - デバッグ
+  - ネットワーク
+translation_of: Tools/Network_Monitor/Throttling
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>ネットワークモニタを使用するとネットワーク速度を調整してさまざまな接続速度をエミュレートすることができるため、アプリケーションがさまざまな接続タイプでどのように動作するかを確認できます。</p>
+
+<h2 id="スロットリング">スロットリング</h2>
+
+<p>ツールバーにはさまざまなネットワーク速度条件をエミュレートするためにネットワーク速度を抑制することを可能にする Throttling ドロップダウンが含まれています。メニューからオプションを選択するだけで、リロードしても維持されます。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16260/throttling.png" style="border: 1px solid black; display: block; height: 177px; margin: 0px auto; width: 150px;"></p>
+
+<p>エミュレートされる特性は次のとおりです。</p>
+
+<ul>
+ <li>ダウンロード速度</li>
+ <li>アップロード速度</li>
+ <li>最小レイテンシー</li>
+</ul>
+
+<p>以下の表は各ネットワークタイプに関連する数値を示していますが、正確な性能測定にはこの機能を使用しないでください。さまざまな条件でのユーザーエクスペリエンスの概算を示すことを意図しています。</p>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selection</th>
+   <th scope="col">ダウンロード速度</th>
+   <th scope="col">アップロード速度</th>
+   <th scope="col">最小レイテンシー (ms)</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>GPRS</td>
+   <td>50 Kb/s</td>
+   <td>20 Kb/s</td>
+   <td>500</td>
+  </tr>
+  <tr>
+   <td>Regular 2G</td>
+   <td>250 Kb/s</td>
+   <td>50 Kb/s</td>
+   <td>300</td>
+  </tr>
+  <tr>
+   <td>Good 2G</td>
+   <td>450 Kb/s</td>
+   <td>150 Kb/s</td>
+   <td>150</td>
+  </tr>
+  <tr>
+   <td>Regular 3G</td>
+   <td>750 Kb/s</td>
+   <td>250 Kb/s</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <td>Good 3G</td>
+   <td>1.5 Mb/s</td>
+   <td>750 Kb/s</td>
+   <td>40</td>
+  </tr>
+  <tr>
+   <td>Regular 4G/LTE</td>
+   <td>4 Mb/s</td>
+   <td>3 Mb/s</td>
+   <td>20</td>
+  </tr>
+  <tr>
+   <td>DSL</td>
+   <td>2 Mb/s</td>
+   <td>1 Mb/s</td>
+   <td>5</td>
+  </tr>
+  <tr>
+   <td>Wi-Fi</td>
+   <td>30 Mb/s</td>
+   <td>15 Mb/s</td>
+   <td>2</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/ja/tools/network_monitor/toolbar/index.html b/files/ja/tools/network_monitor/toolbar/index.html
new file mode 100644
index 0000000000..35aa0ce0a1
--- /dev/null
+++ b/files/ja/tools/network_monitor/toolbar/index.html
@@ -0,0 +1,48 @@
+---
+title: ネットワークモニターツールバー
+slug: Tools/Network_Monitor/toolbar
+tags:
+  - '119n:priority'
+  - Dev Tools
+  - Firefox
+  - ガイド
+  - ツール
+  - デバッグ
+  - ネットワーク
+translation_of: Tools/Network_Monitor/toolbar
+---
+<p>{{ToolsSidebar}}</p>
+
+<p>ネットワークモニタには2つのツールバー領域があり、1つはメインセクションの上に、もう１つは下にあります。</p>
+
+<h2 id="ツールバー">ツールバー</h2>
+
+<p>ツールバーは、メインネットワークモニタウィンドウの上部にあります。</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16247/network_toolbar.png" style="display: block; height: 98px; margin-left: auto; margin-right: auto; width: 1200px;"></p>
+
+<p>It provides:</p>
+
+<ul>
+ <li><a href="/ja/docs/Tools/Network_Monitor">ネットワークリクエストリスト</a>をクリアするアイコン</li>
+ <li><a href="/ja/docs/Tools/Network_Monitor#Filtering_by_URL">URL</a>と<a href="/ja/docs/Tools/Network_Monitor#Filtering_by_properties">プロパティ</a>でリクエストをフィルタできるようにするボックス</li>
+ <li>タイプ別にネットワークリクエストリストをフィルタリングするための一連のアイコン：
+  <ul>
+   <li>レスポンスのコンテンツタイプ別</li>
+   <li>XHR リクエスト</li>
+   <li>WebSocketのアップグレード（WSとラベル付け）</li>
+  </ul>
+  デフォルトでは、新しいページに移動するか現在のページをリロードするたびにネットワークモニタがクリアされます。[Persist Logs] チェックボックスをオンにするとこの動作を変更できます。</li>
+ <li>キャッシュを無効にするためのチェックボックス。</li>
+ <li>スロットリング</li>
+ <li>HAR</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16248/network_monitor_bottom_toolbar.png" style="border: 1px solid black; height: 48px; width: 2010px;"></p>
+
+<p>ネットワークモニタの下部にある2番目のツールバー領域には、次の項目があります。</p>
+
+<ul>
+ <li><a href="/ja/docs/Tools/Network_Monitor#Performance_analysis">パフォーマンス分析</a>を開始するアイコン。</li>
+ <li>リクエスト数、合計サイズ、合計時間など、このページの概要。</li>
+</ul>