Image resizing causing slow scrolling

Question

I\'m loading large images and having the browser resize them. I\'m explicitly setting the size.

Answer 1

Your problem is that you are downloading lots of images at the same time, lots of large images. The rendering of them to differnt sizes other than the orginal will also be slow if there are lots of large images and the users individual ram and processor limitations.

no matter what size you tell the browser to render the image the browser still loads the original image size and then adjusts it on the fly. The large image has to travel down the users internet connection to the browser from the server. by using html attributes all you are doing really is using CSS to change the image size once it has been downloaded.

Your best option would in mho be to create multiple image sizes server side, preferably at the time of creation of the asset rather than on the fly and call the image size closest to your needs. If you create images on the fly using scripts etc keep them on the server to use again later on and reduce load time and server resources.

one last tip is also make sure you are caching. more info here http://betterexplained.com/articles/how-to-optimize-your-site-with-http-caching/