MPEG-DASH在bilibili的应用与实践

2019 年 4 月 29 日 前端之巅

导读:MPEG-DASH 是首个基于 HTTP 的自适应比特率流解决方案,它也是一项国际标准。MPEG-DASH 播放器可以无缝适应不断变化的用户网络或者缓冲区大小并提供高质量的播放体验,减少卡顿率。
2018 年下半年,bilibili (简称 B 站)将其全量引入。为了解 MPEG-DASH 在实际场景中的表现情况,我们采访了 bilibili 资深前端工程师丁建强,他将在  QCon 北京 2019为大家带来 MPEG-DASH 相关知识及 Web MPEG-DASH 播放器实践优化及未来展望,更多信息请点击阅读原文查看。
作者 | Clara Deng
编辑 | Clara Deng

MPEG-DASH 是一种在 MPEG 下开发的自适应比特率串流技术,使高质量流媒体可以通过传统的 HTTP 网络服务器以互联网传递。它于 2011 年 11 月成为国际标准。

MPEG-DASH 播放器可以无缝适应不断变化的用户网络或者缓冲区大小并提供高质量的播放体验,减少卡顿率。目前,YouTube、Netflix 和 Hulu 等公司都将 MPEG-DASH 作为他们 HTML5 的核心流媒体技术。

在使用 MPEG-DASH 新技术这一点上,bilibili 走在了国内主流流媒体网站的前列。2017 年下半年,bilibili 开始准备 MPEG-DASH 新技术的调研及可行性分析等工作,并于 2018 年 9 月将其全量。全量之后,UP 主投稿的新视频都将支持 MPEG-DASH 播放器播放。

根据 bilibili 的实践经验,他们在使用 MPEG-DASH 之后,播放卡顿率对比 HTTP-FLV 有大幅降低。近日,我们采访了 bilibili 资深前端工程师丁建强,带你了解更多 MPEG-DASH 的落地情况。

 请您介绍一下自己的工作经历,目前在 bilibili 的工作职责以及所负责的项目。

丁建强: 我在 2015 年毕业于浙江海洋大学的计算机科学与技术专业之后,加入了一家初创型创业公司。

工作半年左右之后,受限于初创型创业公司规模及技术相关,我开始寻找更大的平台。

于是,2016 年,我加入了 bilibili,之后一直从事 Web & H5 播放器方面的工作。目前我的主要工作职责分为 3 块:负责 Web & H5 播放器项目,主要承担核心研发并带领直播 Web 播放器小组的同学进行迭代开发、技术升级、性能优化等;主导 Web 播放器内核的研发(MPEG-DASH),主要是技术迭代、性能优化、用户体验优化、拓展性研究等;参与 Web 播放器平台化支持、组件支持等。

 老师现在主要负责直播 Web 播放器项目,可以从技术层面给我们讲讲直播 HTML5 播放器的原理吗?

丁建强: 在直播 HTML5 播放器开发之前,我们 B 站一直使用的是 Flash 播放器播放 HTTP-FLV 直播流。而 HTTP-FLV 直播流并无法直接在 HTML5 Video 元素上原生支持,所以我们将 FLV 直播流实时解码之后再编码至 fMP4,同时使用 MSE ( Media Source Extension ) 进行管理及操作。这样就可以实现 HTML5 Video 元素上播放我们的直播流。

 我们了解到,bilibili 的 Web 端视频播放同时支持 HTML5 播放器和 Flash 播放器。但是此前 Adobe 宣布将于 2020 年停止开发和更新 Flash,您怎么看待 Flash 的逐步淘汰?bilibili 以后还会不会继续支持 Flash 播放器?

丁建强:Flash 的淘汰也算是大势所趋,谁又能想到当时如日中天的 Flash 也将退出历史舞台。目前已经有浏览器开始默认不开启 Flash 插件了,这意味着浏览器开始在引导用户慢慢不使用 Flash。

而我们 bilibili 的用户在 Web 端视频观看上,大部分使用了 HTML5 播放器,Flash 用户不多,但是我们目前肯定还会继续对那部分 Flash 播放器用户负责。

因为 HTML5 播放器的用户观看体验优于 Flash 播放器,也更加的面向未来的更新与拓展。

 在点直播中,bilibili 之前一直使用的是 HTTP-FLV,与其他协议相比,表现如何? 是否有引入新协议的计划?

