initial commit

1 files changed, 123 insertions, 0 deletions

diff --git a/files/ja/web/api/long_tasks_api/index.html b/files/ja/web/api/long_tasks_api/index.html
new file mode 100644
index 0000000000..f6d3025a6f
--- /dev/null
+++ b/files/ja/web/api/long_tasks_api/index.html
@@ -0,0 +1,123 @@
+---
+title: Long Tasks API
+slug: Web/API/Long_Tasks_API
+tags:
+  - API
+  - Experimental
+  - Landing
+  - Long Tasks API
+  - Overview
+  - Performance
+  - PerformanceLongTaskTiming
+  - Reference
+  - TaskAttributionTiming
+  - Web Performance
+translation_of: Web/API/Long_Tasks_API
+---
+<p>{{DefaultAPISidebar("Long Tasks")}}</p>
+
+<h2 id="Motivation" name="Motivation">動機</h2>
+
+<p><span class="seoSummary">実験的な Long Tasks API（長いタスク API）により、50ミリ秒以上かかるタスクを可視化できます。</span> 50ミリ秒のしきい値は、<a href="https://developers.google.com/web/fundamentals/performance/rail">RAIL モデル</a>、特に「<a href="https://developers.google.com/web/fundamentals/performance/rail#response">Response: process events in under 50ms</a>（応答: 50ミリ秒未満でイベントを処理、英語版を参照のこと）」のセクションから来ています。</p>
+
+<p>50ミリ秒以上メインスレッドをブロックするタスクは、次のような問題があります。</p>
+
+<ul>
+ <li>「{{glossary("Time to interactive","対話までの時間")}}」の遅延</li>
+ <li>高/可変入力待ち時間</li>
+ <li>高/可変イベント処理待ち時間</li>
+ <li>ぎくしゃくしたアニメーションとスクロール</li>
+</ul>
+
+<h2 id="Concepts" name="Concepts">概念</h2>
+
+<p>Long Tasks API によって使用されるいくつかの重要な用語またはアイデア。</p>
+
+<dl>
+ <dt>
+ <h3 id="Long_task" name="Long_task">長いタスク</h3>
+ </dt>
+</dl>
+
+<p>メイン UI スレッドが50ミリ秒以上ビジーである継続期間。 一般的な例は次のとおりです。</p>
+
+<ul>
+ <li>長期実行イベントハンドラ</li>
+ <li>高価なリフローやその他の再レンダリング</li>
+ <li>50ミリ秒を超えるイベントループの異なるターンの間にブラウザーが実行する作業</li>
+</ul>
+
+<h3 id="Culprit_browsing_context_container" name="Culprit_browsing_context_container">犯人の閲覧コンテキストコンテナ</h3>
+
+<p>「犯人の閲覧コンテキストコンテナ（Culprit browsing context container）」、または略して「コンテナ」は、タスクが発生した最上位ページ、iframe、embed、object です。</p>
+
+<h3 id="Attributions" name="Attributions">帰属（Attributions）</h3>
+
+<p>タスクが発生したコンテナのリスト。 トップレベルページ内で発生しないタスクの場合、<code>containerId</code>、<code>containerName</code>、<code>containerSrc</code> の各フィールドは、タスクのソースに関する情報を提供することがあります。</p>
+
+<h2 id="Usage" name="Usage">使用法</h2>
+
+<pre class="brush: js">var observer = new PerformanceObserver(function(list) {
+    var perfEntries = list.getEntries();
+    for (var i = 0; i &lt; perfEntries.length; i++) {
+        // 長いタスク通知を処理します
+        // 分析とモニタリングについて報告する
+        // ...
+    }
+});
+// 長いタスク通知用のオブザーバーを登録する
+observer.observe({entryTypes: ["longtask"]});
+// この後スクリプトを長時間実行すると、オブザーバー内で
+// "longtask" エントリがキューに入れられ、受信されます。
+</pre>
+
+<h2 id="Interfaces" name="Interfaces">インターフェイス</h2>
+
+<dl>
+ <dt>{{domxref('PerformanceLongTaskTiming')}}</dt>
+ <dd>長いタスクのインスタンスを報告します。</dd>
+ <dt>{{domxref("TaskAttributionTiming")}}</dt>
+ <dd> 長いタスクに関連する作業とそれに関連するフレームコンテキストに関する情報を返します。</dd>
+</dl>
+
+<h2 id="Specifications" name="Specifications">仕様</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">仕様</th>
+   <th scope="col">状態</th>
+   <th scope="col">コメント</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Long Tasks')}}</td>
+   <td>{{Spec2('Long Tasks')}}</td>
+   <td>初期定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<h3 id="PerformanceLongTaskTiming" name="PerformanceLongTaskTiming"><code>PerformanceLongTaskTiming</code></h3>
+
+<div>
+<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div>
+
+<p>{{Compat("api.PerformanceLongTaskTiming")}}</p>
+</div>
+
+<h3 id="TaskAttributionTiming" name="TaskAttributionTiming"><code>TaskAttributionTiming</code></h3>
+
+<div>
+<div class="hidden">このページの互換性テーブルは構造化データから生成されます。データに貢献したい場合は <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックして、プルリクエストを送ってください。</div>
+
+<p>{{Compat("api.TaskAttributionTiming")}}</p>
+</div>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="https://github.com/w3c/longtasks">GitHub リポジトリ</a>にはドキュメントといくつかのコードサンプルが含まれています。</li>
+ <li>2017年12月20日の Long Tasks API に関する <a href="https://calendar.perfplanet.com/2017/tracking-cpu-with-long-tasks-api/">PerfPlanet の記事</a>。</li>
+</ul>