使用chrome中的缩放图像改善滚动性能

时间:2016-05-14 04:54:16

标签: android performance google-chrome scroll repaint

我正在开发一个网络应用程序,其中包含有轨道信息和艺术作品的播放列表。该作品是100x100px图片,缩小为50x50px以支持高分辨率显示。我开始观察一个奇怪的jank,而滚动和一点点谷歌搜索带我到这个链接 - http://www.html5rocks.com/en/tutorials/speed/scrolling/#toc-resizing

  

如果您要将大图片发送到设备,然后使用CSS或图片尺寸属性缩小图片,那么您更有可能看到这种情况发生。当然,浏览器重新缩放图像的数量以及它必须执行此操作的频率将影响您的页面在主浏览器线程上发生的性能,从而阻止其他工作发生。

我认为可能有用的一个解决方案是在滚动时隐藏图像并显示滚动停止。这肯定会影响用户的体验。

网站参考:https://funag.github.io
PS:在Android chrome中打开以在滚动时观察janks

0 个答案:

没有答案