丁建强:HTTP-FLV 协议在 B 站应用是相对比较成熟的,无论是在点播还是直播中。但是对于我们需要深度优化的用户观看体验上,现有的 HTTP-FLV 解决方案相对有所欠缺。例如无法自适应码率 (ABR)、不能无缝切换、卡顿率较高之类相关等等。

因此我们对比了目前主流流媒体相关协议及解决方案,主要考虑的是 HLS 和 MPEG-DASH 。HLS 是一个由苹果公司提出的基于 HTTP 的流媒体网络传输协议,目前主流支持 ABR 的流媒体播放器大部分都是基于 HLS 协议。MPEG-DASH 则相对比较小众,但是与 HLS 相比则更具拓展性和开放性优势。MPEG-DASH 相比 HLS 优势之一就是不关心具体编码器,支持现有及未来可能使用的编码格式。同时,MPEG-DASH 也能支持更高的码率,例如 4k、8k 等等。所以从那时开始,我们就开始了准备引入 MPEG-DASH 作为新技术的计划。

 去年 8 月份,bilibili 对外表示正在开发 MPEG-DASH 项目,可以介绍一下这个技术吗?

丁建强:MPEG-DASH 在 MPEG ( Moving Picture Experts Group )之下开发。2011 年 1 月,它成为一项国际标准草案,并在 2011 年 11 月成为国际标准。MPEG-DASH 标准已于 2012 年 4 月发布为 ISO/IEC 23009-1:2012。

MPEG-DASH 中的 DASH 全称是 “Dynamic Adaptive Streaming over HTTP”,是一种自适应比特率串流技术,使高质量流媒体可以通过传统的 HTTP 网络服务器以互联网传递。MPEG-DASH 对比我们现有使用的 HTTP-FLV 有较多优势,例如 MPEG-DASH 会通过 Media Presentation Description (MPD) 将视频内容切片成一个很短的文件片段,每个切片都有多个不同的码率,DASH 播放器可以根据网络的情况选择一个码率进行播放,以及支持在不同码率之间无缝切换。

而我们上面提到的 MPD 文件是用来描述整个 MPEG-DASH 码流的构成的描述文件(XML 格式)。通过 MPD 文件,播放器可以获取到完整的流媒体的下载地址等信息。一个完整的 MPD 文件中,可能包含一个或多个 Period,每个 Period 包含某一时间段信息。例如某个视频有 60s,其中分为了 2 个 Period, Period 1 是包含 0 ~ 30s 的信息, Period 2 是包含 30s ~ 60s 的信息。而一个 Period 中,又可能包含着一个或多个 AdaptationSet,每个 AdaptationSet 代表不同类型的信息,例如视频 AdaptationSet, 音频 AdaptationSet 等等。 一个 AdaptationSet 有一组可供切换的不同码率的码流组成 (Representation),例如 100kb, 200kb 等等。最后单个 Representation 包含了具体码流中的各个片段信息等。

播放器会解析 MPD 文件中的信息来进行音视频片段的下载、播放及无缝切换等等。

目前,DASH Industry Forum (DASH-IF) 作为由发起厂家组成行业论坛,正致力于推进 DASH 相关产品生态,将 DASH 产业化和业界最佳实践推向批量应用。MPEG-DASH 是一项面向未来的流媒体解决方案。

 那么,bilibili 是什么时候注意到 MPEG-DASH 的?它在国内外有哪些比较成功的落地经验?从前期调研,到项目落地,中间持续了多久的时间?现在项目进行到哪一步了?未来是否会全面取代 HTTP-FLV ?

丁建强: 我们从 2017 年下半年已经开始准备 MPEG-DASH 新技术的调研及可行性分析等。当时在国外主流流媒体网站已有较为成熟的落地实践经验,例如 YouTube,Netflix 等等。

然后从正式立项开始到项目落地,期间差不多 2-3 个月时间,并且于去年 2018 年 9 月全量。全量之后投稿的新视频都将支持 MPEG-DASH 播放器播放。同时我们也走在了国内主流流媒体网站使用 MPEG-DASH 新技术的的前列。

目前 MPEG-DASH 项目已经处于稳步迭代的状态中,我们也将持续致力于用户体验的优化。同时也会积极拓展 MPEG-DASH 在 bilibili 的应用及更多实践。对于无论是 HTML5 还是 Flash 播放器的用户,我们都将会一如既往的支持。

 与 HTTP-FLV 相比,使用 MPEG-DASH 之后,用户体验是否有较为明显的提升?可以透露一些关键数据吗?

丁建强: 我们引入新技术的首要前提就是对现有的用户体验有所提升。

