第042期:OffScreen、WebCodecs、WebTransport的花火碰撞

广告位招租
扫码页面底部二维码联系

Hello,这里是FM Robust,本期是第42,欢迎收听,本期的话题将向你介绍一些相对【作者:唐霜】【作者:唐霜】偏门的Web接口,以及把它们组合使用的一些奇思妙想。

【版权所有,侵权必究】【关注微信公众号:wwwtangshua著作权归作者所有,禁止商业用途转载。【关注微信公众号:wwwtangshuangnet】ngnet】【未经授权禁止转载】

在线播放

【本文受版权保护】【访问 www.tangshuang.n【原创内容,转载请注明出处】本文作者:唐霜,转载请注明出处。et 获取更多精彩内容】【版权所有,侵权必究】【关注微信公众号:wwwtangshua本文作者:唐霜,转载请注明出处。未经授权,禁止复制转载。ngnet】

原创内容,盗版必究。本文版权归作者所有,未经授权不得转载。【关注微信公众号:wwwtangshua【关注微信公众号:wwwtangshuangnet】原创内容,盗版必究。ngnet】

在节目开始之前,我想先自我推广一下,Ro【转载请注明来源】本文作者:唐霜,转载请注明出处。bust已经做了40多期,在不同的平台上获得了非常不错的收听率,【版权所有,侵权必究】【原创内容,转载请注明出处】前几天小宇宙app给我推了订阅数跨过3000的通知,没想到我一个自说自话的声音节目能受到那本文版权归作者所有,未经授权不得转载。【原创不易,请尊重版权】么多人的欢迎,受宠若惊的同时,感谢你的支未经授权,禁止复制转载。【作者:唐霜】持,希望今后可以贡献更多的优质内容。

【本文首发于唐霜的博客】著作权归作者所有,禁止商业用途转载。本文版权归作者所有,未经授权不得转载。

你可以在喜马拉雅、苹果的Podcast、转载请注明出处:www.tangshuang.net著作权归作者所有,禁止商业用途转载。小宇宙app等平台上收听Robust,同转载请注明出处:www.tangshuang.net原创内容,盗版必究。时,你也可以关注我的个人微信公众号 wwwtangshuangnet 与我未经授权,禁止复制转载。【原创不易,请尊重版权】私下交流,收藏我的博客 www.tangshuang.net ,节目的文字版都会发布在我的博客中。另【未经授权禁止转载】【本文受版权保护】外,你还可以在哔哩哔哩中搜索“否子戈”关【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net注我,我会时不时发一些技术视频。

【本文受版权保护】【关注微信公众号:wwwtangshua【原创内容,转载请注明出处】本文作者:唐霜,转载请注明出处。ngnet】

如果你觉得本期的内容不错,可以对我进行捐【版权所有,侵权必究】【未经授权禁止转载】赠,在关注我的公众号 wwwtangshuangnet 之后,随便找一篇付费文章付费后阅读即可。

【转载请注明来源】【版权所有】唐霜 www.tangshu【关注微信公众号:wwwtangshuangnet】【转载请注明来源】ang.net本文作者:唐霜,转载请注明出处。原创内容,盗版必究。

好了,回到我们本期的主题。

【关注微信公众号:wwwtangshua【版权所有】唐霜 www.tangshuang.net原创内容,盗版必究。ngnet】本文版权归作者所有,未经授权不得转载。本文作者:唐霜,转载请注明出处。

首先,让我们先介绍一下今天的三位主角。

【关注微信公众号:wwwtangshua【关注微信公众号:wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】ngnet】【版权所有】唐霜 www.tangshu【版权所有】唐霜 www.tangshuang.net本文作者:唐霜,转载请注明出处。ang.net著作权归作者所有,禁止商业用途转载。

