gaearon / gaearon/react-side-effect

Exposing length of mountedInstances to properly hydrate the client

Open
#34 4 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
1.2k
Forks
74
PR merge metrics
No merged PRs in 30d

Description

I'm attempting to fix this Helmet issue (https://github.com/nfl/react-helmet/issues/149) and had the idea of making the client wait until all instances are mounted before allowing `handleStateChangeOnClient` to change the DOM. Then on the first render of the client (after SSR), it would only do one client state change which would match the server rendered side effects and thus would leave all the side effects intact. In order to "hydrate" the client like this, I'd need to pass along the number of mounted instances so that the client knows how many components to wait for. I can certainly add a `mountedInstances` inside of Helmet, but I felt it would be better to perhaps expose this from `react-side-effect` instead and not duplicate functionality.

I can certainly offer a PR here as well. Please let me know. Thanks!

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by locating the react-side-effect implementation of mountedInstances and handleStateChangeOnClient, then review how SSR and client hydration are handled. Done means exposing the mounted-instance count so a client can wait for all instances before its initial DOM state change; no files or tests are named in the issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.