>"In React 19, we’re adding support for rendering document metadata tags in components natively:
function BlogPost({post}) {
return (
<article>
<h1>{post.title}</h1>
<title>{post.title}</title>
<meta name="author" content="Josh" />
<link rel="author" href="https://twitter.com/joshcstory/" />
<meta name="keywords" content={post.keywords} />
<p>Eee equals em-see-squared...</p>
</article>
);
}
When React 19 renders this component, it will see the <title> <link> and <meta> tags, and automatically hoist them to the <head> section of document."
This is one of the most brutally stupid things I've ever seen, and has pretty much sealed the deal on me dumping React at this point.
Why? It fixes a serious pain point React has had necessitating things like the helmet library. This seems like a perfectly reasonable of way of doing it.
It completely breaks the React paradigm of a single mount point that handles DOM concerns, and introduces god knows what kind of global side effects. The beauty of a React component was that they could be treated as fully self contained little bits of UI. This is basically taking us back to jQuery.
While that’s basically what all this stuff really does under the covers, it doesn’t feel “react-y” to me.
Using JSX does. Especially for stuff like meta tags where there can be a couple in force at once.
I’m not going to argue it’s perfect but it seems like it fits in to me. It’s basically acting like the restrictions on where the title and meta tags can go no longer apply so you can just sprinkle them wherever they hopefully belong in your app. And react takes care of putting them in the right spot.
> Very little of what react does seems reasonable to me though.
So are you someone who dislikes it in general and just using this as one more argument?
I’d be very curious to see the opinion of someone who likes react who thinks this is a bad idea.
>I’d be very curious to see the opinion of someone who likes react who thinks this is a bad idea.
I love(d) React to death from day one, and I've been using it every day professionally as a front end dev since 2016. This is precisely why the feature upset me so much. As another commenter said, they are clearly jumping the shark here. How exactly will this even work? Does this mean that every single render of every single component now has to tree shake the VDOM for <title> and <meta> tags? And now I'm encouraged to spread these things out all over my app instead of handling them centrally? Again, brutally stupid.