OffScreen即离屏渲染,顾名思义,【访问 www.tangshuang.net 获取更多精彩内容】原创内容,盗版必究。就是浏览器在我们肉眼可见的窗口之外,提供【版权所有,侵权必究】【转载请注明来源】了渲染能力。我们做前端往往只会称服务端为【未经授权禁止转载】未经授权,禁止复制转载。后台,实际上,在前端本身也存在后台,而O【关注微信公众号:wwwtangshuangnet】著作权归作者所有,禁止商业用途转载。ffScreen就是在后台完成,而非前台【原创内容,转载请注明出处】转载请注明出处:www.tangshuang.net完成,因此,这里的离屏渲染,不是说把元素【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】通过位置移动移出可视区域,而是在浏览器后转载请注明出处:www.tangshuang.net转载请注明出处:www.tangshuang.net台提供了一个非可视化的渲染模块中完成渲染本文作者:唐霜,转载请注明出处。【原创不易,请尊重版权】

著作权归作者所有,禁止商业用途转载。【原创不易,请尊重版权】未经授权,禁止复制转载。

我们知道,浏览器本身作为最顶层的应用程序转载请注明出处:www.tangshuang.net原创内容,盗版必究。,能够将页面能容渲染到显示器上,需要经过【版权所有,侵权必究】本文版权归作者所有,未经授权不得转载。“内核计算->缓冲->光栅化->输出到显示器”的过程,而离屏渲染则是只有前面两步,把要用于渲【本文首发于唐霜的博客】本文版权归作者所有,未经授权不得转载。染的计算结果放到缓冲区后,就结束了,其他本文作者:唐霜,转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】程序可以读取缓冲区内容后自己处理,可以用本文作者:唐霜,转载请注明出处。【本文首发于唐霜的博客】来进行下一步的展示,也可以不展示。

【版权所有】唐霜 www.tangshu【作者:唐霜】本文版权归作者所有,未经授权不得转载。ang.net【版权所有】唐霜 www.tangshu【未经授权禁止转载】【关注微信公众号:wwwtangshuangnet】ang.net

在浏览器中提供了OffscreenCanvas这【本文受版权保护】【版权所有】唐霜 www.tangshuang.net个接口作为离屏渲染的载体,你可以创建一个OffscreenCanvas对象,对它进行操作。非常有意思的是,在web原创内容,盗版必究。【原创不易,请尊重版权】worker中同样支持该接口,这也就意味本文版权归作者所有,未经授权不得转载。未经授权,禁止复制转载。着,我们可以在非网页的主线程中,完成渲染【关注微信公众号:wwwtangshuangnet】【作者:唐霜】工作。这是以前想都不敢想的操作。

本文作者:唐霜,转载请注明出处。【作者:唐霜】【原创内容,转载请注明出处】

