I have also read some corresponding articles about server-side rendering. It seems that some frameworks are initialized on the node side. But I'm thinking that the general front-end framework must involve DOM, but the server must not have DOM operations. What I want to ask is:
1. What problem does the so-called server-side rendering solve?
2. How was the seo problem solved?
3. What are the current solutions to the low first-screen performance of spa applications?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Regarding the server-side rendering of react, let me briefly talk about my understanding:
The biggest one should be to solve the SEO problem, and the second one is to speed up client rendering.
server-side-rendering(SSR) To put it simply, it calls
ReactDOM.renderToStringthis method, renders the component in a js context on the server side, and then returns the html tag. In this way, when the client side react runs, through react The virtual DOM is incrementally updated by comparing the react-id, that is, if there is no update to the client on a certain DOM, the result of the server is directly obtained, so the rendering speed of the client is accelerated to a certain extent.Second is seo. Because the server directly returns the html tag, even a crawler will return the real seo tag. This is very useful for some portals. In this way, search engine crawlers can crawl to the key information of the website, which will help the website ranking.
In terms of SSR performance, the general solution seems to be through cache. There are some projects on github, such as electron-react-ssr-caching
react-ssr-optimization. These projects optimize SSR through cache. In essence, they are By comparing props, cache will speed up the next rendering.