Replies: 3 comments 1 reply
-
|
Because Remix is a web framework, not necessarily a React framework. They literally give you control over the request entry point as well as the full document. They see this as a selling point, not a weakness. A lot of existing libraries assume a Next type workflow and have gotten away from web standards. Remix is still relatively new so the ecosystem will eventually catch up as developers learn new ways of building web apps. |
Beta Was this translation helpful? Give feedback.
-
|
I don't understand this reply. Gatsby and Next both output the entire document, just they only hydrate React on a sub-div. How does this violate web standards, or in any way detract from being a web framework? |
Beta Was this translation helpful? Give feedback.
-
|
As Next.js is planning to force this on developers in 13 with the Presently I am experimenting with using It sure would be nice to have a way to get the stuff Remix wants to put in the head though! |
Beta Was this translation helpful? Give feedback.
-
|
I wonder about that too cause this design makes hydration errors easier. |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
Remix/React taking control of the entire document (by default!), not just a
divin the body, isn't something you would usually expect from a framework. For example, Next.js and Gatsby both scope React to abody>.__next/body>.__gatsbyelement, only placing scripts and prefetch links outside of it. Crucially, not taking control of the<Head>allows for far greater flexibility and less insanity when using libraries such as CSS-in-JS solutions, which often rely on the fact that the head isn't commonly modified. The current, official Remix example for using emotion renders over 50 times a second because of the added logical complexity of re-applying styles when Remix yanks out and replaces the entire document (#2261). This ends up in a terrible developer and user experience.In a project, I've scoped Remix/React to a body child, with no errors, warnings or other worrisome issues during testing. Catch/Error boundaries work perfectly fine. I'm not happy that the
<script>and<link rel="moduleprefetch" />tags are now also nested inside that div because Remix doesn't expose another way to get to them, but at least it wasn't an absolute nightmare to setup emotion/chakra-ui.I can see that without somehow getting React to control the
<head>, Remix's currentmeta/linkfeature doesn't work. Libraries like react-helmet have however approached this problem far more elegantly than Remix, not forcing the entiredocumentinto React and, on top of that, allowing any component/child to modify the head (unlike Remix, which basically limits all its features to routes only).Why have the Remix maintainers chosen the current approach over the industry standard? @ryanflorence @kentcdodds @jacob-ebey @mjackson @mcansh
Beta Was this translation helpful? Give feedback.
All reactions