相信很多同学都做过一个需求,就是把当前页未经授权,禁止复制转载。未经授权,禁止复制转载。面或其中的某个区域作为截图,让用户可以保未经授权,禁止复制转载。著作权归作者所有,禁止商业用途转载。存到自己电脑或手机上。我们经常会用到一个未经授权,禁止复制转载。本文作者:唐霜,转载请注明出处。库,即html2canvas,这个库的原理是读取当前DOM解构和Co【未经授权禁止转载】【关注微信公众号:wwwtangshuangnet】mputedStyle,按照一定的规则绘本文作者:唐霜,转载请注明出处。本文版权归作者所有,未经授权不得转载。制到一个canvas中,如果我们需要保存【原创内容,转载请注明出处】著作权归作者所有,禁止商业用途转载。,可以把这个canvas导出为一张图片,【关注微信公众号:wwwtangshuangnet】著作权归作者所有,禁止商业用途转载。在通过a标签的download属性实现下载。这个过程中的核心关键,就是需要有一个c【访问 www.tangshuang.net 获取更多精彩内容】未经授权,禁止复制转载。anvas来绘制。而现在这个过程是全部在【关注微信公众号:wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net主线程中完成的,并且我们会创建一个can原创内容,盗版必究。【原创内容,转载请注明出处】vas标签来获得其上下文,这也就意味着上【未经授权禁止转载】【作者:唐霜】面提到的整个渲染过程都会被执行,那么浏览【版权所有】唐霜 www.tangshuang.net本文作者:唐霜,转载请注明出处。器就会花费不少资源在这个事情上,降低页面著作权归作者所有,禁止商业用途转载。【版权所有,侵权必究】的运行性能。而如果我们使用离屏渲染,用OffscreenCanvas来绘制,此时浏览器不会真的把绘制效果渲染出来,【版权所有,侵权必究】【关注微信公众号:wwwtangshuangnet】而只是缓冲了绘制的计算结果,那么就可以减著作权归作者所有,禁止商业用途转载。【版权所有,侵权必究】少光栅化和输出的过程。我们再进一步,我们【本文受版权保护】本文作者:唐霜,转载请注明出处。把读取到的DOM和样式发送到一个webw本文版权归作者所有,未经授权不得转载。原创内容,盗版必究。orker中,在这个worker中使用O【转载请注明来源】本文作者:唐霜,转载请注明出处。ffscreenCanvas进行绘制和图【本文受版权保护】【版权所有】唐霜 www.tangshuang.net片生成,这样连计算过程都不在主线程执行,原创内容,盗版必究。【版权所有,侵权必究】对主线程几乎没有任何影响。

【转载请注明来源】原创内容,盗版必究。转载请注明出处:www.tangshua本文作者:唐霜,转载请注明出处。原创内容,盗版必究。ng.net【未经授权禁止转载】

不过离屏渲染也存在一些不足的地方,并非所著作权归作者所有,禁止商业用途转载。本文作者:唐霜,转载请注明出处。有场景使用都能得到很好的性能提升效果。它【本文受版权保护】未经授权,禁止复制转载。主要有两点问题,1. 开辟新的缓冲区会占用大块内存2. 从一个缓冲区搬运数据到另外一个缓冲区,这个过程比线程间通信的效率还要低。因此本文版权归作者所有,未经授权不得转载。【本文受版权保护】,那些需要实时响应用户的渲染,不可以使用原创内容,盗版必究。【未经授权禁止转载】离屏渲染,例如canvas游戏、图表预览【作者:唐霜】【转载请注明来源】等等,只有那种作为候选结果的可以放在离屏【作者:唐霜】【版权所有,侵权必究】渲染,比如作为预加载,或者如上面所说的不原创内容,盗版必究。【本文首发于唐霜的博客】需要立即渲染出来,用户可以等待的场景。

【原创内容,转载请注明出处】著作权归作者所有,禁止商业用途转载。【原创内容,转载请注明出处】【原创内容,转载请注明出处】

第二位主角是WebCodecs

【访问 www.tangshuang.n【原创内容,转载请注明出处】【转载请注明来源】et 获取更多精彩内容】著作权归作者所有,禁止商业用途转载。转载请注明出处:www.tangshua【作者:唐霜】本文版权归作者所有,未经授权不得转载。ng.net

许多 Web API 在内部都使用了媒体编码器。例如,Web Audio API,以及 WebRTC API。然而,这些 API 不允许开发者处理视频流的单个帧和未合成的【版权所有,侵权必究】【本文首发于唐霜的博客】编码音频块或视频块。

【原创内容,转载请注明出处】【版权所有】唐霜 www.tangshu【关注微信公众号:wwwtangshuangnet】转载请注明出处:www.tangshuang.netang.net

视频领域,我们有非常多的视频格式,例如A【原创不易,请尊重版权】【原创不易,请尊重版权】VI、MPEG、QuickTime File Format、WMV等等。视频格式,决定了该视频文件转载请注明出处:www.tangshuang.net【未经授权禁止转载】内部的存储结构,因此,想要播放对应格式的原创内容,盗版必究。转载请注明出处:www.tangshuang.net视频文件,必须使用能够阅读该存储结构的播【版权所有】唐霜 www.tangshuang.net【作者:唐霜】放器。

