花椒前端基于WebAssembly 的H.265播放器研发

作者&投稿:辟视 (若有异议请与网页底部的电邮联系)
花椒直播以卓越的画质追求和低带宽需求为驱动力,深入研究HEVC(H.265)技术。作为H.264的革新者,H.265凭借其2倍压缩率的优越性,通过灵活的图像区块划分、丰富的帧预测模式以及提升的画质表现,成为了直播行业的首选。在这个过程中,直播解码的挑战尤为关键,硬解和软解之间抉择,libde265.js的Web端软解码性能不尽如人意,这就需要寻求更为高效的技术解决方案。

Chrome的多媒体播放器依托于Chromium项目,其中WebMediaPlayer、FFmpeg的解封装和解码能力举足轻重。FFmpeg以其跨平台的强大功能,成为Chrome中H.265解码的得力助手,尽管官方暂不支持H.265 over FLV/RTMP,但通过非官方扩展如金山视频云,FFmpeg得以在HTTP-FLV格式下支持H.265。WebAssembly(Wasm)的出现,作为一种低级语言,直接在浏览器中执行,避开了JavaScript繁琐的解析过程,使得FFmpeg在Web环境中的性能得以大幅提升,拥有更快的编译和运行速度,兼容多种高级语言编译。

花椒的H.265播放器研发策略巧妙地结合了Wasm、FFmpeg、Web Worker、WebGL和Web Audio API等前沿技术。Wasm负责接收和处理HTTP-FLV流,通过Transferable对象优化性能,将解码后的数据传递给JavaScript。FFmpeg则以其libavcodec和libavformat的编解码能力,以及libswscale的图像处理,确保视频数据的高效处理,即便在YUV4:2:0格式和不同的排列方式(如Planar或Packed)下也保持流畅。

为了优化性能,Canvas需要RGBA数据,但YUV转换成RGBA会带来性能损失,WebGL的介入则提供了加速渲染的可能。内存环缓存直播流,避免了内存和磁盘资源的过度消耗,而FFmpeg的自定义数据IO,通过AVIOContext支持内存数据源,进一步提升了效率。花椒团队针对Wasm进行了定制优化,减小体积,提升加载速度,最终实现了Web端H.265直播的稳定运行,内存占用保持在270M~320M,CPU占用率控制在40%~50%。

如果你对花椒的音视频技术团队感兴趣,无论是实习生还是音视频工程师,都需要具备VUE、node.js、HTML5等技能,以及对H.264/5编码标准和HLS/FLV协议的深入理解。有意者可通过lijingan@huajiao.tv投递简历,加入花椒的技术探索之旅。

花椒的技术力量,值得你来探索和见证。更多详情,请关注花椒技术公众号,与我们一起见证技术的创新与突破。

~

能在浏览器上执行的c程序被称为
答:称为WebAssembl。WebAssembly 为 C 在浏览器中执行其他语言提供了可能。WebAssembly 是除了 JavaScript 外,另一种可以运行在浏览器中的语言,它是一种低级的类汇编语言,可以接近原生的性能运行。