Closed ng-ha closed 3 months ago
hey @ng-ha , it crashed on my side as well. As the error you attached, the image is too large.
Loading a large image will consume more memory. So it makes sense to me when the app crashes.
Try resize
, it will help you to reduce the memory.
<Card
source={{
uri: 'https://sample-videos.com/img/Sample-jpg-image-5mb.jpg',
}}
style={{ width: 200, height: 200 }}
resize={200}
onStart={handleStart}
onSuccess={handleSuccess}
onCompletion={handleCompletion}
placeholder={{
blurhash: 'UBIr4u9}00Rj?yEzxu%LIQ%1%6xt-ks,tAIU',
}}
/>
https://github.com/user-attachments/assets/25ff9b98-c79f-43e2-bba8-3a8f986d42f4
btw, I also tried the Image
which is provided by React Native
. It crashed.
<Image
source={{
uri: 'https://sample-videos.com/img/Sample-jpg-image-5mb.jpg',
}}
style={{ width: 200, height: 200 }}
/>
@duguyihou i tried the Image
by React Native
version 0.74.3. It didn't crash in Android.
<Image
source={{
uri: 'https://sample-videos.com/img/Sample-jpg-image-5mb.jpg',
}}
style={{width: 5200, height: 5200}}
onLoad={e => console.log(e.nativeEvent)}
/>
{"source": {"height": 1691, "uri": "https://sample-videos.com/img/Sample-jpg-image-5mb.jpg", "width": 1268}}
It seems like Image
automatically scales the image down to avoid crashing. Maybe, can you consider to implement this feature too?
Btw, the resize
prop worked!
@ng-ha interesting, the version of RN in the example is 0.73.6
. And yes, I will think about this feature later. But my current plan is to re-write TurboImage
with fabric component
. It supports the New Architecture because of Interop layer.
Do you mind closing this ticket if your problem got solved?
Describe the bug Crash app trying to load image in Android
To Reproduce <TurboImage source={{ uri: 'https://sample-videos.com/img/Sample-jpg-image-5mb.jpg', }} style={{width: 300, height: 300}} />