多媒体技术 on Last Stand

多媒体技术 on Last Standhttps://amatsuzero.github.io/LastStand/tags/%E5%A4%9A%E5%AA%92%E4%BD%93%E6%8A%80%E6%9C%AF/Recent content in 多媒体技术 on Last StandHugozh-cnWed, 06 Nov 2024 00:00:00 +0800多媒体技术https://amatsuzero.github.io/LastStand/posts/frontend/html/html-009/Fri, 27 Sep 2024 00:00:00 +0800https://amatsuzero.github.io/LastStand/posts/frontend/html/html-009/<p>对于大多数前端工程师来说，音视频技术是一个比较少涉足的领域，</p> <p>本知识点主要介绍流媒体技术中的<strong>文本</strong>、<strong>图形</strong>、<strong>图像</strong>、<strong>音频</strong>和<strong>视频</strong>多种理论知识，涉及到播放器、web媒体技术、主流框架等内容。</p> <h3 id="一音视频基础">一、音视频基础</h3> <h4 id="11-视频">1.1 视频</h4> <h5 id="111-基础概念">1.1.1 基础概念</h5> <table> <thead> <tr> <th><strong>码率</strong></th> <th>单位时间内取样率越大，精度就越高，处理出来的文件就越接近原始文件。</th> </tr> </thead> <tbody> <tr> <td><strong>帧率</strong></td> <td>对视频来说，帧率对应这观看卡顿。帧率越高，流畅度越高，低帧率会造成视觉卡顿。</td> </tr> <tr> <td><strong>压缩率</strong></td> <td>经过压缩后文件的大小 / 原始文件的大小 * 100% = 压缩率。编码压缩越小越好，但压得越小，解压时间</td> </tr> <tr> <td><strong>分辨率</strong></td> <td>用于度量图像内数据量多少的一个参数，和视频清晰度息息相关。</td> </tr> </tbody> </table> <h5 id="112-视频容器格式">1.1.2 视频容器格式</h5> <p>容器格式相信大家经常见到：<br> MP4、AVI、FLV、TS/M3U8、WebM、OGV、MOV…</p> <h5 id="112-视频编码格式">1.1.2 视频编码格式</h5> <table> <thead> <tr> <th><strong>H.264</strong></th> <th>目前最流行的编码格式。</th> </tr> </thead> <tbody> <tr> <td><strong>H.265</strong></td> <td>新型的编码格式，高效的视频编码。用来以替代H.264/AVC编码标准。</td> </tr> <tr> <td><strong>VP9</strong></td> <td>VP9是WebM Project开发的下一代视频编码格式。VP9支持从低比特率压缩到高质量超高清的所有Web和移动用例，并额外支持10/12位编码和HDR</td> </tr> <tr> <td><strong>AV1</strong></td> <td>AOM（Alliance for Open Media，开放媒体联盟）制定的一个开源、免版权费的视频编码格式。AV1是google制定的VP9标准的继任者，也是H265强有力的竞争者。</td> </tr> </tbody> </table> <h4 id="12-音频">1.2 音频</h4> <h5 id="121-基础概念">1.2.1 基础概念</h5> <table> <thead> <tr> <th><strong>采样率</strong></th> <th>音频采样率是指录音设备在一秒钟内对声音信号的采样次数，采样频率越高声音的还原就越真实越自然。</th> </tr> </thead> <tbody> <tr> <td><strong>采样大小</strong></td> <td>一秒钟所采的样本数为比特率，每个样本中信息的比特数就是位深，即采样精度，单位为Bit。</td> </tr> <tr> <td><strong>比特率</strong></td> <td>指每秒传送的比特(bit)数，又称数据信号速率。单位为比特/秒、千比特/秒或兆比特/秒。比特率越高，表示单位时间传送的数据就越多。</td> </tr> <tr> <td><strong>压缩率</strong></td> <td>原始音频数据与通过PCM等压缩编码技术压缩后的数据大小的比率</td> </tr> </tbody> </table> <h5 id="122-音频容器格式">1.2.2 音频容器格式</h5> <p>音频格式也比较常见：WAV、AIFF、AMR、MP3、Ogg…</p> <h5 id="123-音频编码格式">1.2.3 音频编码格式</h5> <table> <thead> <tr> <th><strong>PCM</strong></th> <th>脉冲编码调制(Pulse Code Modulation,PCM)，PCM是数字通信的编码方式之一。</th> </tr> </thead> <tbody> <tr> <td><strong>AAC-LC(MPEG AAC Low Complexity)</strong></td> <td>低复杂度编码解码器（AAC-LC — 低复杂度高级音频编码）是低比特率、优质音频的高性能音频编码解码器。</td> </tr> <tr> <td><strong>AAC-LD</strong></td> <td>（又名AAC低延迟或MPEG-4低延迟音频编码器），为电话会议和OTT服务量身打造的低延迟音频编解码器</td> </tr> <tr> <td><strong>LAC（Free Lossless Audio Codec）</strong></td> <td>免费无损音频编解码器。是一套著名的自由音频压缩编码，其特点是无损压缩。 2012年以来它已被很多软件及硬件音频产品（如CD等）所支持。</td> </tr> </tbody> </table> <h4 id="13-常见标签">1.3 常见标签</h4> <h5 id="131-audio-元素">1.3.1 <code><audio></code> 元素</h5> <h6 id="1311-基本用途">1.3.1.1 基本用途</h6> <p><code><audio></code> 元素用于在网页中嵌入音频内容。它可以播放音乐、播客、音效等。</p>