1. Server-side rendering is done in your original background. Return the html string to the react front-end, and the react front-end is responsible for the display.
2. I think it is usually maintained by one person, even if It doesn't matter if two people maintain it. Co-work is part of the job, so don't worry.
3. Add a little bit about the difference between client-side rendering and server-side rendering (client-side rendering vs server-side rendering)
Lantency(delay) The first loading of server-side rendering will be very fast, because there is no need to request js, css and data like client-side rendering, and then assemble and display them. Server-side rendering directly strings the html to the front end. But when the page data is partially updated or subcomponents need to be re-rendered, server-side rendering will be much slower, because you have to initiate a network request, re-generate most or all of the updated HTML string on the server, and then return it to the client. . But for client-side rendering, it only needs to be partially re-updated.
SEO(Search Engine Optimization) Client-rendered pages are not friendly to search engines. Search engines usually only see the html of the page and will not execute js. When the page rendered by the client returns only an html template, the real content must be filled in by executing js, which is not friendly to search engines. Of course, there are solutions (PhantomJS I will note the introduction and reasons of PhantomJS later) , but this will only increase the complexity of your program and is not recommended. For server-side rendering, the complete HTML string has been generated by the server, which is conducive to search engine analysis.
Browser Concept and Issues (browser concepts and issues) Server-side rendering ensures the definition of pages are documents. The client requests the page document through the URL. You should get the text of the document, not a program and then execute it on the front end. . There is also the issue of browser compatibility. The more operations the client renders to the browser, the greater the possibility of compatibility problems.
Note: PhantomJSIntroduction
PhantomJS is a headless browser
PhantomJS can solve the problem of client-side rendering being unfriendly to search engines. It can pre-render HTML/JavaScript/CSS before the data is returned to the client. This means that when the page is loaded, all The initialized js has been executed.
Since it can solve the problem of client-side rendering being unfriendly to search engines, why not use it?
Main reasons:
If you start an PhantomJS instance for each request, then if the search engine crawls multiple pages at the same time, the performance of your machine will be affected;
PhantomJS is running an old version of js;
Difficulty debugging;
To put it bluntly, the cost of introduction is too high and not worth it! ! ! !
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
1. Server-side rendering is done in your original background. Return the html string to the react front-end, and the react front-end is responsible for the display.
2. I think it is usually maintained by one person, even if It doesn't matter if two people maintain it. Co-work is part of the job, so don't worry.
3. Add a little bit about the difference between client-side rendering and server-side rendering (client-side rendering vs server-side rendering)
Lantency(delay) The first loading of server-side rendering will be very fast, because there is no need to request js, css and data like client-side rendering, and then assemble and display them. Server-side rendering directly strings the html to the front end. But when the page data is partially updated or subcomponents need to be re-rendered, server-side rendering will be much slower, because you have to initiate a network request, re-generate most or all of the updated HTML string on the server, and then return it to the client. . But for client-side rendering, it only needs to be partially re-updated.SEO(Search Engine Optimization) Client-rendered pages are not friendly to search engines. Search engines usually only see the html of the page and will not execute js. When the page rendered by the client returns only an html template, the real content must be filled in by executing js, which is not friendly to search engines. Of course, there are solutions (PhantomJSI will note the introduction and reasons of PhantomJS later) , but this will only increase the complexity of your program and is not recommended. For server-side rendering, the complete HTML string has been generated by the server, which is conducive to search engine analysis.Browser Concept and Issues(browser concepts and issues) Server-side rendering ensures the definition ofpages are documents. The client requests the page document through the URL. You should get the text of the document, not a program and then execute it on the front end. . There is also the issue of browser compatibility. The more operations the client renders to the browser, the greater the possibility of compatibility problems.Note:
PhantomJSIntroductionPhantomJSis a headless browserPhantomJScan solve the problem of client-side rendering being unfriendly to search engines. It can pre-renderHTML/JavaScript/CSSbefore the data is returned to the client. This means that when the page is loaded, all The initialized js has been executed.Since it can solve the problem of client-side rendering being unfriendly to search engines, why not use it?
Main reasons:
If you start an
PhantomJSinstance for each request, then if the search engine crawls multiple pages at the same time, the performance of your machine will be affected;PhantomJSis running an old version of js;Difficulty debugging;
To put it bluntly, the cost of introduction is too high and not worth it! ! ! !