【版权所有】唐霜 www.tangshu转载请注明出处:www.tangshuang.net【转载请注明来源】ang.net著作权归作者所有,禁止商业用途转载。【作者:唐霜】本文作者:唐霜,转载请注明出处。

视频编码,是指对视频原始数据进行压缩处理【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】。我们知道,视频是由一帧一帧的画面和声音转载请注明出处:www.tangshuang.net【原创内容,转载请注明出处】组成,而视频编码的工作,就是对这些画面和【版权所有,侵权必究】【作者:唐霜】声音进行压缩、去重、优化,使得视频文件既【访问 www.tangshuang.net 获取更多精彩内容】未经授权,禁止复制转载。可以播放又方便传输。常见的视频编码方式有原创内容,盗版必究。转载请注明出处:www.tangshuang.netH.26X系列,例如H.261, H.263等等,MPEG系列,例如常见的MPEG-4,还有其他很多视频编码方式。

【本文首发于唐霜的博客】【访问 www.tangshuang.n【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】et 获取更多精彩内容】【转载请注明来源】【本文受版权保护】

一个视频的原始数据进行视频编码之后,可以本文版权归作者所有,未经授权不得转载。【版权所有,侵权必究】再用不同的视频格式进行封装,封装好之后就本文版权归作者所有,未经授权不得转载。【原创内容,转载请注明出处】可以用来传输了。当然,不同的视频格式可能【未经授权禁止转载】【原创不易,请尊重版权】只支持其中少数的视频编码方式,有些视频编本文作者:唐霜,转载请注明出处。本文版权归作者所有,未经授权不得转载。码后无法封装为一些视频格式。视频编码是视【版权所有,侵权必究】【本文首发于唐霜的博客】频文件的本质,视频格式是该文件的表现形式未经授权,禁止复制转载。【作者:唐霜】。另外,不同的编码方式会导致不同程度的失【转载请注明来源】【转载请注明来源】真,因为目的不同,压缩和优化时去掉的细节原创内容,盗版必究。本文作者:唐霜,转载请注明出处。多少也就不同。

【版权所有】唐霜 www.tangshu【原创内容,转载请注明出处】本文版权归作者所有,未经授权不得转载。ang.net【本文受版权保护】

视频解码则是对视频编码的反向操作。视频编未经授权,禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】码是对原始视频数据的压缩、画面去重、优化【访问 www.tangshuang.net 获取更多精彩内容】【作者:唐霜】等,而解码则是按照该视频编码的规则,使经本文版权归作者所有,未经授权不得转载。本文版权归作者所有,未经授权不得转载。过编码后的数据可以还原出视频本身用于播放【本文首发于唐霜的博客】【版权所有,侵权必究】。简单讲,经过视频编码后,文件内的数据就本文版权归作者所有,未经授权不得转载。原创内容,盗版必究。是一团乱序的数据,而非连续的视频帧,是无著作权归作者所有,禁止商业用途转载。【版权所有,侵权必究】法直接用来播放的,而解码则是还原其为一帧【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net一帧的视频数据,因此,如果我们想从一个视【作者:唐霜】【访问 www.tangshuang.net 获取更多精彩内容】频文件中读取其中某一帧的画面,必须先进行【版权所有】唐霜 www.tangshuang.net【版权所有,侵权必究】解码,得到连续帧的视频数据之后才能读取到著作权归作者所有,禁止商业用途转载。【本文受版权保护】

【转载请注明来源】【关注微信公众号:wwwtangshua原创内容,盗版必究。【原创不易,请尊重版权】ngnet】【版权所有】唐霜 www.tangshu原创内容,盗版必究。本文作者:唐霜,转载请注明出处。ang.net【作者:唐霜】

