[Front-end learning Vue (8) what is SSR]

1. What is SSR

SSR means 服务端渲染that Vue renders the work on the client side 标签on HTMLthe server side, and then sends it html直接返回to the client side.

The advantages and disadvantages of server-side rendering SSR are as follows:

(1) Advantages of server-side rendering:

• Better SEO : Because the content of the SPA page is obtained through Ajax, and the search engine crawler will not wait for the asynchronous completion of Ajax before crawling the content of the page, so the page is obtained in SPAin returned by page (the data is already included in the page), so search engine crawlers can crawl the rendered page;抓取不到Ajax内容SSR服务端已经渲染好

• Faster content arrival time (faster loading of the first screen): SPAIt will take a certain amount of time to process 等待all Vue compiled jsfiles 都下载完成后, 才开始page 渲染, file download, etc., so the first screen rendering takes a certain amount of time; SSR is directly rendered by the server Good pages are directly returned to display, without waiting for downloading js files and then rendering, so SSR has a faster content arrival time;

(2) Disadvantages of server-side rendering:

• More development constraints : For example, server-side rendering only supports beforCreateand createdtwo hook functions, which will cause some external extension libraries to require special handling to run in server-side rendering applications; and can be deployed on any static file server Different from the fully static single-page application SPA, the server-side rendering application needs to be in the Node.js server operating environment;

• More server load : Rendering a full application in Node.js is obviously more CPU-intensive (CPU-intensive - CPU-intensive) than a server that just serves static files, so if you expect to be in a high-traffic environment ( high traffic ), prepare for server load accordingly, and use caching strategies judiciously.