I'm currently working on an image slider for mobile and desktop devices. The content of the slider depends on what the user uploads. In some cases users may upload large images (several MBs). These take longer to load in the slider.
What's the best way to handle the longer loading time of large images?
I'm thinking of a few options:
- Don't change anything for longer loading times.
- Show the thumbnail until the large image is loaded. This will result in a low-res pixelated view of the image that will be replaced with the high-res version of the image. This looks like the image is being 'built' (looks cool!)
- Empty state solution, example; Facebook iOS app shows symbols of the things it is loading.
- Show a progress bar to indicate there's an image loading.
Some other options:
- Limit the maximum upload size( in MBs) to prevent large images.
- Edit images ourselves after users have uploaded them.
My pick would be the thumbnail option, with progress bar. I was wondering if there's any research about what's best here or what your personal experience is. Thanks!