If I had to load a lot of images, I would go about it like this:

• Add image dimensions as CSS to IMG-tags so the site will not jump around
• Add a loading animation until a (degraded quality) image can be displayed
• Deliver images with interlacing
• Only load pictures which are currently in the viewport or might be in the viewport soon
• Use the least possible resolution which still looks good (you do not need a high resolution on a smartphone screen, except you want to make use of the browser VR features)
• Apply all the usual image optimization techniques

Expert level:

• Concentrate on one image at a time when downloading. First download the first degraded-quality chunk for every image, then load the next one. It should be possible with websockets and a server which delivers the specific chunks. On the client side, you might have to use the CANVAS-tag. It is the most work, but this technique might deliver the best UX (worth a FOSS project, I'd say)