为什么要SSR
单页应用将UI层和内容都由javascript来渲染,搜索引擎或网页爬虫需要完成的HTML结构,因此单页应用如果只在客户端渲染,不利于SEO,此外尽管我们可以通过按需加载的形式来减少首页加载的js,但是通过js来渲染DOM的时候还是会有一定的时间延迟。
0.前言
服务端渲染在项目中不是刚需的东西,但有的时候也是需要做一个服务端渲染,项目要做服务端渲染当然是有很多好处的
- 首屏加载快,相比SPA单页应用还要有优势。
- SEO 优化 利于爬虫,爬取数据。
1. 简介
服务端渲染是指页面的渲染和生成是在服务端完成的,并将渲染好的页面返回客户端。
2. 安装
安装的时候版本都是最新版,而新的版本很多方法和API有弃用和更新的,导致最后项目无法运行。
npm install --save-dev koanpm install --save-dev babel-corenpm install --save-dev babel-polyfillnpm install --save-dev babel-preset-latest-nodenpm install --save-dev babel-preset-stage-2npm install --save-dev babel-preset-react# oryarn add -dev koayarn add -dev babel-coreyarn add -dev babel-polyfillyarn add -dev babel-preset-latest-nodeyarn add -dev babel-preset-stage-2yarn add -dev babel-preset-react3.配置
安装完成后写一个启动文件 start.js:
在写一个入口文件index.js
执行npm start启动项目
4.结果
打开浏览器查看http://localhost:3000/
5.结束语
到这里就完成了一个简单的 React SSR,当然实现React服务端渲染还可以用别的方式,比如Next.js。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。