Curious about this one (coming from mobile web perspective crappy cpu, high latency).
Render the page with node / serve html / React calls its render functions? / something else ? How does it bind to the already existing dom without building it? do all the render()s have to be called twice (once on server, once on client)?
Hey, I built this feature and was super stoked about it :)
First of all, we haven't released the official server rendering stuff yet, since the API still needs to be cleaned up. But it's a total of 20 lines or so, so I'll likely post an example soon :)
So React has a very low degree of coupling to the browser. Specifically it has two phases:
1. Generate the HTML markup, giving each DOM node a unique ID
2. Attach top-level event handlers. When an event fires we look at the target ID to figure out which component to bubble to (we have normalized, cross-browser bubbling and capturing built into our synthetic event system).
In client-rendered apps we run both of these on the client. For server rendered apps, we initialize and only generate markup on the server and send it down. Then on the client we re-initialize, but notice that the markup is there so we just attach event handlers.
This system enabled us to build a prototype a while back that ran React entirely in a web worker, but we haven't had time to productionize that yet.
Curious about this one (coming from mobile web perspective crappy cpu, high latency).
Render the page with node / serve html / React calls its render functions? / something else ? How does it bind to the already existing dom without building it? do all the render()s have to be called twice (once on server, once on client)?
Any info would be appreciated.