react-native: Crash on Android using Image component

Environment

  React Native Environment Info:
    System:
      OS: macOS 10.14.1
      CPU: x64 Intel(R) Core(TM) i5-3210M CPU @ 2.50GHz
      Memory: 59.21 MB / 16.00 GB
      Shell: 2.7.0 - /usr/local/bin/fish
    Binaries:
      Node: 9.7.1 - /usr/local/bin/node
      Yarn: 1.5.1 - /usr/local/bin/yarn
      npm: 6.4.1 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
    IDEs:
      Android Studio: 3.2 AI-181.5540.7.32.5014246
      Xcode: 10.0/10A255 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.4.1 => 16.4.1 
      react-native: ^0.57.2 => 0.57.2 
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

Description

When loading more than 9 Image containers from URLS the App crashes on Android.

I have a chat list, with the JSX that look lite this:

        return (
            <ScrollView style={styles.viewContainer}
                        keyboardDismissMode={"on-drag"}
                        keyboardShouldPersistTaps={"always"}
            >
                {this.state.chats.map((item, i) =>
                    <TouchableOpacity key={i} onPress={() => this.showChat(item.id, item.id_user, item.user)}>
                        <View style={styles.viewMsg}>
                            <Img style={styles.imgProfileItem}
                                   src={item.image_profile}
                            />
                            <View style={styles.viewTexts}>
                                <Text style={styles.textUser}>{item.user}</Text>
                                <Text
                                    style={styles.textChat}>{item.message ? item.message : strings('chat.write')}</Text>
                            </View>
                        </View>
                    </TouchableOpacity>
                )}
            </ScrollView>
        );

When the API returns more than 9 results for the chat list the App crashes when i scroll to the bottom. The crash it’s not instantenuos:

I) I scroll down II) All the images are there showing properly III) 3-4 seconds later the app crashes

The reason why i say 9, it’s because i try slicing the list of data from 1 and up until start to crash.

Here i sliced the results until 9 elements and it works fine, if i put one more element then the crash happends:

screenshot_20181029-012514 screenshot_20181029-012520

A test that i’m making for an specific user brings 14 results, so:

  • If i remove the Image component it works fine without the crash.
  • I test this with the 0.57.1 release and then again with the 0.57.4 release, with the same result
  • i try to use the FlatList first, then when started to crash, i switch to the Scroll View with a .map implementation but still makes the crash
  • I try removeing the Touchable also, the same result
  • I try using different images urls and the same result
  • I try using one single image URL for all the elements of the list and it works fine, so one assumption that i’m making is that the crashes happens when in the screen there is more than 9 Image components loading with different Urls
  • When i was trying the 9 chats limit, i change the order of the images urls, and change them for some other images urls in different scenarios to make sure that it wasn’t one the images that it was causing the crash.
  • I try creating a component that transforms the URL into a base64 string, so i start using that component with the same result, when i put 8 or less elements it works fine, but from 9 and more start crashing

I can’t really see a crash in the Android logcat. I will post here the errors messagues that i can spot around the moment of the crash.

Android logcat with the filters: weed*|react*|exception* (weed is part of the bundle name)

10-29 01:19:19.128 232-7587/? I/BufferQueueProducer: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:10869,c:232) queueBuffer: fps=27.39 dur=1131.83 max=138.69 min=13.99
10-29 01:19:19.568 10869-10869/co.fourgeeks.weedmatch D/ViewRootImpl: ViewPostImeInputStage processPointer 0
10-29 01:19:19.688 10869-10869/co.fourgeeks.weedmatch D/ViewRootImpl: ViewPostImeInputStage processPointer 1
10-29 01:19:19.728 2122-2417/? E/ConnectivityService: RemoteException caught trying to send a callback msg for NetworkRequest [ id=14, legacyType=-1, [ Capabilities: INTERNET&NOT_RESTRICTED&TRUSTED] ]
10-29 01:19:19.928 2122-2122/? W/InputMethodManagerService: Session failed to close due to remote exception
    android.os.DeadObjectException
        at android.os.BinderProxy.transactNative(Native Method)
        at android.os.BinderProxy.transact(Binder.java:503)
        at com.android.internal.view.IInputMethodSession$Stub$Proxy.finishSession(IInputMethodSession.java:327)
        at com.android.server.InputMethodManagerService.finishSessionLocked(InputMethodManagerService.java:2498)
        at com.android.server.InputMethodManagerService.clearClientSessionLocked(InputMethodManagerService.java:2489)
        at com.android.server.InputMethodManagerService.clearCurMethodLocked(InputMethodManagerService.java:2515)
        at com.android.server.InputMethodManagerService.onServiceDisconnected(InputMethodManagerService.java:2534)
        at android.app.LoadedApk$ServiceDispatcher.doDeath(LoadedApk.java:1349)
        at android.app.LoadedApk$ServiceDispatcher$RunConnection.run(LoadedApk.java:1363)
        at android.os.Handler.handleCallback(Handler.java:739)
        at android.os.Handler.dispatchMessage(Handler.java:95)
        at android.os.Looper.loop(Looper.java:148)
        at com.android.server.SystemServer.run(SystemServer.java:536)
        at com.android.server.SystemServer.main(SystemServer.java:385)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1230)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1120)