首先,在直观感受上看来,用户在切换清晰度时不再会看到视频画面因切换引起的的卡顿。

其次,经过我们多个迭代的调优,相比过去 MPEG-DASH 在卡顿率方面有了大幅的优化,一方面是 MPEG-DASH 本身技术上的优势,另一方面是我们针对用户的观看行为进行了多套策略的调优。

引入 MPEG-DASH 之后,无论直观体验或细节体验,用户体验都有明显提升。当然,我们也会一直致力于为用户带来更优质的用户体验。

如果想知道更多关于 MPEG-DASH 的内容,可以了解一下我在 QCon 北京 2019 的演讲《MPEG-DASH - 面向未来的流媒体解决方案》。

受访嘉宾:

丁建强(Tuzkiss),现任 bilibili 资深前端工程师,2016 年加入 bilibili 之后一直从事 Web & H5 播放器方面工作。目前主要负责直播 Web & H5 播放器项目、播放器内核研发、播放器平台化支持、播放器性能优化和用户体验优化等。

5 月 6-8 日,Tuzkiss 将在 QCon 北京 2019 “前端前沿技术”专题为你详解前端主流流媒体解决方案及痛点以及 MPEG-DASH 播放器实践与优化(Web)。他的演讲题目是《MPEG-DASH - 面向未来的流媒体解决方案》。

本届大会,“前端前沿技术”专题由百度资深研发工程师陶清乾担任出品人,还邀请了 Intel、百度、阿里的资深前端为我们带来 PWAs、语音交互编程语言 VSL、Serverless 等前沿方向的话题分享。此外,还有由前端大神 winter (程劭非)担任出品人的“前端工程实践”专题,将聚焦前端智能化、面向数据、Electron、AST、Service Worker、通用 MIS 平台打造和在 3D 图形场景下的前端开发等实践案例。

更多精彩内容请点击 「 阅读原文 」或识别二维码查看。大会报名最后一周,团购可享折扣优惠!席位有限,马上联系票务小姐姐 Ring 吧!电话:13269076283 微信:qcon-0410

登录查看更多
5

相关内容

MPEG 是“动态图像专家组”(Moving Picture Experts Group)的简称。成立于1988年,致力开发视频、音频的压缩编码技术。
【大数据白皮书 2019】中国信息通信研究院
专知会员服务
137+阅读 · 2019年12月12日
资源|Blockchain区块链中文资源阅读列表
专知会员服务
43+阅读 · 2019年11月20日
【白皮书】“物联网+区块链”应用与发展白皮书-2019
专知会员服务
93+阅读 · 2019年11月13日
阿里巴巴全球化架构设计挑战
InfoQ
35+阅读 · 2019年11月25日
网易游戏海外AWS实践分享
高效开发运维
3+阅读 · 2019年5月21日
工行基于MySQL构建分布式架构的转型之路
炼数成金订阅号
15+阅读 · 2019年5月16日
浅谈 Kubernetes 在生产环境中的架构
DevOps时代
11+阅读 · 2019年5月8日
硬核实践经验 - 企鹅辅导 RN 迁移及优化总结
IMWeb前端社区
5+阅读 · 2019年5月6日
蚂蚁金服微服务实践(附演讲PPT)
开源中国
18+阅读 · 2018年12月21日
手把手教你搭建智能客服系统
InfoQ
13+阅读 · 2018年4月3日
今日头条推荐系统架构演进之路
QCon
32+阅读 · 2017年6月21日
Arxiv
4+阅读 · 2018年5月21日
Arxiv
6+阅读 · 2018年4月21日
VIP会员
相关资讯
阿里巴巴全球化架构设计挑战
InfoQ
35+阅读 · 2019年11月25日
网易游戏海外AWS实践分享
高效开发运维
3+阅读 · 2019年5月21日
工行基于MySQL构建分布式架构的转型之路
炼数成金订阅号
15+阅读 · 2019年5月16日
浅谈 Kubernetes 在生产环境中的架构
DevOps时代
11+阅读 · 2019年5月8日
硬核实践经验 - 企鹅辅导 RN 迁移及优化总结
IMWeb前端社区
5+阅读 · 2019年5月6日
蚂蚁金服微服务实践(附演讲PPT)
开源中国
18+阅读 · 2018年12月21日
手把手教你搭建智能客服系统
InfoQ
13+阅读 · 2018年4月3日
今日头条推荐系统架构演进之路
QCon
32+阅读 · 2017年6月21日
Top
微信扫码咨询专知VIP会员