Android 通过在chrome中缩放图像提高滚动性能

Android 通过在chrome中缩放图像提高滚动性能,android,performance,google-chrome,scroll,repaint,Android,Performance,Google Chrome,Scroll,Repaint,我正在开发一个web应用程序,其中有带有曲目信息和艺术品的播放列表。艺术品是一幅100x100px图像,它被缩小到50x50px,以支持高分辨率显示。我开始观察一个奇怪的jank,滚动和一点谷歌搜索将我带到了这个链接- 如果您将大型图像发送到设备,然后使用CSS或图像维度属性将其缩小,则更有可能看到这种情况。当然,浏览器必须重新缩放图像的数量和频率将影响页面在主浏览器线程上的性能,从而阻止其他工作的进行 我认为可能有效的一个解决方案是在滚动时隐藏图像并显示滚动停止。我想这肯定会影响用户的体验 网

我正在开发一个web应用程序,其中有带有曲目信息和艺术品的播放列表。艺术品是一幅
100x100px
图像,它被缩小到
50x50px
,以支持高分辨率显示。我开始观察一个奇怪的jank,滚动和一点谷歌搜索将我带到了这个链接-

如果您将大型图像发送到设备,然后使用CSS或图像维度属性将其缩小,则更有可能看到这种情况。当然,浏览器必须重新缩放图像的数量和频率将影响页面在主浏览器线程上的性能,从而阻止其他工作的进行

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

网站参考:
PS:在android chrome中打开,在滚动时观察janks