My new responsive exommerce site is fluid and is using % image dimensions for our product results page, which loads in content via a web service post-DOM load. As I can't specify dimensions, it's causing reflows and repaints as every product image downloads. I wont know up-front how many products will be returned. I'd like to make the page snappier, any good ideas?
I thought about working out the pixel dimensions in JS, then set those dimensions on a lightweight blank placeholder image in place of the product images, then doing a second pass changing over the img src, but retaining the dimensions. Would this prevent reflowing the render tree?