Web多媒体入门|青训营笔记

196 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第五天

一:基础知识

编码格式

图像基本概念

图像分辨率:用于确定组成一副图像的像素数据,就是指在水平和垂直方向上图像所具有的像素个数。

图像深度:图像深度是指存储每个像素所需要的比特数。图像深度决定了图像
的每个像素可能的颜色数,或可能的灰度级数。例如,彩色图像每个像素用
R,G,B三个分量表示,每个分量用8位,像素深度为24位,可以表示的颜色数目为
2的24次方,既16777216个;一副单色图像存储每个像素需要8bit,则图像的
像素深度为8位,最大灰度数目为2的8次方,既256个。

视频基本概念

分辨率:每一帧的图像分辨率

帧率:视频单位时间内包含的视频帧的数量

码率:就是指视频单位时间内传输的数据量,一般我们用kbps来表示,即千位每秒。

存在哪些冗余问题

空间冗余

时间冗余

编码冗余

视觉冗余

编码数据处理流程

预测==>变化==>量化==>熵编码

封装格式

存储音视频、图片或者字幕信息的一种容器。

多媒体元素和扩展API

video元素

image.png

audio元素

image.png

媒体源扩展API

  • 无插件在Web端播放媒体流
  • 支持播放hls、flv、mp4等格式视频
  • 可实现视频分段加载、清晰度无缝切换、自适应码率、精准预加载等

流媒体协议

HLS全称是HTTP Live Streaming,是一个由Apple公司提出的基于HTTP的媒体流传输协议,用于实时音视频流的传输。目前HLS协议被广泛的应用于视频点播和直播领域。

image.png

二:应用场景

HA7%ASY~FL%{WS47FRSA%0R.png

三:总结与展望

总结

  • flash、H5 video、MSE
  • 编码格式、封装格式、多媒体元素、流媒体协议
  • 应用场景

新技术标准

  • Webassembly
  • WebCodecs
  • WebGPU
  • WebVR、WebXR