Web 开发者通常使用 WebAssembly 来绕过这一限制,例如将FFmpeg编译为wasm使用,并且在浏览器中使用媒体编解码器。然而,【原创不易,请尊重版权】【原创内容,转载请注明出处】这需要额外的带宽来下载浏览器中已经存在的【本文首发于唐霜的博客】【原创不易,请尊重版权】编解码器,降低了性能和能效,并增加了额外【本文受版权保护】原创内容,盗版必究。的开发成本。

【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshu本文版权归作者所有,未经授权不得转载。【本文首发于唐霜的博客】ang.net本文版权归作者所有,未经授权不得转载。原创内容,盗版必究。

WebCodecs API 提供了对浏览转载请注明出处:www.tangshuang.net【关注微信公众号:wwwtangshuangnet】器中已存在的编解码器的访问能力。它可以访著作权归作者所有,禁止商业用途转载。未经授权,禁止复制转载。问原始视频帧、音频数据块、图像解码器、音未经授权,禁止复制转载。转载请注明出处:www.tangshuang.net频和视频的编码器及解码器。

本文版权归作者所有,未经授权不得转载。【访问 www.tangshuang.n【本文首发于唐霜的博客】【本文受版权保护】et 获取更多精彩内容】

举些简单的场景,我们在视频播放时,把鼠标移到进度条上,【转载请注明来源】【原创不易,请尊重版权】部分播放器会把鼠标位置对应的视频截图展示未经授权,禁止复制转载。【本文首发于唐霜的博客】出来。再比如,我们把视频上传后需要选取一【原创不易,请尊重版权】本文作者:唐霜,转载请注明出处。张视频封面。在比如我们需要把人物从弹幕下著作权归作者所有,禁止商业用途转载。【关注微信公众号:wwwtangshuangnet】方浮到弹幕上方。比如我们需要对准备上传的【本文首发于唐霜的博客】著作权归作者所有,禁止商业用途转载。视频或音频中是否包含了敏感信息进行提前检本文版权归作者所有,未经授权不得转载。【原创不易,请尊重版权】查。

转载请注明出处:www.tangshua【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.netng.net【未经授权禁止转载】原创内容,盗版必究。

这些场景都是我们常见的。以前,要么我们把【本文受版权保护】本文版权归作者所有,未经授权不得转载。这些活放在后端做,然后把处理好的素材发送【作者:唐霜】【作者:唐霜】给前端;要么,我们需要自己写解码编码器,【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net或者通过wasm加载用c/c++写好的编码解码模块。这无疑大大增加了开发成本和运行效率。而WebCodecs直接提供了编码解码的能力,这也就意味着,我们不需要自己再去写解码【原创不易,请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】器,而是直接调用浏览器的接口即可实现上述【关注微信公众号:wwwtangshuangnet】著作权归作者所有,禁止商业用途转载。能力。

未经授权,禁止复制转载。【访问 www.tangshuang.n原创内容,盗版必究。未经授权,禁止复制转载。et 获取更多精彩内容】原创内容,盗版必究。转载请注明出处:www.tangshua本文作者:唐霜,转载请注明出处。【未经授权禁止转载】ng.net

同时,我们还可以发挥一些创意,比如自己写转载请注明出处:www.tangshuang.net本文版权归作者所有,未经授权不得转载。一个视频剪辑工具,或者基于AI的视频创作【原创内容,转载请注明出处】转载请注明出处:www.tangshuang.net工具,而无需掌握各种私有编码器的API。

本文作者:唐霜,转载请注明出处。【版权所有,侵权必究】【关注微信公众号:wwwtangshua本文版权归作者所有,未经授权不得转载。【作者:唐霜】ngnet】

第三位主角是WebTransport

【未经授权禁止转载】转载请注明出处:www.tangshua【本文首发于唐霜的博客】【未经授权禁止转载】ng.net著作权归作者所有,禁止商业用途转载。

