这是我参与「第四届青训营 」笔记创作活动的第10天
Web多媒体历史
其实说来，他的历史也比较短，也就二三十年。大致可以分为两个时代，一是以pc为主的时代，那时候浏览器是不支持视频和音频的，使用第三方插件来实现视频和音频。到了移动互联网时代，推出了HTML5新标准，有特定的标签可以用来播放音频和视频，但播放的类型也很有限，随后推出了Media Source Extentions，可以播放更多类型。
基础知识
1.编码格式
视频是由一幅幅图像组成，那我们来了解一下图像基本概念
- 图像分辨率：用于确定组成一幅图像的像素数据，就是旨在水平和垂直方向上图像所具有的像素个数
- 图像深度：图像深度是指储存每个像素所需要的比特数。图像深度决定了图像的每个像素可能的颜色数，或可能的灰度级数
视频基本概念
- 分辨率：每一帧的图像分辨率
- 帧率：视频单位时间内包含的视频帧的数量
- 码率：就是视频单位时间内传输的数据量，一般用kbps来表示，即千位每秒
Gop：两个I帧之间的间隔
为什么要编码：如果不压缩视频，占的内存空间太大。
编码数据流程
2.封装格式
编码完成之后，就需要封装，封装格式指的就是储存音视频、图片或者字幕信息的一种容器
3.多媒体元素和扩展API
<video>元素
<audio>和<video>元素缺陷
-
不支持直接播放hls，flv等视频格式
-
视频资源的请求和加载无法通过代码控制
分段加载（节约流量）
- 清晰度无缝切换
- 精确预加载
媒体源扩展API（Media Source Extentions）：
- 创建mediaSource实例
- 创建指向mediaSource的URL
- 监听sourceopen事件
- 创建sourceBuffer
- 向sourceBuffer中加入数据
- 监听updateend事件
播放器播放流程：
4.流媒体协议
应用场景
Web多媒体可应用于点播、直播、图片、云游戏、实时通信、视频编辑....
总结
通过本节的学习，了解了多媒体的来历及他的基本知识，多媒体应用很广泛，在生活中随处可见，在前端的学习中必不可少
