【第二屆位元組青訓營 - 寒假前端場】Web 多媒體入門の學習筆記
theme: channing-cyan
Web 多媒體入門
編碼格式
影象基本概念：
影象解析度：用於確定組成一副影象的畫素資料，就是指在水平和垂直方向上影象所具有的畫素個數。
影象深度：影象深度是指儲存每個畫素所需要的位元數。影象深度決定了影象的每個畫素可能的顏色數，或可能的灰度級數。例如，彩色影象每個畫素用R，G，B三個分量表示，每個分量用8位，畫素深度為24位，可以表示的顏色數目為2的24次方，既16777216個；一副單色影象儲存每個畫素需要8bit，則影象的畫素深度為8位，最大灰度數目為2的8次方，既256個。
視訊的基本概念
視訊基本概念
- 解析度：每一幀的影象解析度，單位英寸所包含的畫素點
- 幀率：視訊單位時間內包含的視訊幀的數量
- 位元速率（bps）：就是指視訊單位時間內傳輸的資料量，一般我們用kbps來表示，即千位
I幀：幀內編碼幀（intra picture）,I幀通常是每個GOP的第一幀，經過適度地壓縮，作為隨機訪問的參考點可以當成靜態影象。I幀可以看做一個影象經過壓縮後的產物，I幀壓縮可以得6：1的壓縮比而不會產生任何可覺察的模糊現象。
P幀：前向預測編碼在幀(predictive-frame),通過將影象序列中前面已編碼幀的時間冗餘資訊去充分去除壓縮傳輸資料量的編碼影象，也成為預測幀。
B幀：雙向預測內插編碼幀（bi-directionalinterpolated prediction frame）,既考慮源影象序列前面的已編碼幀，又估計源影象序列後面的已編碼幀之間的時間冗餘資訊，來壓縮傳輸資料量的編碼影象，也成為雙向預測幀。
解碼時間戳:時間戳的主要目的在於通過一定的技術手段，對資料產生的時間進行認證，從而驗證這段資料在產生後是否經過篡改。解碼時間戳( DTS )表明訪問單元立即拆除,從接收機緩衝區並解碼的時間.
PPS ，全稱是 Packet Per Second（包 / 秒），表示以網路包為單位的傳輸速率，一般用來評估系統對於網路的轉發能力。
GOP（group of picture）策略影響編碼質量，所謂GOP，意思是畫面組，一個GOP就是一組連續的畫面。 GOP是序列中的一個圖片集，用來輔助隨機存取。 GOP的第一個影象必須為I幀，這樣就能保證GOP不需要參考其他影象，可以獨立解碼。
兩個幀之間的間隔，一般為2-4秒。
一個GO解碼不依賴其他幀。
被壓縮的內容是什麼？
空間冗餘：同色區域畫素重複。同一景物表面上取樣點的顏色之間通常存在著空間相關性，相鄰各點的取值往往相近或者相同，這就是空間冗餘。
時間重複：在視訊、動畫影象中，相鄰幀之間往往存在著時間和空間的相關性。其中的相鄰幀在對應位置的畫素之間，亮度和色度資訊存在著極強的相關性。
編碼冗餘：顏色儲存時候，顏色不太多。人們用於表達某一資訊所需要的位元數總比理論上表示該資訊所需要的最少位元數要大，它們之間的差距就是資訊熵冗餘，或稱編碼冗餘。
視覺冗餘：人類眼睛對顏色不太敏感，將看不到的顏色遮蔽。人眼不能感知或不敏感的那部分影象資訊。
編碼資料處理流程：
I幀壓縮可去掉視訊的空間冗餘資訊，P幀和B幀是可以去掉時間冗餘資訊。
編碼格式：
封裝格式：儲存音視訊、圖片或者字幕資訊的一種容器
<audio>與<video>方法屬性
<audio>和<video>元素屬性
<audio>和<video>事件
<audio>和<video>缺點
- 不支援直接播放hls、flv等視訊格式
- 視訊資源的請求和載入無法通過程式碼控制口分段載入（節約流量）
- 清晰度無縫切換
- 精確預載入
媒體源擴充套件API（Media Source Extensions）
·無外掛在web端播放流媒體819
·支援播放hls、flv、mp4等格式視訊
·可實現視訊分段載入、清晰度無縫切換、自適應位元速率、精確預載入等
媒體源擴充套件API（Media Source Extensions）建立過程：
- 建立mediaSource例項
- 建立指向mediaSource的URL
- 監聽sourceopen事件
- 建立sourceBuffer
- 向sourceBuffer中加入資料
- 監聽updateend事件
MSE播放流程：
播放器播放流程：
常見流媒體協議：
HLS 全稱是HTTP Live Streaming，是一個由Apple公司提出的基於HTTP的媒體流傳輸協議，用於實時音視訊流的傳輸。目前HLS協議被廣泛的應用於視訊點播和直播領域。
應用場景：
點播，
直播，
圖片，
雲遊戲，
實時通訊，
視訊編輯。
新技術標準
·Webassembly
·WebCodecs
·WebGPU
·WebVR、WebXR