Have noticed a flash of unstyled content on every page of my app. Cannot replicate this locally. How do I go about debugging this? I am on the latest version of Remix
#hydration error and FOUC in production only
wooden shoal
dim drum
Hydration errors that only hit production are often date issues, since your local server is often the same timezone as your dev browser
wooden shoal
hmmm, its happening on pages without any date objects or dates being rendered, such as the login page
wooden shoal
Figured it out - its the Dashlane chrome extension thats causing the issues. I guess there is nothing I can do about third party extensions causing hydration issues?
dim drum
Figured it out - its the Dashlane chrome extension thats causing the issues. I g...
Not much, and they’ll affect all SSR react sites in some way, but sometimes you can mitigate it depending on where it’s modifying the dom
Next has slightly fewer of these issues because they mount to a div in the body instead of the whole document, so any extensions that modify the head don’t cause the issue
You can use remix-islands to get that behaviour but there’s a Dan Abramov comment somewhere saying that react doesn’t recommend that as a long term strategy
I tend to consider hydration issues related to extensions as something that either React core or the extension author needs to fix and not something I focus on myself