Main thread is locked up during bootup
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 38.9k
- Forks
- 2.3k
- Avg merge
- 20h 18m
- Merged PRs (30d)
- 35
Description
Heya!
So I've got a sample app which sort of resembles a news article with user comments. When I have -- say -- 500 comments (<Comment/>), each with up-vote and down-vote buttons (<VoteButtons/>) I see the boot up on a Nexus 5X take somewhere in the region of 500ms:

What I'd like to do instead is make use of requestIdleCallback to spread the load out a bit. I'm fine with the SSR code making the buttons and so on inert (as in, I can handle that separately) but I'm mostly concerned that there doesn't seem to be any way to spread out the initial diff and so on into smaller chunks. On an older phone that's likely to be a few seconds of main thread lock-out where someone wouldn't be able to scroll or interact in any way.
I had a quick look over the source, and I see there's an ASYNC_RENDER flag (which looks stellar because I can hook in rIC there via options.debounceRendering), but it seems like that only applies for updates rather than the initial create-this-from-the-DOM boot that I get with SSR.... well, I imagine it applies to all initial renders it's just that the diff'ing done from the SSR'd version looks to be causing some slowdown.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by tracing the initial SSR boot and DOM diff path, then compare it with the ASYNC_RENDER and options.debounceRendering paths mentioned in the issue. Determine whether initial hydration can be split into smaller scheduled units, and verify the result with the 500-comment sample while preserving the existing SSR behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, performance
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100