Optimize image loading

[RGBboy]

Contentful has an API to crop and resize images. Currently we just load the original image regardless of size. To help with the Android out of memory issue and decrease the bandwidth consumption of the app we should load the appropriate sized image for where we are displaying it. As an example Cabaret_finalists.jpg?w=500&h=500&fit=fill.

This image originally returns the following data:

{
  id: "4iXietXWjecIke4K4m8mii"
  revision: 1
  uri: "https://images.ctfassets.net/n2o4hgsv6wcx/4iXietXWjecIke4K4m8mii/f51a9ba4d860859cc3286d23cc29c0e7/Cabaret_finalists.jpg"
  width: 1500
  height: 1000
}

We would need to figure out the size of image to request. Perhaps by using React Natives onLayout handler (although not using this API would be preferred).

[robbiemccorkell]

😱 I had no idea this was available

[Lily418]

Currently having a look and I haven't yet spotted how this works with Contentful Sync API which is implemented at the moment, this may be only an option when using the Asset api directly.

[Lily418]

Apologies, I'd misunderstood that the Sync API doesn't sync the image data just the url of the images so was looking in the wrong place.