Legend List 1.0 is LIVE! The ⚡️ fastest React Native list library, 100% JS, with powerful new features. For new and old arch. ✨ maintainContentVisiblePosition ✨ Bidirectional infinite scrolling ✨ Chat UI without the inverting hack I hope it helps make your apps better! github.com/LegendApp/le... - ThreadSky

jayz.us • 51 days ago

Legend List 1.0 is LIVE!

The ⚡️ fastest React Native list library, 100% JS, with powerful new features. For new and old arch.

✨ maintainContentVisiblePosition
✨ Bidirectional infinite scrolling
✨ Chat UI without the inverting hack

I hope it helps make your apps better!

https://github.com/LegendApp/legend-list

Comments

stalker401.bsky.social•49 days ago

shupp.dev•50 days ago

But is it too fast? Haha joking very cool

fediru.bsky.social•50 days ago

Amazing job! 😍

Did you compare perf with the new FlashList 2 alpha?

jayz.us•50 days ago

Only briefly. It seemed to still be faster than v2, but I'll need to test more to get more definitive results.

matthieugc.bsky.social•51 days ago

Awesome! You say it's compatible with old arch, but I guess the perf is not as good without sync layout?

jayz.us•51 days ago

Perf is still better than other lists. But it may be slower than it would be on new arch. And our fixGaps solution is new arch only (would require native code for old arch) so you might see a frame of gap/overlap when scrolling fast on slow devices on old arch if item sizes vary.

nanniii.bsky.social•50 days ago

anyone that tried it got an issue on IOs, when i pull to refresh my items get overlayed over each other, like the recycling keeps the old items and render the new one over it. switching from FlatList here.

jayz.us•50 days ago

I think it's an old architecture specific bug - I did not test on old arch enough after some recent changes. I'll try to fix it and release an update tomorrow. https://github.com/LegendApp/legend-list/issues/196

nanniii.bsky.social•50 days ago

indeed on the old arch still (thanks stripe) but glad to see it's already on watchlist. Thanks and amazing work !

vrondak.is•51 days ago

What's the magic? Very surprised you're able to beat FlashList with reanimated when it uses native recycler views

jayz.us•51 days ago

FlashList actually doesn't use native recycler views, it's mostly JS. It has a native component that fixes gaps caused by async layout. But the new architecture supports sync layout so we can fix the gaps with just JS 😀

vrondak.is•51 days ago

It's not based on RecylerView (on Android) it's based on RecylerListView which is a JS library 🤯 TIL. I'll check your library out!,

frankcalise.dev•51 days ago

I've seen first commits take incredibly long on overly complex list items but then future ones be way quicker.

Does that scream anything obvious to you to check into? Are there different prop configurations I need to try?

Refactoring complexity is on the list but looking for other short term wins

jayz.us•51 days ago

It could be an effect of the recycling, future re-renders would be able to reuse some of the native views? How long is incredibly long though?

frankcalise.dev•51 days ago

2000ms, followed by a bunch in the 20-30ms range (<=16ms ones are hidden)

jayz.us•51 days ago

Oh wow, that must be a really complex item component! I haven't seen anything like that 😱

frankcalise.dev•51 days ago

Yeah client work is scary stuff lol

tazsingh.com•50 days ago

Super dope dude 🙌

Btw I did try it on Web a week or two ago, and it was like 90% workable. I forget what that last 10% was but happy to pair up on Web compat if you like

Also, does this work with SectionList et al? I've been recommending LegendList to everyone for ages and folks asked me this!

jayz.us•50 days ago

Are there features that are missing in order to make SectionList work? You could just render a different component based on whether it's a heading or item? But that would throw off recycling and be less performant...

jayz.us•50 days ago

Adding a getItemType is high on the todo list. Once we have that I think we could make a SectionList component which just wraps around that? And we'd want sticky headers too, also on the todo list.

tazsingh.com•50 days ago

Yeah sticky headers are the main thing 💯

jayz.us•50 days ago

Pairing up on web compat sounds great! I'm planning to do a very different implementation for React DOM, which could potentially work in RNW too? But it may take a while to finish all that... So a quick win of making the current implementation work better would be awesome.

tazsingh.com•50 days ago

Ah kk good to know

As long as the API is the same, everything onwards should work on RNW/DOM interchangeably

But yeah can give it another go. Will DM you about it when I do that!

jayz.us•50 days ago

Sounds good, let me know! Btw I'll be in London in June 😀. Or maybe see you before then at App.js?

tazsingh.com•50 days ago

Very much want to be at App.js but might have to head to Toronto. Will be in Krakow very last minute if I am!

Definitely let me know when you're in London as always! I'll be away for the 2nd half of June, hope to catch you during the 1st half 🙂

jayz.us•50 days ago

Will do!

Comments

Posting Rules

Reply