Skip to content

Unmount images while loading #12152

Closed
Closed
@sospedra

Description

@sospedra

I'm loading few images per scene but they take a few seconds to load.
That means that in the meantime the user can navigate to another scene.
Causing the images to unmount before they finish loading.
Which triggers the following warning:
Task orphaned for request <NSMutableURLRequest: [[SOME_HEX_CODE]]> { URL: [[IMG_URL]] }

It's not crashing. I just want to know if relying the loading cancellation to React unmounting is ok? Having these warning all around is safe?

Note variables wrapped in [[]]

Activity

cornedor

cornedor commented on Apr 21, 2017

@cornedor
Contributor

This is also an issue when using FlatList with a list of items that contains images. Because the View gets unloaded all the time when scrolling, you will get a lot of these warnings.

iegik

iegik commented on Jul 16, 2017

@iegik

This will help: https://github.com/kfiroo/react-native-cached-image
It inserts View first, before image loading is complete.
I forked repository (https://github.com/iegik/react-native-cached-image) and try to reach following goals:

sospedra

sospedra commented on Aug 28, 2017

@sospedra
Author

Any news from the RN team? :) It's been a loooong time

shergin

shergin commented on Aug 29, 2017

@shergin
Contributor

It is community driven project, so PRs are always welcome!

sospedra

sospedra commented on Sep 6, 2017

@sospedra
Author

Before make any PR I usually wait until one collaborator tell me that's something needed. I'll take your comment @shergin as a call ;)

shergin

shergin commented on Sep 7, 2017

@shergin
Contributor

Well, honestly I have no any idea why this happening. But... usually code is worth a thousand words.
Is this expected behavior? Probably not. Someone just have to investigate this.

sercanov

sercanov commented on Sep 28, 2017

@sercanov
Contributor

I had the same issue with FlatList with images on rows. Not only warning but also there are serious performance problems too. I convert it to ListView, its all works great now. There is definitely something going on with FlatList

noumantahir

noumantahir commented on Dec 3, 2017

@noumantahir

Having same issues, I am rendering 3 images in a view using images uploaded on cloudinary

nickyhajal

nickyhajal commented on Dec 17, 2017

@nickyhajal

I'm also experiencing this while loading images into a flatlist

Malagasy

Malagasy commented on Jan 3, 2018

@Malagasy

having a similar issue

it works well on android 6 but ios 11.0
actually images called with remote uri aren't displaying at all

has someone found a workaround?

Malagasy

Malagasy commented on Jan 4, 2018

@Malagasy

ok my bad, images were called with http
switching to https worked for me

winterbe

winterbe commented on Jan 9, 2018

@winterbe
Contributor

I'm encountering the same problem after switching from RN 0.48.4 to 0.52.0.

jose920405

jose920405 commented on Feb 22, 2018

@jose920405

+1

I get the impression that this is not just a warning. I think that somehow this problem combined with the flat list may be causing some sporadic crashes in my application.

I am using the appsee service and I have noticed that many crashes that are not a JS exception happen to many users when they enter the section of my application where the image list is built.

This is the list of crashes that I have not yet been able to solve, but thanks to appsee I was able to realize that 90% of the time it happens loading theflatist rendering image in each row.

- SIGTRAP
- SIGABRT
- abort_with_payload_wrapper_internal
- pthread_kill$VARIANT$mp

The statistics collected tell me that these crashes happen around 1 per week. As you can see, it's something super sporadic.

screen_shot_2018-02-22_at_11 39 26

Maybe related to this topic

75 remaining items

cglacet

cglacet commented on Feb 8, 2019

@cglacet

I have also have the warning, but the image displays normally. Maybe the warning shouldn't be there? I had the same code for a while and this is the first time I get this warning.

michalchudziak

michalchudziak commented on Mar 19, 2019

@michalchudziak
Contributor

Hello there 👋 this issue doesn't have a repro (which means, a react-native init-ed project with the minimal changes that leads to creating the same issue you are reporting). Unfortunately, we have no way of helping you in a meaningful way – there is no easy way for us to recreate the situation and check that the issue reported is still there when changing the code.

Because of this, we are going to close this issue - but if a repro is shared, we are happy to reopen it 🤗

bondparkerbond

bondparkerbond commented on Apr 25, 2019

@bondparkerbond
Contributor

I encountered a similar YellowBox warning that was unrelated to loading images in my App. Instead, in dev mode on react-native 0.59, I had some console.warn statements that have a spinner while the Source Map loads that is replaced with a Check Mark. As far as I can tell, even though the check mark always appears, it sometimes triggers the Task orphaned for request YellowBox when the transition between spinner and check mark occurs and may be related to communication delays/timeouts on the bridge between the physical device(in this case iPhone SE) and the react-native packager running on your computer. In my case it is not related to any in app image loading or network calls, as I was using a hard coded object and some console warning to validate some sanitization I was doing to make sure I was getting the correct info from an expected API call without needing to worry about actually hitting the API. It also usually only appeared after several occurrences of making changes, shaking my device, clicking Reload, and running the changes before the YellowBox with:

Task orphaned for request: <NSMutableURLRequest: 0x1c001c650> { URL: data:image/png;base64, ...
... rAndOmAlphaNuM3rics ... RK5CYII== }
appeared. I also seemed to need to have the YellowBox expanded when the spinner changed to a check mark for it to appear. Restarting the packager and the app seemed to fix my issue for a while, although I am unsure if this is the same issue others are seeing or related to some other issue.

xaphod

xaphod commented on Jun 6, 2019

@xaphod

I am seeing this in RN 0.59.8 with an Image trying to load from a file:// URI (on disk) shortly after startup. The image does not load, which means I cannot ignore the warning. The file is fine.
This is on an iPhone XS with iOS 12.3.1. The XS is fast enough that it exposes race conditions in unusual places (from my experience as a native iOS dev)

YellowBox.js:67 Task orphaned for request <NSMutableURLRequest: 0x2835edb50> { URL: file:///var/mobile/Containers/Data/Application/1AD76457-FB51-49B3-9965-92E555C8EA7E/Documents/photo.jpg }

anhnh27

anhnh27 commented on Nov 27, 2019

@anhnh27

I am seeing this in RN 0.59.8 with an Image trying to load from a file:// URI (on disk) shortly after startup. The image does not load, which means I cannot ignore the warning. The file is fine.
This is on an iPhone XS with iOS 12.3.1. The XS is fast enough that it exposes race conditions in unusual places (from my experience as a native iOS dev)

YellowBox.js:67 Task orphaned for request <NSMutableURLRequest: 0x2835edb50> { URL: file:///var/mobile/Containers/Data/Application/1AD76457-FB51-49B3-9965-92E555C8EA7E/Documents/photo.jpg }

@xaphod Did u find any solution?

Elias-Graf

Elias-Graf commented on Jan 10, 2020

@Elias-Graf

Still an issue for me on react-native: 0.61.5 anyone else?

I really hope this is a different issue or I'm doing something wrong because this has been open since somewhere in 2017 :(

FrancisAiknow

FrancisAiknow commented on Jan 20, 2020

@FrancisAiknow

Sill facing this issue for ios.

shivam4ukhandelwal

shivam4ukhandelwal commented on Jan 21, 2020

@shivam4ukhandelwal

Hi,
is there anybody is going to solve this ???
cause, I think it makes an effect on the performance of flatlist.

locked as resolved and limited conversation to collaborators on Mar 20, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @shergin@hramos@iegik@dulmandakh@adcuz

        Issue actions

          Unmount images while loading · Issue #12152 · facebook/react-native