这是我参与「第四届青训营 」笔记创作活动的的第3天
一、本堂课重点内容：
- web多媒体历史介绍
- 基础知识
- 应用场景
- 一些新的技术标准
二、详细知识点介绍：
web多媒体历史介绍
- 第三方插件：如flash
- H5：原生支持
- MSE
基础知识
编码格式
图像
- 图像分辨率：图像平面上具有的像素格式
- 图像深度：图像中表示每个像素点所需要的比特数
视频
- 帧：组成视频的基本单位，1帧就是1张图像
- 分辨率：每帧的图像分辨率
- 帧率：视频单位时间内包含的视频帧的数量
- 码率：就是指视频单位时间内传输的数据量，一般我们用kbps来表示，即千位每秒
- I帧：可以直接解码
- P帧：前向预测编码帧，解码依赖前面帧
- B帧：双向预测编码帧，解码依赖前后帧
- GOP：两个I帧之间的帧集合，每个GOP的第一帧为关键帧，不依赖于GOP内其他帧
编码
为什么编码
节省空间，便于传输
- 时间冗余
- 空间冗余
- 编码冗余
- 视觉冗余
常见编码格式：
封装格式
为什么封装
原生视频只有连续的图片帧，难以使用，封装就是将视频，音频以及字幕等信息封装在一起
封装格式就是存储音视频、图片或者字幕信息的一种容器
常见封装格式
多媒体元素和扩展API
多媒体标签：<audio>，<video>
缺陷：
- 不支持直接播放hls、flv等视频格式
- 视频资源的请求和加载无法通过代码控制
-
- 分段加载（节约流量）
-
- 清晰度无缝切换
-
- 精确预加载
媒体源扩展API (Media Source Extensions)
优点：
- 无插件在web端播放流媒体
- 支持播放hls、flv、mp4等格式视频
- 可实现视频分段加载、清晰度无缝切换、自适应码率、精确预加载等
流媒体协议
应用场景
一些新的技术标准
三、实践练习例子：
多媒体标签效果
四、课后个人总结：
了解了web中主要涉及的多媒体元素，常涉及到的是图像和视频，了解了他们的基本组成，以及在实际传输中编码的原因和方式，以及常见的封装格式。还学习了几种基本的多媒体标签，以及拓展API。之前在计算机网络课程中，从协议以及数据传输的角度了解了几种常见的流媒体，这次从实际开发的角度进一步加深了对多媒体的理解。