10-29 01:19:20.088 2122-2980/? W/ActivityManager: Exception when unbinding service com.samsung.android.beaconmanager/.BeaconService
    android.os.DeadObjectException
        at android.os.BinderProxy.transactNative(Native Method)
        at android.os.BinderProxy.transact(Binder.java:503)
        at android.app.ApplicationThreadProxy.scheduleUnbindService(ApplicationThreadNative.java:1273)
        at com.android.server.am.ActiveServices.removeConnectionLocked(ActiveServices.java:2194)
        at com.android.server.am.ActiveServices.killServicesLocked(ActiveServices.java:2557)
        at com.android.server.am.ActivityManagerService.cleanUpApplicationRecordLocked(ActivityManagerService.java:22342)
        at com.android.server.am.ActivityManagerService.handleAppDiedLocked(ActivityManagerService.java:7697)
        at com.android.server.am.ActivityManagerService.appDiedLocked(ActivityManagerService.java:7942)
        at com.android.server.am.ActivityManagerService$AppDeathRecipient.binderDied(ActivityManagerService.java:1945)
        at android.os.BinderProxy.sendDeathNotice(Binder.java:558)
10-29 01:19:20.098 2122-2417/? E/ConnectivityService: RemoteException caught trying to send a callback msg for NetworkRequest [ id=12, legacyType=-1, [ Capabilities: INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN] ]
10-29 01:19:20.158 232-253/? I/BufferQueueProducer: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:10869,c:232) queueBuffer: fps=7.82 dur=1023.59 max=175.49 min=90.38
10-29 01:19:20.328 10869-10923/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: netid=0; mark=0
10-29 01:19:20.338 10869-10923/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: ai_addrlen=0; ai_canonname=(null); ai_flags=4; ai_family=0
10-29 01:19:20.358 10869-11646/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: netid=0; mark=0
10-29 01:19:20.358 10869-11646/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: ai_addrlen=0; ai_canonname=(null); ai_flags=4; ai_family=0
10-29 01:19:20.468 10869-11646/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: netid=0; mark=0
10-29 01:19:20.468 10869-10923/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: netid=0; mark=0
10-29 01:19:20.468 10869-11646/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: ai_addrlen=0; ai_canonname=(null); ai_flags=1024; ai_family=0
10-29 01:19:20.468 10869-10923/co.fourgeeks.weedmatch D/libc-netbsd: [getaddrinfo]: ai_addrlen=0; ai_canonname=(null); ai_flags=1024; ai_family=0
10-29 01:19:20.838 2122-2159/? D/SyncManager: failed sync operation alacret@gmail.com u0 (com.google), com.android.contacts, PERIODIC, currentRunTime 101525, reason: Periodic, SyncResult: stats [ numIoExceptions: 1]
10-29 01:19:20.948 232-253/? I/BufferQueueProducer: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:-1,c:232) disconnect(P): api 1
10-29 01:19:20.948 232-253/? I/BufferQueueConsumer: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:-1,c:232) getReleasedBuffers: returning mask 0xffffffffffffffff
10-29 01:19:20.948 2122-7142/? I/ActivityManager: Process co.fourgeeks.weedmatch (pid 10869)(adj 0) has died(103,58)
10-29 01:19:20.948 2122-7142/? D/ActivityManager: removeProcessNameLocked mProcessNames.remove pid=10869 ,hash=189510471 ,name=co.fourgeeks.weedmatch
10-29 01:19:20.958 2122-2514/? I/WindowState: WIN DEATH: Window{b097f07 u0 d0 p10869 co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity}
10-29 01:19:20.988 2122-2417/? E/ConnectivityService: RemoteException caught trying to send a callback msg for NetworkRequest [ id=17, legacyType=-1, [ Capabilities: INTERNET&NOT_RESTRICTED&TRUSTED] ]
10-29 01:19:20.988 232-232/? I/BufferQueueConsumer: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:-1,c:-1) disconnect(C)
10-29 01:19:21.008 232-251/? I/BufferQueue: [co.fourgeeks.weedmatch/co.fourgeeks.weedmatch.MainActivity](this:0xb28c3c00,id:35,api:1,p:-1,c:-1) ~BufferQueueCore
10-29 01:19:21.018 2122-7142/? W/ActivityManager: Force removing ActivityRecord{27be544 u0 co.fourgeeks.weedmatch/.MainActivity t212}: app died, no saved state
10-29 01:19:21.338 2122-2132/? I/art: Background sticky concurrent mark sweep GC freed 31596(1950KB) AllocSpace objects, 7(140KB) LOS objects, 6% free, 34MB/36MB, paused 7.176ms total 207.547ms
10-29 01:19:22.618 2122-2560/? D/PackageManager: getComponentMetadataForIconTray : co.fourgeeks.weedmatch.MainActivity does not exist in mServices
10-29 01:19:22.618 2122-2560/? D/PackageManager: getComponentMetadataForIconTray : co.fourgeeks.weedmatch.MainActivity does not exist in mProviders
10-29 01:19:22.618 2122-2560/? D/PackageManager: getComponentMetadataForIconTray : co.fourgeeks.weedmatch.MainActivity does not exist in mReceivers
10-29 01:19:22.628 11649-11649/? I/ApplicationPackageManager: load=co.fourgeeks.weedmatch, bg=72-72, dr=72-72, forDefault=true
10-29 01:19:22.848 11664-11664/? W/System.err: android.content.pm.PackageManager$NameNotFoundException: com.samsung.helphub
10-29 01:19:22.938 2122-2132/? I/art: Background partial concurrent mark sweep GC freed 66019(3MB) AllocSpace objects, 5(96KB) LOS objects, 11% free, 31MB/35MB, paused 2.842ms total 268.921ms
10-29 01:19:23.068 2122-2122/? E/AppWidgetServiceImpl: Dead host : HostId{user:0, app:10006, hostId:2037, pkg:com.sec.android.app.easylauncher}
    android.os.DeadObjectException
        at android.os.BinderProxy.transactNative(Native Method)
        at android.os.BinderProxy.transact(Binder.java:503)
        at com.android.internal.appwidget.IAppWidgetHost$Stub$Proxy.updateAppWidget(IAppWidgetHost.java:123)
        at com.android.server.appwidget.AppWidgetServiceImpl.handleNotifyUpdateAppWidget(AppWidgetServiceImpl.java:1863)
        at com.android.server.appwidget.AppWidgetServiceImpl.access$1500(AppWidgetServiceImpl.java:135)
        at com.android.server.appwidget.AppWidgetServiceImpl$CallbackHandler.handleMessage(AppWidgetServiceImpl.java:3644)
        at android.os.Handler.dispatchMessage(Handler.java:102)
        at android.os.Looper.loop(Looper.java:148)
        at com.android.server.SystemServer.run(SystemServer.java:536)
        at com.android.server.SystemServer.main(SystemServer.java:385)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:1230)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1120)

