I’m trying the assetBundlePatterns
feature from SDK 24 and I don’t fully understand how it works.
Before SDK 24 I used the following routine:
const cacheImages = (images) => {
return images.map(image => {
if (typeof image === 'string') {
return Image.prefetch(image);
} else {
return Asset.fromModule(image).downloadAsync();
}
});
};
This code downloads requested file and caches it so when you do require('./assets/images/logo.png')
the file is retrieved from local cache.
Now with SDK 24 you define the resources as assets
"assetBundlePatterns": [
"assets/**",
"node_modules/react-navigation/src/**/*.png",
]
which are packaged in the project bundle.
So I asume there is no need to use cacheImages
scheme anymore, is this right?
However, I notice images loads are slow, like they are being downloaded instead of being retrieved from project bundle.
I attach a video to show the delay loading back-icon
image from react-navigation
when assetBundlePatterns
is used without cacheImages
.
https://my.cl.ly/content/2O0m3e0a1D1u
Also the same happens with my own images, if I have no connectivity they are not loaded in iOS (Android works good).
No image loaded (airplane mode):
Image loaded (with internet connection):
So for now I have implemented both schemes, assetBundlePatterns
annotation in app.json
, and cacheImages
at app startup.
May be this feature is not mature yet and we have to wait for SDK 25?
Thanks !!!