在前端应用领域,联网的两台机器想要通信,【版权所有】唐霜 www.tangshuang.net【原创内容,转载请注明出处】有两种模式,一种是单工通信模式,另一种是转载请注明出处:www.tangshuang.net【作者:唐霜】双工通信模式。单工通信只能在一个方向上传著作权归作者所有,禁止商业用途转载。【原创不易,请尊重版权】输数据,我们最常用的HTTP协议就是单工未经授权,禁止复制转载。未经授权,禁止复制转载。通信。双工通信可以在两个方向上传输数据,未经授权,禁止复制转载。【原创内容,转载请注明出处】网络层面还分半双工全双工,但在前端基本没【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】有这个必要去区分,我们最常见的莫过于We【本文首发于唐霜的博客】转载请注明出处:www.tangshuang.netbSocket。在传输模式上,分为文件传【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】输和流式传输,前者一次性传输整个文件,而【作者:唐霜】未经授权,禁止复制转载。后者开启一个可持续的通道多次传输数据。

【版权所有】唐霜 www.tangshu转载请注明出处:www.tangshuang.net原创内容,盗版必究。ang.net原创内容,盗版必究。【本文受版权保护】

了解完这些知识后你会发现,想要做到边下载【版权所有】唐霜 www.tangshuang.net未经授权,禁止复制转载。边播放还没那么容易,我们知道可以采用流式【本文首发于唐霜的博客】著作权归作者所有,禁止商业用途转载。传输来实现多次传输,在前面拿到数据之后,未经授权,禁止复制转载。转载请注明出处:www.tangshuang.net就可以立即使用。然而,作为一个视频文件,【关注微信公众号:wwwtangshuangnet】著作权归作者所有,禁止商业用途转载。它的视频编码方式决定了它能不能支持这种拿【作者:唐霜】【关注微信公众号:wwwtangshuangnet】到部分数据后就可以开始播放的能力。因为前本文作者:唐霜,转载请注明出处。【本文受版权保护】面讲到,视频编码就是进行压缩、优化,那么【版权所有】唐霜 www.tangshuang.net未经授权,禁止复制转载。如果通过流式传输拿到的数据片段无法进行解【关注微信公众号:wwwtangshuangnet】本文作者:唐霜,转载请注明出处。码会怎样?这也就是为什么我说这里没那么容【作者:唐霜】【未经授权禁止转载】易的原因。实际上,只有部分视频编码方式和【未经授权禁止转载】【转载请注明来源】部分视频格式支持流式传输后用来进行播放。

【原创不易,请尊重版权】【原创内容,转载请注明出处】本文作者:唐霜,转载请注明出处。著作权归作者所有,禁止商业用途转载。

我们之所以需要这些思考,是因为我们当下的【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】行业中,往往需要解决直播、视频会议、同声【版权所有,侵权必究】【版权所有】唐霜 www.tangshuang.net传译等实时性要求极高的、传输数据体积很大【未经授权禁止转载】【未经授权禁止转载】的场景。

【版权所有,侵权必究】未经授权,禁止复制转载。

