kfiroo/react-native-cached-image

Suggestion: Progressive image loading algorithm by Medium

Closed this issue · 2 comments

iegik commented
  • Blur image frame
  • Load small sized image first (aspect ratio * 4 or 8)
  • Load full-sized image
  • Animate blur effect

https://jmperezperez.com/medium-image-progressive-loading-placeholder/

@iegik That sounds great, but I'm afraid it's a bit out of scope of this lib.
The main concern here is to avoid downloading images multiple time and to provide a swift loading of images from cache.
What you are describing might be an amazing stand alone component for loading image and could be used with this lib to smooth the first time loads :)

iegik commented

You are right, it can be done by adding that stand alone component as loader for CachedImage, which uses also CachedImage for small version.
Something like this:

<CachedImage source={{url:'http://placehold.it/600x800'}}
    loader={<Blured.CachedImage source={{url:'http://placehold.it/6x8'}}/>}
/>