过年的时候有朋友分享了一篇关于网易容歌H5的文章https://azi.music.163.com/c/rongge_test/index.html很漂亮，要研究一下网易的实现原理♂，今年看过的最好的测试H5！看js请求：js一个一个搜索研究；第一个：Pixijs，搜索了一下，发现Pixijs很强大，感觉可以做H5小游戏；Pixi中文版教程（零学习）https://github.com/wangwenjie1314/LearningPixi同时，通过使用TexturePacker工具可以更好的处理材质；通过这篇文章HowtocreatespritesheetsandanimationsforPixiJS，你可以了解到sprite元素是如何移动的通过这篇文章PixiJs通过H5场景动画实现的实战，你可以了解到Pixi在H5项目中的实际运作方式。通过这篇文章pixi.js移动H5陷阱，你可以了解到Pixi在H5项目中有哪些陷阱。第二：Scroller可以有效解决HTML和Canvas上面的实战文章也提到了Scroller。有关详细信息，请参阅github。ScrollerAcceleratedpanningandzoomforHTMLandCanvas就不多介绍了。第三种：Tweeen在页面中做一些元素过渡动画，他可以很好的和Pixisprite元素结合；TweenjsAnimate举例：看json，img请求以https://azi.music.163.com/c/rongge_test/images/animate/guide.json为例看完“TexturePacker”工具，里面的内容json是会很熟悉：对应的图片素材如下：https://azi.music.163.com/c/rongge_test/images/animate/guide.png生成分享图片到https://azi。music.163.com/c/rongge_test/images/end_text2/0.json为例对应素材图：https://azi.music.163.com/c/rongge_test/images/end_text2/0.png补充阅读：借用howler.js即可为现代网络实现音频播放howler.jsJavascript音频库
