vivo 短视频用户访问体验优化实践
本文介绍了 vivo 短视频用户访问体验优化的实践思路,并简单讲解了实践背后的几点原理。
一、背景
我们平时在看抖音快手视频的时候,如果滑动到某个视频画面一直几 s 不动的时候,大概率就会划走了,所以在短视频项目中,画面卡顿是非常影响用户体验的,启播速度越快,就越能留住用户。
启播速度简单来说就是从调用开始播放到首帧上屏的时间,大致可分为两部分:…
记录-交流-Web开发知识分享
本文介绍了 vivo 短视频用户访问体验优化的实践思路,并简单讲解了实践背后的几点原理。
我们平时在看抖音快手视频的时候,如果滑动到某个视频画面一直几 s 不动的时候,大概率就会划走了,所以在短视频项目中,画面卡顿是非常影响用户体验的,启播速度越快,就越能留住用户。
启播速度简单来说就是从调用开始播放到首帧上屏的时间,大致可分为两部分:…
先科普一下profile&level。(这里讨论最常用的H264)
H.264有四种画质级别,分别是baseline, extended, main, high:
1、Baseline Profile:基本画质。支持I/P 帧,只支持无交错(Progressive)和CAVLC;
2、Extended profile:进阶画质。支持I/P/B/SP/SI 帧,只支持无交错(Progressive)和CAVLC;(用的少)
3、Main profile:主流画质。提供I/P/B 帧,支持无交错(Progressive)和交错(Interlaced), …
…
悄悄地,在支持页面上没有任何公告或更新的情况下,Google 修复了 Chrome 中的一个对视频流媒体行业具有重大影响的错误:终于启用了对 HEVC/H.265 视频内容的自适应流媒体的支持!
感谢 Bitmovin(Humble Brag,开个玩笑),我们在大约 6 年前提交了一份关于这件事的错误报告。经过“小”的等待,我们得到了 Chrome 104 现已正式支持的答案,并且经过一番调查还发现它默认为所有平台的 Chrome 105 启用,准备在野外使用。 …
最近需要搭建一个在线课堂的直播平台,考虑到清晰度和延迟性,我们一致认为使用 WebRTC 最合适。
原因有两点:首先是“点对点通信”非常吸引我们,不需要中间服务器,客户端直连,通信非常方便;再者是 WebRTC 浏览器原生支持,其他客户端支持也很好,不像传统直播用 flv.js 做兼容,可以实现标准统一。
然而令我非常尴尬的是,社区看了好几篇文章,理论架构写了一堆,但没一个能跑起来。WebRTC 里面概念很新也很多,理解它的通信流程
才是最关键,这点恰恰很少有描述。
于是我就自己捣鼓吧。捣鼓了几天,可算是整明白了。下面我结合自己的实践经验,按照我理解的关键步骤,带大家从应用场景的角度认识这个厉害的朋友 —— WebRTC
。…
现在最低建议720p视频的比特率以上,h.264编码,2M比特率合适;1080p就4M足够可以自己拿个高清视频,分别用不同码率转换,再对比画质。最普遍使用的是:h.264编码,1080P,2.5M比特率以上。总结:【h.264编码,比特率2.5M(最大要到4M就行了),最大比特率4M(在目标上加2M就行),大多平台都以是蓝光了。】
1、比特率高过原视频不会有一点高过原视频的。一搬都会选低点把文件压小点。2、1080P比特率1M有失真感电脑端观看,用2M看不出失真,可把比特率制调到4M最佳。以下是某平台比特率上传要求:
启动流媒体服务看起来很复杂,尤其是当您不熟悉为您的视频平台选择正确的编码器设置时。如果您是编码和流媒体领域的新手,那么广泛的选项会让您感到困惑,特别是 CBR 和 VBR 等术语。那么,什么是 CBR 和 VBR 编码?哪个更好——CBR 与 VBR?放松!喝杯咖啡,在接下来的几分钟内,您将得到所有问题的答案。…
Web 实时通信 (WebRTC) 既是一个开源项目,也是一个规范,它支持实时媒体通信,如语音、视频和数据在浏览器和设备之间的本地传输。这使用户无需复杂的插件或额外的硬件就可以在他们的主要 Web 浏览器中进行通信。
WebRTC 项目于 2011 年 5 月由 Google 首次宣布,作为开发一套通用协议的一种手段,用于在浏览器、移动平台和物联网设备中启用高质量的 RTC 应用程序。当时,Flash 和插件是提供实时通信的唯一方法。两年后,经过大量工作,Chrome 和 Firefox 之间建立了第一个跨浏览器视频通话。随着越来越多的组织增加对规范的支持,开发者社区对 WebRTC 的支持也随之飙升。今天,WebRTC 在 Chrome、Firefox、Safari、Edge、Android 和 iOS 中本地(不同程度地)可用,并且是一种广受欢迎的视频通话工具。…
Web 平台已经允许 Web 应用程序捕获当前选项卡的视频轨道。它现在附带 Region Capture,这是一种裁剪这些视频轨道的机制。Web 应用程序将当前选项卡的一部分指定为其感兴趣的区域,并且浏览器会裁剪该区域之外的所有像素。
Web 应用程序以前可以“手动”裁剪视频轨道。也就是说,Web 应用程序可以直接操作每一帧。这既不稳健也不高效。区域捕获解决了这些缺点。Web 应用程序现在可以指示浏览器代表它完成工作。…
近期评论