我们面临的核心需求是:我们希望继承现代W【关注微信公众号:wwwtangshuangnet】未经授权,禁止复制转载。eb的安全保护技术,换句话说,我们需要T【未经授权禁止转载】原创内容,盗版必究。LS(安全传输层协议)加密;我们想要某种未经授权,禁止复制转载。【未经授权禁止转载】类型的拥塞控制;我们仍想要客户端-服务器转载请注明出处:www.tangshuang.net本文作者:唐霜,转载请注明出处。体系结构,我们不希望它建立在p2p的模型【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】上,因为p2p连接体系结构会话的启动难度未经授权,禁止复制转载。本文版权归作者所有,未经授权不得转载。不小;我们在大多数应用程序中也想使用双向【版权所有】唐霜 www.tangshuang.net【转载请注明来源】通信,我们需要发送可靠和有序的数据,我们【本文受版权保护】本文作者:唐霜,转载请注明出处。将这种数据称为“流”。流遵循先进先出的模未经授权,禁止复制转载。原创内容,盗版必究。式,因此在此过程中不会丢失任何内容;我们【访问 www.tangshuang.net 获取更多精彩内容】【原创不易,请尊重版权】还希望以最小的延迟来实现流,但同时我们还未经授权,禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】需要发送非可靠和无序的数据报文,这和UD【转载请注明来源】原创内容,盗版必究。P报文非常相似,它们都是小数据包,关键在本文作者:唐霜,转载请注明出处。转载请注明出处:www.tangshuang.net于传输的速度,如果速度太慢,其中一些数据【转载请注明来源】著作权归作者所有,禁止商业用途转载。可能会丢失,但只要我们能够实现高速传输,转载请注明出处:www.tangshuang.net未经授权,禁止复制转载。就能解决这个问题;我们还需要持续地给发送【版权所有】唐霜 www.tangshuang.net【版权所有,侵权必究】端提供反馈,我们不能漫无目的地发射接收无本文版权归作者所有,未经授权不得转载。【本文首发于唐霜的博客】法处理的数据。并且它们应该使用URI进行本文版权归作者所有,未经授权不得转载。【转载请注明来源】资源定位,因为Web中的URI和URL是著作权归作者所有,禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】我们定位Internet内容的核心中枢,原创内容,盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】所以我们不想改变这种机制,我们想要一些符【版权所有,侵权必究】【版权所有,侵权必究】合URI机制的东西;我们想要进行定制化的【本文受版权保护】【版权所有】唐霜 www.tangshuang.netRTC传输,自己可以自定义传输协议,有更【访问 www.tangshuang.net 获取更多精彩内容】【作者:唐霜】多自由发挥的空间。

【版权所有】唐霜 www.tangshu著作权归作者所有,禁止商业用途转载。【本文首发于唐霜的博客】ang.net未经授权,禁止复制转载。

成年人的世界就是这样,全都想要。却不知道未经授权,禁止复制转载。本文作者:唐霜,转载请注明出处。,这里面的困难是有多难。

【访问 www.tangshuang.n【原创不易,请尊重版权】【作者:唐霜】et 获取更多精彩内容】【本文受版权保护】

我们看下当下的Web通信都有哪些备选项:HTTP1/2, WebSocket, 【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】WebRTC。但这些方案每一个都不那么完美,各有优缺【本文受版权保护】【本文受版权保护】点。HTTP慢,但HTTP2安全。Websocket全双工,但是阻塞,没本文作者:唐霜,转载请注明出处。【关注微信公众号:wwwtangshuangnet】有原生支持流。WebRTC支持实时流,点【转载请注明来源】著作权归作者所有,禁止商业用途转载。对点通信理论上效率高,但是建立P2P连接【版权所有,侵权必究】【本文首发于唐霜的博客】成本太高,还要解决各种奇怪的穿透问题等连著作权归作者所有,禁止商业用途转载。本文版权归作者所有,未经授权不得转载。不通的问题。为了满足开发者们的需求,We【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】bTransport的标准被提了出来,通【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】过WebTransport就可以满足上述【原创不易,请尊重版权】未经授权,禁止复制转载。的大部分需求。在WebTransport【访问 www.tangshuang.net 获取更多精彩内容】【版权所有,侵权必究】下,我们可以支持双工+流的理想组合,类似直播这样的可互动视频应用将会越来越【原创内容,转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】多。

【转载请注明来源】【版权所有】唐霜 www.tangshu本文作者:唐霜,转载请注明出处。【本文受版权保护】ang.net未经授权,禁止复制转载。【原创不易,请尊重版权】

目前部分浏览器已经支持WebTransp【未经授权禁止转载】未经授权,禁止复制转载。ort了,但是想要用它,你的服务端必须部【未经授权禁止转载】【本文受版权保护】署支持HTTP3才行。WebTransport是基于HTTP3的协议框架,而HTTP3又是基于QUIC协议的,虽然目前HTTP3还没有那么流行,部署和维护成本还比较高,但是QUIC已著作权归作者所有,禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】经是比较成熟的协议,未来一定会逐渐成熟,转载请注明出处:www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】并有可能逐渐取代当下的应用协议。

