[Image] If use a gif url, it will take more than 300m memory #1968

Closed
soliury opened this Issue Jul 13, 2015 · 22 comments

Comments

Projects
None yet
@soliury

soliury commented Jul 13, 2015

I found the bug in the noder, if this is a bug ?

Ps: the gif size is about 1.8M

@brentvatne

This comment has been minimized.

Show comment
Hide comment
@brentvatne

brentvatne Jul 20, 2015

Collaborator

What is the memory usage on the app on the exact same screen without the gif? And with? (interested in the differential here).

Collaborator

brentvatne commented Jul 20, 2015

What is the memory usage on the app on the exact same screen without the gif? And with? (interested in the differential here).

@soliury

This comment has been minimized.

Show comment
Hide comment
@soliury

soliury Jul 21, 2015

If without gif, it only takes about 130m. But used the gif it takes 300-400m

soliury commented Jul 21, 2015

If without gif, it only takes about 130m. But used the gif it takes 300-400m

@brentvatne

This comment has been minimized.

Show comment
Hide comment
@brentvatne

brentvatne Jul 22, 2015

Collaborator

I don't believe that anybody at Facebook is too concerned about gifs at the moment so this will need to be a community effort. Do you have any time to dig into this and try to find the cause @soliury? 😄

Collaborator

brentvatne commented Jul 22, 2015

I don't believe that anybody at Facebook is too concerned about gifs at the moment so this will need to be a community effort. Do you have any time to dig into this and try to find the cause @soliury? 😄

@soliury

This comment has been minimized.

Show comment
Hide comment
@soliury

soliury Jul 22, 2015

ok, I have a try.

soliury commented Jul 22, 2015

ok, I have a try.

@nicklockwood

This comment has been minimized.

Show comment
Hide comment
@nicklockwood

nicklockwood Jul 28, 2015

Contributor

It's not a bug, it's a limitation of the implementation:

Gif is a compressed format, and can't be displayed on screen directly without decompressing it. When we load a gif, we decompress all the frames and create a keyframe animation. That's why the memory consumption is so huge - every decompressed frame of the gif will take up width x height x 4 bytes, regardless of it's compressed size, so if it has a lot of frames it will be huge.

What you really want here is something like a streaming gif implementation, where frames are only decompressed as they are about to be played, rather than all in advance.

Realistically though, that's a lot of work for us to implement, since it would mean replacing the Core Animation keyframes with our own animation system based on CADisplayLink.

If possible, you'd be better off using a video instead of a gif for a long animation like this.

Contributor

nicklockwood commented Jul 28, 2015

It's not a bug, it's a limitation of the implementation:

Gif is a compressed format, and can't be displayed on screen directly without decompressing it. When we load a gif, we decompress all the frames and create a keyframe animation. That's why the memory consumption is so huge - every decompressed frame of the gif will take up width x height x 4 bytes, regardless of it's compressed size, so if it has a lot of frames it will be huge.

What you really want here is something like a streaming gif implementation, where frames are only decompressed as they are about to be played, rather than all in advance.

Realistically though, that's a lot of work for us to implement, since it would mean replacing the Core Animation keyframes with our own animation system based on CADisplayLink.

If possible, you'd be better off using a video instead of a gif for a long animation like this.

@sophiebits

This comment has been minimized.

Show comment
Hide comment
@sophiebits

sophiebits Aug 3, 2015

Member

Probably easiest to just write a wrapper for https://github.com/Flipboard/FLAnimatedImage (which Facebook uses in some of its apps).

Member

sophiebits commented Aug 3, 2015

Probably easiest to just write a wrapper for https://github.com/Flipboard/FLAnimatedImage (which Facebook uses in some of its apps).

@soliury

This comment has been minimized.

Show comment
Hide comment
@soliury

soliury Aug 3, 2015

@nicklockwood @spicyj ok, I see. I'll have a try

soliury commented Aug 3, 2015

@nicklockwood @spicyj ok, I see. I'll have a try

@aleclarson

This comment has been minimized.

Show comment
Hide comment
@aleclarson

aleclarson Aug 18, 2015

Contributor

What's the status on this? I'd really like a performant GIF implementation. 😁

Contributor

aleclarson commented Aug 18, 2015

What's the status on this? I'd really like a performant GIF implementation. 😁

@miduga

This comment has been minimized.

Show comment
Hide comment

miduga commented Sep 6, 2015

+1

@ide

This comment has been minimized.

Show comment
Hide comment
@ide

ide Sep 6, 2015

Collaborator

There's a good chance that Facebook doesn't have a need for animated GIFs especially if they transcode to a movie format on the server. As @spicyj suggested, making a module that uses FLAnimatedImage is probably easiest and best if you need GIF support.

Collaborator

ide commented Sep 6, 2015

There's a good chance that Facebook doesn't have a need for animated GIFs especially if they transcode to a movie format on the server. As @spicyj suggested, making a module that uses FLAnimatedImage is probably easiest and best if you need GIF support.

@cosmith

This comment has been minimized.

Show comment
Hide comment
@cosmith

cosmith Mar 9, 2016

Contributor

I think gifs work fine now. Trying the bot 😉

Contributor

cosmith commented Mar 9, 2016

