diff options
Diffstat (limited to 'files/zh-cn/web/media/formats/video_codecs/index.html')
| -rw-r--r-- | files/zh-cn/web/media/formats/video_codecs/index.html | 34 |
1 files changed, 17 insertions, 17 deletions
diff --git a/files/zh-cn/web/media/formats/video_codecs/index.html b/files/zh-cn/web/media/formats/video_codecs/index.html index b520cca7b6..4c659e89e7 100644 --- a/files/zh-cn/web/media/formats/video_codecs/index.html +++ b/files/zh-cn/web/media/formats/video_codecs/index.html @@ -55,17 +55,17 @@ original_slug: Web/Media/Formats/视频编解码器 <td><a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MP4</a></td> </tr> <tr> - <th scope="row">{{anch("MP4V-ES")}}</th> + <th scope="row"><a href="#mp4v-es">MP4V-ES</a></th> <td>MPEG-4 Video Elemental Stream</td> <td><a href="/en-US/docs/Web/Media/Formats/Containers#3GP">3GP</a>, <a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MP4</a></td> </tr> <tr> - <th scope="row">{{anch("MPEG-1")}}</th> + <th scope="row"><a href="#mpeg-1_part_2_video">MPEG-1</a></th> <td>MPEG-1 Part 2 Visual</td> <td><a href="/en-US/docs/Web/Media/Formats/Containers#MPEGMPEG-2">MPEG</a>, <a href="/en-US/docs/Web/Media/Formats/Containers#QuickTime">QuickTime</a></td> </tr> <tr> - <th scope="row">{{anch("MPEG-2")}}</th> + <th scope="row"><a href="#mpeg-2_part_2_video">MPEG-2</a></th> <td>MPEG-2 Part 2 Visual</td> <td><a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MP4</a>, <a href="/en-US/docs/Web/Media/Formats/Containers#MPEGMPEG-2">MPEG</a>, <a href="/en-US/docs/Web/Media/Formats/Containers#QuickTime">QuickTime</a></td> </tr> @@ -116,7 +116,7 @@ original_slug: Web/Media/Formats/视频编解码器 </tr> <tr> <th scope="row">Frame rate</th> - <td>Primarily affects the perceived smoothness of the motion in the image. To a point, the higher the frame rate, the smoother and more realistic the motion will appear. Eventually the point of diminishing returns is reached. See {{anch("Frame rate")}} below for details.</td> + <td>Primarily affects the perceived smoothness of the motion in the image. To a point, the higher the frame rate, the smoother and more realistic the motion will appear. Eventually the point of diminishing returns is reached. See <a href="#reduced_frame_rate">Frame rate</a> below for details.</td> <td>Assuming the frame rate is not reduced during encoding, higher frame rates cause larger compressed video sizes.</td> </tr> <tr> @@ -235,7 +235,7 @@ original_slug: Web/Media/Formats/视频编解码器 <p><a href="https://mdn.mozillademos.org/files/16684/Ringing-effects.png"><img alt="Example of the ringing effect" src="https://mdn.mozillademos.org/files/16684/Ringing-effects.png" style="height: 368px; width: 350px;"></a></p> -<p>Note the blue and pink fringes around the edges of the star above (as well as the stepping and other significant compression artifacts). Those fringes are the ringing effect. Ringing is similar in some respects to {{anch("Mosquito noise", "mosquito noise")}}, except that while the ringing effect is more or less steady and unchanging, mosquito noise shimmers and moves.</p> +<p>Note the blue and pink fringes around the edges of the star above (as well as the stepping and other significant compression artifacts). Those fringes are the ringing effect. Ringing is similar in some respects to <a href="#mosquito_noise">mosquito noise</a>, except that while the ringing effect is more or less steady and unchanging, mosquito noise shimmers and moves.</p> <p>RInging is another type of artifact that can make it particularly difficult to read text contained in your images.</p> @@ -257,7 +257,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h3 id="Mosquito_noise">Mosquito noise</h3> -<p><strong>Mosquito noise</strong> is a temporal artifact which presents as noise or <strong>edge busyness</strong> that appears as a flickering haziness or shimmering that roughly follows outside the edges of objects with hard edges or sharp transitions between foreground objects and the background. The effect can be similar in appearance to {{anch("Ringing", "ringing")}}.</p> +<p><strong>Mosquito noise</strong> is a temporal artifact which presents as noise or <strong>edge busyness</strong> that appears as a flickering haziness or shimmering that roughly follows outside the edges of objects with hard edges or sharp transitions between foreground objects and the background. The effect can be similar in appearance to <a href="#ringing">ringing</a>.</p> <p><img alt="" src="https://mdn.mozillademos.org/files/16687/mosquito-effect-sm.png" style="height: 393px; width: 400px;"></p> @@ -316,7 +316,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h3 id="AV1">AV1</h3> -<p>The <strong>AOMedia Video 1</strong> (<strong>AV1</strong>) codec is an open format designed by the <a href="https://aomedia.org/">Alliance for Open Media</a> specifically for internet video. It achieves higher data compression rates than {{anch("VP9")}} and {{anch("HEVC", "H.265/HEVC")}}, and as much as 50% higher rates than <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">AVC</a>. AV1 is fully royalty-free and is designed for use by both the {{HTMLElement("video")}} element and by <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a>.</p> +<p>The <strong>AOMedia Video 1</strong> (<strong>AV1</strong>) codec is an open format designed by the <a href="https://aomedia.org/">Alliance for Open Media</a> specifically for internet video. It achieves higher data compression rates than <a href="#vp9">VP9</a> and <a href="#hevc_h.265">H.265/HEVC</a>, and as much as 50% higher rates than <a href="/en-US/docs/Web/Media/Formats/Video_codecs#AVC_(H.264)">AVC</a>. AV1 is fully royalty-free and is designed for use by both the {{HTMLElement("video")}} element and by <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a>.</p> <p>AV1 currently offers three profiles: <strong>main</strong>, <strong>high</strong>, and <strong>professional</strong> with increasing support for color depths and chroma subsampling. In addition, a series of <strong>levels</strong> are specified, each defining limits on a range of attributes of the video. These attributes include frame dimensions, image area in pixels, display and decode rates, average and maximum bit rates, and limits on the number of tiles and tile columns used in the encoding/decoding process.</p> @@ -689,7 +689,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h3 id="HEVC_H.265"><a id="HEVC" name="HEVC">HEVC</a> (H.265)</h3> -<p>The <strong><a href="http://hevc.info/">High Efficiency Video Coding</a></strong> (<strong>HVEC</strong>) codec is defined by ITU's <strong>H.265</strong> as well as by MPEG-H Part 2 (the still in-development follow-up to MPEG-4). HEVC was designed to support efficient encoding and decoding of video in sizes including very high resolutions (including 8K video), with a structure specifically designed to let software take advantage of modern processors. Theoretically, HEVC can achieve compressed file sizes half that of {{anch("AVC")}} but with comparable image quality.</p> +<p>The <strong><a href="http://hevc.info/">High Efficiency Video Coding</a></strong> (<strong>HVEC</strong>) codec is defined by ITU's <strong>H.265</strong> as well as by MPEG-H Part 2 (the still in-development follow-up to MPEG-4). HEVC was designed to support efficient encoding and decoding of video in sizes including very high resolutions (including 8K video), with a structure specifically designed to let software take advantage of modern processors. Theoretically, HEVC can achieve compressed file sizes half that of <a href="#avc_h.264">AVC</a> but with comparable image quality.</p> <p>For example, each coding tree unit (CTU)—similar to the macroblock used in previous codecs—consists of a tree of luma values for each sample as well as a tree of chroma values for each chroma sample used in the same coding tree unit, as well as any required syntax elements. This structure supports easy processing by multiple cores.</p> @@ -1268,7 +1268,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h3 id="VP8">VP8</h3> -<p>The <strong>Video Processor 8</strong> (<strong>VP8</strong>) codec was initially created by On2 Technologies. Following their purchase of On2, Google released VP8 as an open and royalty-free video format under a promise not to enforce the relevant patents. In terms of quality and compression rate, VP8 is comparable to {{anch("AVC")}}.</p> +<p>The <strong>Video Processor 8</strong> (<strong>VP8</strong>) codec was initially created by On2 Technologies. Following their purchase of On2, Google released VP8 as an open and royalty-free video format under a promise not to enforce the relevant patents. In terms of quality and compression rate, VP8 is comparable to <a href="#avc_h.264">AVC</a>.</p> <p>If supported by the browser, VP8 allows video with an alpha channel, allowing the video to play with the background able to be seen through the video to a degree specified by each pixel's alpha component.</p> @@ -1375,7 +1375,7 @@ original_slug: Web/Media/Formats/视频编解码器 <p>VP9's main profile supports only 8-bit color depth at 4:2:0 chroma subsampling levels, but its profiles include support for deeper color and the full range of chroma subsampling modes. It supports several HDR imiplementations, and offers substantial freedom in selecting frame rates, aspect ratios, and frame sizes.</p> -<p>VP9 is widely supported by browsers, and hardware implementations of the codec are fairly common. VP9 is one of the two video codecs mandated by <a href="/en-US/docs/Web/Media/Formats/Containers#WebM">WebM</a> (the other being {{anch("VP8")}}). Of note, however, is that Safari supports neither WebM nor VP9, so if you choose to use VP9, be sure to offer a fallback format such as AVC or HEVC for iPhone, iPad, and Mac users.</p> +<p>VP9 is widely supported by browsers, and hardware implementations of the codec are fairly common. VP9 is one of the two video codecs mandated by <a href="/en-US/docs/Web/Media/Formats/Containers#WebM">WebM</a> (the other being <a href="#vp8">VP8</a>). Of note, however, is that Safari supports neither WebM nor VP9, so if you choose to use VP9, be sure to offer a fallback format such as AVC or HEVC for iPhone, iPad, and Mac users.</p> <p>Aside from the lack of Safari support, VP9 is a good choice if you are able to use a WebM container and are able to provide a fallback video in a format such as AVC or HEVC for Safari users. This is especially true if you wish to use an open codec rather than a proprietary one. If you can't provide a fallback and aren't willing to sacrifice Safari compatibility, VP9 in WebM is a good option. Otherwise, you should probably consider a different codec.</p> @@ -1525,13 +1525,13 @@ original_slug: Web/Media/Formats/视频编解码器 <ol> <li> - <p>A <strong><a href="/en-US/docs/Web/Media/Formats/Containers#WebM">WebM</a></strong> container using the <strong>{{anch("VP8")}}</strong> codec for video and the <strong><a href="/en-US/docs/Web/Media/Formats/Audio_codecs#Opus">Opus</a></strong> codec for audio. These are all open, royalty-free formats which are generally well-supported, although only in quite recent browsers, which is why a fallback is a good idea.</p> + <p>A <strong><a href="/en-US/docs/Web/Media/Formats/Containers#WebM">WebM</a></strong> container using the <strong><a href="#vp8">VP8</a></strong> codec for video and the <strong><a href="/en-US/docs/Web/Media/Formats/Audio_codecs#Opus">Opus</a></strong> codec for audio. These are all open, royalty-free formats which are generally well-supported, although only in quite recent browsers, which is why a fallback is a good idea.</p> <pre class="brush: js"><video controls src="filename.webm"></video> </pre> </li> <li> - <p>An <strong><a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MP4</a></strong> container and the <strong>{{anch("AVC")}}</strong> (<strong>H.264</strong>) video codec, ideally with <strong><a href="/en-US/docs/Web/Media/Formats/Audio_codecs#AAC">AAC</a></strong> as your audio codec. This is because the MP4 container with AVC and AAC codecs within is a broadly-supported combination—by every major browser, in fact—and the quality is typically good for most use cases. Make sure you verify your compliance with the license requirements, however.</p> + <p>An <strong><a href="/en-US/docs/Web/Media/Formats/Containers#MP4">MP4</a></strong> container and the <strong><a href="#avc_h.264">AVC</a></strong> (<strong>H.264</strong>) video codec, ideally with <strong><a href="/en-US/docs/Web/Media/Formats/Audio_codecs#AAC">AAC</a></strong> as your audio codec. This is because the MP4 container with AVC and AAC codecs within is a broadly-supported combination—by every major browser, in fact—and the quality is typically good for most use cases. Make sure you verify your compliance with the license requirements, however.</p> <pre class="brush: html"><video controls> <source type="video/webm" @@ -1559,7 +1559,7 @@ original_slug: Web/Media/Formats/视频编解码器 </pre> </li> <li> - <p>An MP4 container using the {{anch("HEVC")}} codec using one of the advanced Main profiles, such as Main 4:2:2 with 10 or 12 bits of color depth, or even the Main 4:4:4 profile at up to 16 bits per component. At a high bit rate, this provides excellent graphics quality with remarkable color reproduction. In addition, you can optionally include HDR metadata to provide high dynamic range video. For audio, use the AAC codec at a high sample rate (at least 48 kHz but ideally 96kHz) and encoded with complex encoding rather than fast encoding.</p> + <p>An MP4 container using the <a href="#hevc_h.265">HEVC</a> codec using one of the advanced Main profiles, such as Main 4:2:2 with 10 or 12 bits of color depth, or even the Main 4:4:4 profile at up to 16 bits per component. At a high bit rate, this provides excellent graphics quality with remarkable color reproduction. In addition, you can optionally include HDR metadata to provide high dynamic range video. For audio, use the AAC codec at a high sample rate (at least 48 kHz but ideally 96kHz) and encoded with complex encoding rather than fast encoding.</p> <pre class="brush: html"><video controls> <source type="video/webm" @@ -1579,7 +1579,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h4 id="Preparing_video_externally">Preparing video externally</h4> -<p>To prepare video for archival purposes from outside your web site or app, use a utility that performs compression on the original uncompressed video data. For example, the free <a href="https://www.videolan.org/developers/x264.html">x264</a> utility can be used to encode video in {{anch("AVC")}} format using a very high bit rate:</p> +<p>To prepare video for archival purposes from outside your web site or app, use a utility that performs compression on the original uncompressed video data. For example, the free <a href="https://www.videolan.org/developers/x264.html">x264</a> utility can be used to encode video in <a href="#avc_h.264">AVC</a> format using a very high bit rate:</p> <pre>x264 --crf 18 -preset ultrafast --output <em>outfilename.mp4</em> <em>infile</em></pre> @@ -1587,7 +1587,7 @@ original_slug: Web/Media/Formats/视频编解码器 <h4 id="Recording_video">Recording video</h4> -<p>Given the constraints on how close to lossless you can get, you might consider using {{anch("AVC")}} or {{anch("AV1")}}. For example, if you're using the <a href="/en-US/docs/Web/API/MediaStream_Recording_API">MediaStream Recording API</a> to record video, you might use code like the following when creating your {{domxref("MediaRecorder")}} object:</p> +<p>Given the constraints on how close to lossless you can get, you might consider using <a href="#avc_h.264">AVC</a> or <a href="#av1">AV1</a>. For example, if you're using the <a href="/en-US/docs/Web/API/MediaStream_Recording_API">MediaStream Recording API</a> to record video, you might use code like the following when creating your {{domxref("MediaRecorder")}} object:</p> <pre class="brush: js">const kbps = 1024; const Mbps = kbps*kbps; @@ -1599,7 +1599,7 @@ const options = { let recorder = new MediaRecorder(sourceStream, options);</pre> -<p>This example creates a <code>MediaRecorder</code> configured to record {{anch("AV1")}} video using BT.2100 HDR in 12-bit color with 4:4:4 chroma subsampling and <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#FLAC">FLAC</a> for lossless audio. The resulting file will use a bit rate of no more than 800 Mbps shared between the video and audio tracks. You will likely need to adjust these values depending on hardware performance, your requirements, and the specific codecs you choose to use. This bit rate is obviously not realistic for network transmission and would likely only be used locally.</p> +<p>This example creates a <code>MediaRecorder</code> configured to record <a href="#av1">AV1</a> video using BT.2100 HDR in 12-bit color with 4:4:4 chroma subsampling and <a href="/en-US/docs/Web/Media/Formats/Audio_codecs#FLAC">FLAC</a> for lossless audio. The resulting file will use a bit rate of no more than 800 Mbps shared between the video and audio tracks. You will likely need to adjust these values depending on hardware performance, your requirements, and the specific codecs you choose to use. This bit rate is obviously not realistic for network transmission and would likely only be used locally.</p> <p>Breaking down the value of the <code>codecs</code> parameter into its dot-delineated properties, we see the following:</p> @@ -1613,7 +1613,7 @@ let recorder = new MediaRecorder(sourceStream, options);</pre> <tbody> <tr> <td><code>av01</code></td> - <td>The four-character code (4CC) designation identifying the {{anch("AV1")}} codec.</td> + <td>The four-character code (4CC) designation identifying the <a href="#av1">AV1</a> codec.</td> </tr> <tr> <td><code>2</code></td> |