【关注微信公众号:wwwtangshua【本文受版权保护】【作者:唐霜】ngnet】【本文首发于唐霜的博客】【访问 www.tangshuang.n转载请注明出处:www.tangshuang.net【原创不易,请尊重版权】et 获取更多精彩内容】

好了,我们的三位主角已经悉数登场介绍完毕【版权所有】唐霜 www.tangshuang.net【本文受版权保护】

【作者:唐霜】【原创不易,请尊重版权】

接下来,我们来聊一聊基于这三位主角,我们【未经授权禁止转载】本文版权归作者所有,未经授权不得转载。可以畅想一些可能的应用。

原创内容,盗版必究。【本文首发于唐霜的博客】未经授权,禁止复制转载。【作者:唐霜】

首先我想到的是互动电影或者互动直播,以往著作权归作者所有,禁止商业用途转载。【原创内容,转载请注明出处】,我们的电影或直播的内容生产是中心化的,本文版权归作者所有,未经授权不得转载。原创内容,盗版必究。电影公司拍什么,我们看什么,但是,随着A未经授权,禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】IGC的逐渐成熟,以及上述技术的应用,未本文版权归作者所有,未经授权不得转载。本文版权归作者所有,未经授权不得转载。来我们可能实现多人联机的UGC实时互动电本文版权归作者所有,未经授权不得转载。【版权所有】唐霜 www.tangshuang.net影生产模式,你可以理解为屏幕版的黑客帝国【原创内容,转载请注明出处】【本文首发于唐霜的博客】(或者你可以带上苹果的VisionPro【本文受版权保护】【原创不易,请尊重版权】参与)。

转载请注明出处:www.tangshua【关注微信公众号:wwwtangshuangnet】【关注微信公众号:wwwtangshuangnet】ng.net【作者:唐霜】未经授权,禁止复制转载。

这个可能比较科幻未来。

【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshu【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有,禁止商业用途转载。ang.net

我说一个当下的,前面我们讲到通过html2canvas实现截图,那么通过结合OffscreenCanvas, Web【原创不易,请尊重版权】本文作者:唐霜,转载请注明出处。Codecs, WebTransport,我们就可以便捷的实时观察用户在页面中的著作权归作者所有,禁止商业用途转载。【原创内容,转载请注明出处】操作,从而提供方便的客服。

未经授权,禁止复制转载。【转载请注明来源】转载请注明出处:www.tangshua【版权所有,侵权必究】【作者:唐霜】ng.net

当然啦,还有很多很多可能场景,我这里只是【作者:唐霜】【原创内容,转载请注明出处】抛砖引玉,你如果有自己的想法,可以在下方未经授权,禁止复制转载。【原创内容,转载请注明出处】留言,发表你的idea。

本文作者:唐霜,转载请注明出处。本文作者:唐霜,转载请注明出处。转载请注明出处:www.tangshua原创内容,盗版必究。原创内容,盗版必究。ng.net【本文首发于唐霜的博客】

好了今天的节目就到这里,动动你的小手指,【版权所有,侵权必究】【原创不易,请尊重版权】给个一键三连,好运连连,记得关注我的微信著作权归作者所有,禁止商业用途转载。著作权归作者所有,禁止商业用途转载。公众号 wwwtangshuangnet 给我【原创不易,请尊重版权】著作权归作者所有,禁止商业用途转载。捐赠哦,我们下期再见。

【版权所有,侵权必究】本文作者:唐霜,转载请注明出处。【版权所有】唐霜 www.tangshu【关注微信公众号:wwwtangshuangnet】【作者:唐霜】ang.net

2023-10-14 3262

为价值买单,打赏一杯咖啡

本文价值32.62RMB