Reproducible Demo

The error happends with this renders:

        return (
                    <View style={styles.viewContainer}>
                        <FlatList
                            horizontal={false}
                            keyExtractor={(item, index) => index.toString()}
                            data={this.state.chats}
                            renderItem={({item}) =>
                                <TouchableOpacity onPress={() => this.showChat(item.id, item.id_user, item.user)}>
                                    <View style={styles.viewMsg}>
                                        <Image style={styles.imgProfileItem}
                                               source={{uri: item.image_profile}}
                                        />
                                        <View style={styles.viewTexts}>
                                            <Text style={styles.textUser}>{item.user}</Text>
                                            <Text
                                                style={styles.textChat}>{item.message ? item.message : strings('chat.write')}</Text>
                                        </View>
                                    </View>
                                </TouchableOpacity>
                            }
                        />
                    </View>
                );

Also with the code at the beginning of the issue.

I’m tyring this set of images, but i’ve test different ones too and also this ones in different order, when i put more than 9 elements the crash happends

        const imgUrl = [
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/113/140/113-riverax2_771-2018-10-09_124817.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/128/163/128-eduardo.calfunao_818-2018-10-09_144438.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/155/217/155-prog__guitar_019-2018-10-11_155842.jpeg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/133/172/133-ignacio.r.munizaga_753-2018-10-09_170437.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/196/265/196-Pablo_cab-2018-10-15_161652.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/204/276/204-matyfreestyle1_937-2018-10-15_171927.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/204/276/204-matyfreestyle1_937-2018-10-15_171927.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/293/373/293-jhoshuavalenzuelareyes-2018-10-26_013009.jpeg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/294/374/294-josebarboza-2018-10-26_030755.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/120/151/120-eiroumea_355-2018-10-09_134239.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/192/256/192-sergiovalpo90_557-2018-10-13_174522.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/114/141/114-manzorfranco87_181-2018-10-09_125143.jpeg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/115/142/115-oscarlz.chile_669-2018-10-09_125530.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/129/164/129-fico91_020-2018-10-09_144833.jpg",
            "https://weedmatch-mobile.sfo2.digitaloceanspaces.com/mobile/users/profile/95/121/95-e.diazgodoy_221-2018-10-08_191633.jpg"
        ];

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 2
  • Comments: 15 (1 by maintainers)

Most upvoted comments