Beyond Virtual Lists: How to Render 100K Items with 100s of Updates/sec in React-Michel Weststrate

22:37 122 views 100% Published 4 weeks ago

React Advanced 2021 ##ReactAdvanced #GitNation
Website – https://reactadvanced.com/

Follow the link to watch the full version of all the conference talks, QnA’s with speakers and hands-on workshop recordings → https://portal.gitnation.org/events/react-advanced-conference-2021

Talk: Beyond Virtual Lists: How to Render 100K Items with 100s of Updates/sec in React
There is generally a good understanding on how to render large (say, 100K items) datasets using virtual lists, …if they remain largely static. But what if new entries are being added or updated at a rate of hundreds per second? And what if the user should be able to filter and sort them freely? How can we stay responsive in such scenarios? In this talk we discuss how Flipper introduced map-reduce inspired FSRW transformations to handle such scenarios gracefully. By applying the techniques introduced in this talk Flipper frame rates increased at least 10-fold and we hope to open source this approach soon.


This event would not take place without the support of sponsors:

🏆 Platinum Sponsors
Toptal → https://www.toptal.com/freelance-jobs
The Graph → https://thegraph.com/en/
Focus Reactive → https://focusreactive.com/

🥇 Gold Sponsors
StackHawk → https://www.stackhawk.com/
Sanity → https://www.sanity.io
Kontent by Kentico → https://kontent.ai/
Sourcegraph → https://about.sourcegraph.com/
Shopify → https://shopify.engineering/
Ionic → https://ionicframework.com/
JetBrains → https://www.jetbrains.com/
Progress KendoReact → https://www.telerik.com/kendo-react-ui/
Sentry → https://sentry.io/
Snyk → https://snyk.io/
Neuralegion→ https://www.neuralegion.com/

🥈 Silver Sponsors
Stream → https://getstream.io/
CodeSandbox → https://codesandbox.io/
Smarkets → https://smarkets.com/about/
3T → https://studio3t.com/
Modus Create → https://moduscreate.com/
Theodo → https://www.theodo.co.uk/
Commercetools → https://commercetools.com/
Strapi → https://strapi.io/
MUX → https://mux.com/
Callstack → https://callstack.com/
hackajob → https://hackajob.co/talent
Hasura → https://hasura.io/
twilio → https://twilio.com/ahoy/
zeroheight → http://www.zeroheight.com/



Watch on YouTube