Jump to content
GreenSock

React

Members
  • Posts

    4
  • Joined

  • Last visited

1 Follower

Recent Profile Visitors

1,290 profile views

React's Achievements

  • One Month Later
  • Week One Done

Recent Badges

4

Reputation

  1. I don't think we'd need to remove the part, but maybe mention the caveat that any "from" state that doesn't match the server side rendered HTML/CSS content will still have the blink problem during JS being downloaded, parsed and run and React hydration. However, I do think this is a pretty common case rather than an edge case.
  2. I think the last section of `useIsomorphicLayoutEffect` only avoids the warning but does not actually fix the problem, because the rendering and hydration process of a server side rendered or static generated page would go like this: The HTML/CSS content is downloaded and displayed with normal opacity The JS is then downloaded and parsed, and React would kick in and start the hydration, which would run the layout effect to set the opacity to 0 And then lastly the animation of opacity from 0 to 1 would run, but only after the content already showed and blinked In conclusion, `useLayoutEffect` would only avoid the "blink" for subsequent rendering when React is hydrated, but not when the content is from the rendered/generated HTML before the React hydration. (Sometimes people could think this works because the whole process happens very quickly, but in my opinion it's a real problem.)
×