Image resizing causing slow scrolling

[mpcool]

I'm loading large images and having the browser resize them. I'm explicitly setting the size.\[code\]<img src="http://example.com/image1.jpg" width="240" height="360"/>\[/code\]There are many such images on the page. Scrolling is very slow and choppy. The Events Timeline in chrome looks something like this when scrolling:\[code\]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)* ...\[/code\]etc.I'm not sure why some of the Paint events include image decoding and others don't, nor why sometimes the resizing is cached and sometimes it is not. I guess it must have to do with new images coming into the view-port.Is there anything I can do to ensure that I only pay the image resize cost once per image when the page loads, and avoid image resizing during scroll?(Of course, I understand that the best solution is to avoid browser resizing by loading in an image that is already of the appropriate size. In this case this is not practical.)