某天上班，偶然打开网页版的喜马拉雅，随手点了首推荐音频。。。于是伴随着动词大词，动词大词，继续逛着它的首页。
一个不小心，又点进了老郭的相声，哎，还是木有更新，不过老段子也可以再听听，正当老夫要点播的时候，突然！哎呀！卧槽！卧槽！牛逼啊！我都逛了这么多页面了，耳机里的”动词大词”竟然连顿都没打，当时还打开了一下本地播放器，以为是它播放的音乐。
详细情形是这样的：我在喜马拉雅的a页面播放了音乐，然后又去b页面，c页面，音乐却并没有卡顿现象，稳如死狗！注意，这里说的是连卡顿都没有，不是说跳到别的页面会继续播放。
国内的在线音乐平台有很多，实现喜马拉雅的这种哥还是头一回见啊。大部分都是采取的本地缓存音乐进度，跳到别的页面再读取进度，继续播放，但切页面的时候肯定是会有卡顿的。所以这里给喜马拉雅的用户体验32个赞！
那么问题来了，这种网页播放器是如何实现的？
简单点说，其实就是使用了html5的api:histoyr.pushstate。
1. 页面中，所有的a标签，js对其做了点击事件的拦截，如果是支持该API的浏览器不会发生跳转，而是通过ajax请求该链接，返回结果是一串类似于如下的json:
最低0.47元/天 解锁文章
扫一扫
1万+
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
