Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Possibility to not rely on js thread? #99

Open
nastarfan opened this issue Aug 10, 2019 · 20 comments
Open

Possibility to not rely on js thread? #99

nastarfan opened this issue Aug 10, 2019 · 20 comments

Comments

@nastarfan
Copy link

First, thank you for this awesome library, really useful for us.
However, recently I am having a problem to display the placeholder animation smoothly since the js thread is occupied performing other computation. The animation even stopped when such condition happens. Is there a way to display smooth animation regardless how busy the js thread is?
The whole idea of loading animation or placeholder is to show users some animation when we are preparing the data or layout, when the animation stutter this gives bad impression to users.

Thanks in advance

@mfrachet
Copy link
Owner

I m in holidays but will take a look soon concerning the native computation or at least defering the animation only when it s possible on the JS thread.

Thanks for your feedback 😊

@mfrachet
Copy link
Owner

I didn't forget about this issue, I'm looking for time to take it 😅

@rchvalbo
Copy link

Any movement on this?

@mfrachet
Copy link
Owner

I'm not working on this for now, but if anybody wants to offload the animation to the native thread, feel free to open a PR 🙏

@likern
Copy link

likern commented Sep 2, 2020

react-native-reanimated v2 does exactly this.
Your animations will be run on UI thread, or more specifically (if I correctly understood how they work) on
separate JS Engine instance deliberately used for animations.

@mfrachet
Copy link
Owner

mfrachet commented Sep 2, 2020

Yep, thanks for the feedback 😊 . I'm not very interested in adding a new dependency here since the placeholder animations are basic one and that we can avoid relying on the JS thread using react native "Animated" module.

However, I didn't try to create a custom animation with react-native-reanimated v2, that might be interesting 😊

@ovistoica
Copy link

Would a PR where all the animations with useNativeDriver: false, such as Shine, be remade to to use native driver be useful? I am considering doing this. Especially Shine could be moved from animating left to translateX which is supported in native driver

@mfrachet
Copy link
Owner

Yes this is an approach that I would prefer over adding react-native-reanimated :). Nice idea @stoica94 ! 😊

@ovistoica
Copy link

Great! I will provide a PR this weekend and we will discuss further then 👍

@mfrachet
Copy link
Owner

Thank you so much for this 🚀

@mfrachet
Copy link
Owner

To give some feedbacks on that: #134 (comment)

@nandorojo
Copy link

Would this still get merged?

@mfrachet
Copy link
Owner

It won't until it works on Android :/

@Stevemoretz
Copy link

Reanimated 2 does exactly this.
If you don't want to add this as a dependency to the the current repo.

I'd suggest a branch for reanimated 2 would be great,ps if you haven't tried reanimated 2 you have no idea what you're losing it's just a lot easier a lot performant, and you write a lot of less code for the same thing, also the syntax is identical to what you normally write for your js calculations and it uses a few hooks to handle stuff.JUST AMAZING!

@nandorojo
Copy link

nandorojo commented Apr 14, 2021

I'm the maintainer of a new library called Moti. It's like framer motion for React Native (+Web). It's powered by Reanimated 2.

I also have a skeleton component, which should solve the issue at hand.

Docs: moti.fyi/skeleton
Video: https://twitter.com/FernandoTheRojo/status/1366902697010622466

@Stevemoretz
Copy link

It's a shame this didn't get fixed the moti library is also absolutely amazing and could easily be able to re create these animations but it means a few more dependencies

@mfrachet
Copy link
Owner

Feel free to fork or to switch if this does not fit your needs 😊.

Kind reminder that I m not paid to provide you this library for free.

@Stevemoretz
Copy link

Feel free to fork or to switch if this does not fit your needs 😊.

Kind reminder that I m not paid to provide you this library for free.

Sure, it was just a kind suggestion performance wise, but you don't have to do anything for anyone.

I'll make my own no need to fork, thanks anyways for sharing this library.

@mfrachet
Copy link
Owner

Sorry for being harsh. "It s a shame" does not translate very well in my native language 😅

Thanks for the suggestion however. I will probably try to request help from maintainers that will, hopefully, be more available and interested in maintaining this project since I dont have the time nor the energy to 🙂.

Sorry for the previous message, I misinterpreted what you said.

@Stevemoretz
Copy link

Stevemoretz commented Aug 20, 2021

Sorry for being harsh. "It s a shame" does not translate very well in my native language 😅

Thanks for the suggestion however. I will probably try to request help from maintainers that will, hopefully, be more available and interested in maintaining this project since I dont have the time nor the energy to 🙂.

Sorry for the previous message, I misinterpreted what you said.

No hard feeling, what it's a shame meant was this is a really good library with a lot of stars and users but unfortunately it has a little performance problem which is not resolved yet. Sorry I should've been more clear.

Thanks again for this after all, this got me the idea on how to build my placeholder component's animations.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants