mattbdean
mattbdean

Reputation: 2552

How to efficiently load many images at a time?

I am working on an application that lets the user assign images to people and then view the images by the person's name. What I am currently doing is that when a person is clicked on, the all of that person's images will be loaded into their individual ImageViews. This works fine when loading three or four images, but when 20+ are involved, things start to get a little laggy.

So, my question is: How can I efficiently load these images from files without completely lagging out the application?


Things I have thought about:

  1. A preloader that loads all the images from all the people before starting up the main application. A problem would occur if one of the files were removed.
  2. Having a mini-preloader to load all of the images before displaying them.
  3. Loading the images without a loader when the user clicks on the person.

Upvotes: 1

Views: 1085

Answers (1)

sarcan
sarcan

Reputation: 3165

If you want your application to remain scalable (in turns of hundreds of images), loading them all before the application starts is not feasible.

The reason you are seeing the application lag is most likely the limited hard drive bandwidth (profiling may be necessary). There's a couple of things you can do to improve image loading (e.g. using optimized image formats / storing scaled-down versions of your images etc), but at some point you'll always be loading stuff from disk.

1) I would advise you to create a custom node consisting of an ImageView and a ProgressIndicator. Let the user know that there's additional images being loaded.

2) Have a limited number of worker threads load the images to avoid excessive blocking while waiting for the disk

3) Preload and cache images where possible. This is one of the few cases where the use of SoftReferences is actually a good idea.

Upvotes: 4

Related Questions