DEV Community

60fps JS while sorting, mapping and reducing millions of records (with idle-time coroutines)

Mike Talbot ⭐ on May 24, 2020

js-coroutines GitHub I had a Eureka moment earlier after reading something very interesting on dev.to - gave me an idea - and wow did i...

Read full post

Jon Randy 🎖️ • May 24 '20

GitHub link is 404?

Mike Talbot ⭐ • May 24 '20

Sorry, late night, forgot to make the repo public...

Mike Talbot ⭐ • May 24 '20

So github is now public and I've improved the docs and included es6 version in the dist folder of the npm package.

Mike Talbot ⭐ • May 25 '20

This library has been updated to support JSON and a whole bunch of helper Async functions to make coding easier. There is more detail available in this article: dev.to/miketalbot/60fps-javascript...

Jeremy Gollehon • Jun 4 '20

Do you expect this would work with React Native?

Mike Talbot ⭐ • Jun 4 '20

I wouldn't have thought so the way it is at the moment as it relies on requestIdleCallback which is a browser thing. Though clearly it could be adapted to work in that environment either by estimating the time per frame (using whatever the RN tick is) or if RN has actually got something to tell us.

I have only dabbled in React Native - would this be useful do you think? Very happy to do a version for it if it would help?

Jeremy Gollehon • Jun 5 '20

We have a ton of data we must manipulate client side to put in charts. Parallel animations have been a challenge. Something like js-coroutines would potentially provide a much better user experience.

Mike Talbot ⭐ • Jun 5 '20

Ok cool - I looked after your comment. It appears that I can do something with the timers. I'm just not sure how much time it will need when reverting to native after the JS. But definitely looks possible. I'm excited to try if you'll find it useful. Will give it a look.

Mike Talbot ⭐ • Jun 5 '20 • Edited

Ok, it works :)

js-coroutines 2.1.40 - very recent version of React Native (but I think I've polyfilled requestIdleCallback for older versions)

Jeremy Gollehon • Jun 6 '20

Sweet! I think I'll be in a place to test this out next week. 👍

Rahul Bhanushali • May 24 '20

404 on the github link.

Mike Talbot ⭐ • May 24 '20

Now made it public - link is github.com/miketalbot/js-coroutines

Josh Reynolds • May 24 '20

This is really sweet! Might be asking for a few of us here, but do you think you could possibly delve into how this works, and how you came to these answers?

Mike Talbot ⭐ • May 24 '20

Good point, I definitely will write on that. I'm going to add JSON parsing as a coroutine and then when that's done (hopefully tomorrow) I'll write about the core principles. Should have done it at the start!