I think gifs work fine now. Trying the bot 😉

@cosmith

This comment has been minimized.

Show comment
Hide comment
Contributor

cosmith commented Mar 9, 2016

@facebook-github-bot

This comment has been minimized.

Show comment
Hide comment
@facebook-github-bot

facebook-github-bot Mar 9, 2016

@cosmith tells me to close this issue. If you think it should still be opened let us know why.

@cosmith tells me to close this issue. If you think it should still be opened let us know why.

@nicklockwood

This comment has been minimized.

Show comment
Hide comment
@nicklockwood

nicklockwood Mar 10, 2016

Contributor

We've not changed the GIF implementation, so I doubt this situation has improved. Small GIFs work fine (as they always have), large GIFs will probably still cause an OOM.

Contributor

nicklockwood commented Mar 10, 2016

We've not changed the GIF implementation, so I doubt this situation has improved. Small GIFs work fine (as they always have), large GIFs will probably still cause an OOM.

@cosmith

This comment has been minimized.

Show comment
Hide comment
Contributor

cosmith commented Mar 11, 2016

@facebook-github-bot

This comment has been minimized.

Show comment
Hide comment
@facebook-github-bot

facebook-github-bot Mar 11, 2016

Okay, reopening this issue.

Okay, reopening this issue.

@oblador

This comment has been minimized.

Show comment
Hide comment
@oblador

oblador Mar 11, 2016

Contributor

@nicklockwood: Would you accept a PR using FLAnimatedImage?

Contributor

oblador commented Mar 11, 2016

@nicklockwood: Would you accept a PR using FLAnimatedImage?

@mkonicek

This comment has been minimized.

Show comment
Hide comment
@mkonicek

mkonicek Mar 13, 2016

Contributor

@oblador I don't think we want to add a dependency on https://github.com/Flipboard/FLAnimatedImage. Also all of the RN Obj-C source code is published to npm and don't think we have any way to specify dependencies like we do on Android.

Can you release a wrapper for FLAnimatedImage a separate RN module?

Contributor

mkonicek commented Mar 13, 2016

@oblador I don't think we want to add a dependency on https://github.com/Flipboard/FLAnimatedImage. Also all of the RN Obj-C source code is published to npm and don't think we have any way to specify dependencies like we do on Android.

Can you release a wrapper for FLAnimatedImage a separate RN module?

@oblador

This comment has been minimized.

Show comment
Hide comment
@oblador

oblador Mar 14, 2016

Contributor

@mkonicek: Yeah maybe it makes sense to release it as a community module and that's been my approach so far, only downside is that I'd have to do a semi-fragile extension sniff on url in JS instead of inspecting file headers and lots of code duplication from core. But performance is really several magnitudes better though, so it would still be nice to have something better in core since the current implementation is almost unusable for anything large or non-trivial.

FLAnimatedImage dependency could be included via a submodule and then strip out anything but the good stuff via npmignore. But that's not ideal ofc and cocoapods I assume is not an option.

Contributor

oblador commented Mar 14, 2016

@mkonicek: Yeah maybe it makes sense to release it as a community module and that's been my approach so far, only downside is that I'd have to do a semi-fragile extension sniff on url in JS instead of inspecting file headers and lots of code duplication from core. But performance is really several magnitudes better though, so it would still be nice to have something better in core since the current implementation is almost unusable for anything large or non-trivial.

FLAnimatedImage dependency could be included via a submodule and then strip out anything but the good stuff via npmignore. But that's not ideal ofc and cocoapods I assume is not an option.

@nihgwu

This comment has been minimized.

Show comment
Hide comment
@nihgwu

nihgwu Jul 7, 2016

Contributor

any news about this? the force-close problem caused by large gif file is really frustrating me

Contributor

nihgwu commented Jul 7, 2016

any news about this? the force-close problem caused by large gif file is really frustrating me

@nihgwu nihgwu referenced this issue in browniefed/react-native-flanimatedimage Jul 7, 2016

Closed

Can I use this yet? #1

@nihgwu

This comment has been minimized.

Show comment
Hide comment
@nihgwu

nihgwu Sep 14, 2016

Contributor

I've published a FLAnimatedImage wrapper to npm https://github.com/nihgwu/react-native-flanimatedimage
I've been using it in production for quite a long time.

Contributor

nihgwu commented Sep 14, 2016

I've published a FLAnimatedImage wrapper to npm https://github.com/nihgwu/react-native-flanimatedimage
I've been using it in production for quite a long time.

@lacker

This comment has been minimized.

Show comment
Hide comment
@lacker

lacker Dec 15, 2016

Contributor

^ That seems like a good solution, if you need large gifs then FLAnimatedImage rather than adding this to the built-in image seems like the way to go. I'm going to close this issue, thanks everyone for helping out!

Contributor

lacker commented Dec 15, 2016

^ That seems like a good solution, if you need large gifs then FLAnimatedImage rather than adding this to the built-in image seems like the way to go. I'm going to close this issue, thanks everyone for helping out!

@lacker lacker closed this Dec 15, 2016

@neerajwahi neerajwahi referenced this issue in zulip/zulip-mobile Jan 26, 2017

Closed

Animated GIFs use too much memory #232

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment