html 数据大 滚动慢,html – 图像调整大小导致滚动速度慢

我正在加载大图，让浏览器调整大小。我明确地设置大小。

页面上有许多这样的图像。滚动非常慢，波涛汹涌。当滚动时，Chrome中的事件时间线看起来像这样：

Paint

* Image decode (JPEG)

* Image resize (non-cached)

* Image decode (JPEG)

* Image resize (non-cached)

* ...

Paint

* Image resize (cached)

* Image resize (cached)

* Image resize (cached)

* Image resize (cached)

Paint

* Image decode (JPEG)

* Image resize (non-cached)

* Image decode (JPEG)

* Image resize (non-cached)

* ....

Paint

* Image resize (non-cached)

* Image resize (non-cached)

* Image resize (non-cached)

* Image resize (non-cached)

Paint

* Image decode (JPEG)

* Image resize (cached)

* Image decode (JPEG)

* Image resize (cached)

* ...

等等

我不知道为什么一些Paint事件包括图像解码，而其他的没有，而且为什么有​​时调整大小是有缓存的，有时它不是。我想这必须与进入视图端口的新图像有关。

有没有什么可以做的，以确保在页面加载时，我只需支付每张图像的图像调整费用一次，并避免图像在滚动期间调整大小？

(当然，我理解最好的解决方案是通过加载已经具有适当大小的图像来避免浏览器调整大小，在这种情况下这是不实际的。)