Description
Do you want to request a feature or report a bug?
Bug / Feature
What is the current behavior?
Using new React v16-beta.1 for server-rendering, I'm using the regular react-dom/server
package and the method renderToString()
.
The HTML / DOM output which is created has a root element with an attribute data-reactroot=""
and all elements with the attribute data-reactid=""
. Having this on every single HTML element ends up consuming a lot of bytes on large pages and it seems like it potentially might not be necessary with the new client re-hydration? Or could at least be reduced in size since it appears that they serve no real purpose besides being a binary marker at this point?
To quote from the beta release notes:
Server rendering does not use markup validation anymore, and instead tries its best to attach to existing DOM, warning about inconsistencies.
I see there is a new streaming server-renderer under react-dom/node-stream
as well which I haven't managed to take a look at yet. But I expect these two methods of rendering to have the same output.
Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
Node.js v8.2.0 - React v16-beta.1
EDIT: Just to quickly illustrate what I'm talking about better:
That's 16 extra characters in each HTML element rendered by React. Just in this very small example app, that's 16 * 53 = 848 characters.