几种方式加速网页视频播放速度

现在有不少视频网站,自带了播放加速功能,例如油管,bilibili,慕课等等.节省了很多看视频的时间,特别是看一些技术教程类的视频,不管是念ppt还是手把手演示.

在自己付费的一些网站中,一些是自带播放器不支持视频加速的.因为已经被加速惯坏,变得很不习惯,今天特意研究了一下,对于几种形式给出一些解决方法.

html5播放器

主要标志是<video>,这种是最方便实现加速的,因为原生支持.
主要依靠这两个属性:

defaultPlaybackRate* (float): The playback speed at which the video should be played
playbackRate* (float): The current playback speed: 1.0 is normal, 2.0 is two times faster forward, -3.0 is three times faster backwards and so on

可以自己在console中修改实现(来源):

/* play video twice as fast */
document.querySelector('video').defaultPlaybackRate = 2.0;
document.querySelector('video').play();

/* now play three times as fast just for the heck of it */
document.querySelector('video').playbackRate = 3.0;  

对应的插件chrome市场也有,用的比较多的有video speed controller.
市场地址

github

flash播放器

比较头疼的一个,chrome市场中也没有找到对应的插件.
比较早之前傲游浏览器做过类似功能,实现的具体讨论见 新版傲游主打的「马上看」是如何实现对视频广告的快进的?.
不过这个功能已经凉了无法使用.
网上其他比较多的方案是myspeed.不过是收费软件,并且一切反馈里表示看一会儿就挂了.
那只能用下载的方式拿到源文件,然后再用本地播放器比如potplayer等加速了.
但一些网站采用付费课程的形式,做了相应的举措防止用户下载,这样就感觉无计可施了.

不过有一些迂回的方式,这类网站还在使用flash没有升级到html5,但在mac上使用flash并不方便,所以他们可能为了mac或者iOS的用户采用了其他的播放方式.

今天遇到了一个这样的例子:

if(isMobile() && isSafari() )
{
    
 $("#player").html('<video src="'+vodadd_m3+'" class="videoimg"  controls="controls"></video>');    
}
else
{
    var fls = flashChecker();
     
    if (fls!=null && !fls.f)
    {
        alert("请安装flash播放控件,并使用QQ浏览器观看!");
         
    }
 
 $("#player").html(' <embed src="'+vodadd+'" quality="high"  class="videoimg"   allowScriptAccess="always" allownetworking="all" '+
'allowfullscreen="true" type="application/x-shockwave-flash" wmode="window" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>');   

}

js里有增加video标签的代码! 这样就转换到了上面的html5播放器的解决方法了.
isMobileisSafari的判断用UA就可以糊弄过去了.(chrome F12设备选择ipad即可, 或者用Mozilla/5.0(iPad; U; CPU iPhone OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B314 Safari/531.21.10)
然额并打不开,因为他又使用了m3u8这种格式,所以才在js里判断safari.
但有对应chrome插件支持,在应用市场安装Native HLS Playback在页面点击play embedded即可.
这样因为之前又装了video speed controller,就出现了调整速度的选项.
至此在这种特殊情况下的flash播放问题也解决了.

不过针对只有flash播放器的环境还是没找到合适的解决方法.
但可以通过查看判断的代码,改变UA等方式再找找有没有可以迂回的方式.

转载于:https://www.cnblogs.com/fairjm/p/html5_flash_video_speed_up.html

  • 3
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CSDN网页视频加速是指通过优化视频传输的方式,提高用户在CSDN网站上观看视频的效果和体验。此举旨在减少因网络状况不佳而导致的视频卡顿、加载缓慢等问题,提供更好的观看服务。 CSDN网页视频加速的实现方式主要包括以下几个方面: 1. 服务器部署:CSDN会将视频资源分布式地部署在全国各地的服务器上,用户可以从离自己最近的服务器获取视频,提高传输速度和稳定性。 2. CDN加速:CSDN利用内容分发网络(CDN)技术,在全国范围内建立了大量的边缘节点,将视频内容缓存到离用户最近的节点上,缩短数据传输距离,减少延迟,提高视频加载速度。 3. 网络优化:CSDN不断改进网络拓扑结构、升级带宽,优化网络传输路径,减少网络阻塞和传输中断的可能性,确保用户能够流畅地观看视频。 4. 视频压缩算法:CSDN利用先进的视频压缩算法,减少视频文件的大小,降低带宽需求,提高视频的加载速度播放流畅度。 通过以上技术手段的综合运用,CSDN网页视频加速可以有效提升用户在网站上观看视频的体验。用户在打开视频页面时不再遇到长时间的加载等待,视频播放流畅,同时还能享受高清、清晰的观看效果。 最后,CSDN网页视频加速的推出,也体现了CSDN对用户体验的重视和不断提升服务水平的承诺。希望用户在CSDN网站上可以愉快地学习、沟通、分享,获取更多有价值的信息内容。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值