I may be off the mark here but I wanted to find out if there actually is a solution to this problem before I try and solve it. 

I'm using cordova on iOS and accessing the device's image gallery, fetching a photo's file.uri (the least memory hungry way according to phongap docs) and then rendering this into a roughly 50px x 50px image on the page. 

The problem I've run into is that once I have loaded 4 or more photos onto the page, the performance starts to suffer, focus on other form elements becomes slow, and somewhat 'jerky'. I believe that this has to do with the fact that I am obviously rendering a high resolution image in a tiny box and when you have multiple high res images on one page you put a serious strain on the device's resources. This is on an iPhone 5, I would imagine the performance to be worse still on a 4s and 4.

Is there a way to programatically create 'low res' versions of the image(s) and then use these low res images on my page? In theory I have access to the image and its location, so can I not convert/compress/downscale these on the fly for the purpose of improving performance and then ditch these thumbnails/temp images once any upload of the actual image files is complete?