initial commit

2 files changed, 179 insertions, 0 deletions

diff --git a/files/zh-cn/web/api/videoplaybackquality/index.html b/files/zh-cn/web/api/videoplaybackquality/index.html
new file mode 100644
index 0000000000..cc4d62a270
--- /dev/null
+++ b/files/zh-cn/web/api/videoplaybackquality/index.html
@@ -0,0 +1,115 @@
+---
+title: VideoPlaybackQuality
+slug: Web/API/VideoPlaybackQuality
+translation_of: Web/API/VideoPlaybackQuality
+---
+<p>{{APIRef("Media Source Extensions")}}{{SeeCompatTable}}</p>
+
+<p><code><strong>VideoPlaybackQuality</strong></code> 对象表示了一系列描述视频播放质量的指标。</p>
+
+<p>可以通过 {{domxref("HTMLVideoElement.getVideoPlaybackQuality()")}} 创建一个实例。</p>
+
+<h2 id="属性">属性</h2>
+
+<p><em><code>VideoPlaybackQuality</code> 对象不继承任何属性。</em></p>
+
+<dl>
+ <dt>{{domxref("VideoPlaybackQuality.creationTime")}} {{readonlyInline}}</dt>
+ <dd>一个用毫秒表示从开始页面浏览到对象创建的 {{domxref("DOMHighResTimeStamp")}} 对象。</dd>
+ <dt>{{domxref("VideoPlaybackQuality.totalVideoFrames")}} {{readonlyInline}}</dt>
+ <dd>一个表示相关联的 {{domxref("HTMLVideoElement")}} 自从创建起的已创建和丢弃帧数数量总和的 unsigned long 值。.</dd>
+ <dt>{{domxref("VideoPlaybackQuality.droppedVideoFrames")}} {{readonlyInline}}</dt>
+ <dd>一个表示相关联的 {{domxref("HTMLVideoElement")}} 自从创建起的已丢弃帧数数量的 <code>unsigned long</code> 值。</dd>
+ <dt>{{domxref("VideoPlaybackQuality.corruptedVideoFrames")}} {{readonlyInline}}</dt>
+ <dd>一个表示相关联的 {{domxref("HTMLVideoElement")}} 自从创建起的损坏帧数数量的 <code>unsigned long</code> 值。一个损坏帧可能属于创建帧或丢弃帧。</dd>
+ <dt>{{domxref("VideoPlaybackQuality.totalFrameDelay")}} {{readonlyInline}} {{ obsolete_inline(30) }}</dt>
+ <dd>一个表示相关联的 {{domxref("HTMLVideoElement")}} 自从创建起的帧延迟总和的 double 值。帧延迟是指一个帧的理论展示时间与实际显示时间的差值。</dd>
+</dl>
+
+<h2 id="方法">方法</h2>
+
+<p><em><code>VideoPlaybackQuality</code> 对象没有实现任何特定方法，也没有继承任何方法。</em></p>
+
+<h2 id="规范">规范</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">规范</th>
+   <th scope="col">状态</th>
+   <th scope="col">注释</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Media Source Extensions', '#videoplaybackquality', 'VideoPlaybackQuality')}}</td>
+   <td>{{Spec2('Media Source Extensions')}}</td>
+   <td>最初定义</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容性">浏览器兼容性</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>特性</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>23</td>
+   <td>{{CompatGeckoDesktop("25.0")}}<sup>[1]</sup><br>
+    {{CompatGeckoDesktop("42.0")}}</td>
+   <td>11<sup>[2]</sup></td>
+   <td>15</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>特性</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>4.4.4</td>
+   <td>
+    <p>{{CompatNo}}</p>
+   </td>
+   <td>{{CompatNo}}</td>
+   <td>11</td>
+   <td>30</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] 在更改 <code>about:config</code> 中的 media.mediasource.enabled 项为 true 后可用。 此外，支持仅限于白名单站点，例如YouTube、Netflix等其他著名视频站点。在 42+ 后白名单已被移除并且 Media Source Extensions已默认对所有站点启用。</p>
+
+<p>[2] 只在 Windows 8+ 下可用。</p>
+
+<h2 id="另见">另见</h2>
+
+<ul>
+ <li>The {{domxref("HTMLVideoElement.getVideoPlaybackQuality()")}} method for constructing and returning this interface.</li>
+ <li>{{domxref("MediaSource")}}</li>
+ <li>{{domxref("SourceBuffer")}}</li>
+</ul>
diff --git a/files/zh-cn/web/api/videoplaybackquality/totalvideoframes/index.html b/files/zh-cn/web/api/videoplaybackquality/totalvideoframes/index.html
new file mode 100644
index 0000000000..3eb0437b36
--- /dev/null
+++ b/files/zh-cn/web/api/videoplaybackquality/totalvideoframes/index.html
@@ -0,0 +1,64 @@
+---
+title: VideoPlaybackQuality.totalVideoFrames
+slug: Web/API/VideoPlaybackQuality/totalVideoFrames
+translation_of: Web/API/VideoPlaybackQuality/totalVideoFrames
+---
+<pre><em>videoPlaybackQuality的</em><strong>totalVideoFrames属性为一个只读属性，用于表述已经被加载的媒体资源中已经被渲染播放或者被废弃的视频帧总数</strong></pre>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><em>value</em> = <em>videoPlaybackQuality</em>.totalVideoFrames;</pre>
+
+<h3 id="Value">Value</h3>
+
+<p>video容器<strong>已经被加载的媒体资源中已经被渲染播放或者被废弃的视频帧总数，本质上讲，这个总数是指没有发生播放异常问题下的数目。</strong></p>
+
+<h2 id="Example">Example</h2>
+
+<p>下面的例子想要表述的是通过已经丢弃（丢帧）或者播放异常的帧数总和占totalVideoFrames的比例超过10%，则触发一个例如名为lostFramesThresholdExceeded的回调函数以反应我们当前视频资源丢帧已经播放异常的程度，从而帮助业务进行调整</p>
+
+<pre class="brush: js">var videoElem = document.getElementById("my_vid");
+var quality = videoElem.getVideoPlaybackQuality();
+
+if ((quality.corruptedVideoFrames + quality.droppedVideoFrames)/quality.totalVideoFrames &gt; 0.1) {
+  lostFramesThresholdExceeded();
+}</pre>
+
+
+
+<pre dir="ltr" id="tw-target-text">触发回调函数后，我们可以使用一些算法来尝试切换到需要较少带宽，码率低的，较低分辨率视频，以避免丢帧。</pre>
+
+
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Media Playback Quality', '#videoplaybackquality-interface', 'VideoPlaybackQuality.totalVideoFrames')}}</td>
+   <td>{{Spec2('Media Playback Quality')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("api.VideoPlaybackQuality.totalVideoFrames")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>The {{domxref("HTMLVideoElement.getVideoPlaybackQuality()")}} method for constructing and returning this interface.</li>
+</ul>