Possibility to not rely on js thread?

[nastarfan]

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]

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]

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

[rchvalbo]

Any movement on this?

[mfrachet]

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]

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]

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]

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]

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

[ovistoica]

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

[mfrachet]

Thank you so much for this 🚀

[mfrachet]

To give some feedbacks on that: https://github.com/mfrachet/rn-placeholder/pull/134#discussion_r490727207

[nandorojo]

Would this still get merged?

[mfrachet]

It won't until it works on Android :/

[Stevemoretz]

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]

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]

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]

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]

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]

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]

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.