简介
web网站在供应http页面访问做事时可以分为后端渲染和前端渲染两种。
支持SEO的常日是后端渲染,由于搜索引擎在爬虫访问网页时须要及时获取网页内容进行内容抓取。

如果是一个前端渲染的页面,则内容须要在加载动态js并实行完脚本(如要求后端捞取数据)才能渲染出来,这对搜索引擎很不友好。
听说google的spider已经可以识别某些前端渲染的页面,一样平常来讲要想支持SEO还是后端渲染比较好。
后端渲染
在后端渲染(SSR:server side render)中,html是由后端做事器利用模板+变量数据的办法,用模板引擎渲染出来,如jsp里利用velocity,spring mvc里利用thymeleaf,django里的模板变量等。
优点:
页面访问效率高,数据在要求页面时就已经渲染好,方便做token验证
缺陷:
前后端耦合,不利于前端同学和后端同学独立开拓。比如jsp、thymeleaf的页面都放在后端,页面变量、css、动态逻辑都写在了页面里,如果前端同学想对页面进行美化切实其实是灾害。
前端渲染
用户访问页面先获取一个固定的页面,然后由js访问后端数据在前端进行数据渲染。如今非常火的react、vue、angular都是前端渲染框架,运行在browser端。
优点:
前后端耦合,方便独立开拓,前端框架技能选型自由
缺陷:
页面展示效率低,不支持SEO。
技能选型
前端开拓当然是利用react、vue等技能要好,但是不支持SEO,好纠结。
如果利用jsp、thymleaf、django等技能又太过古老,前后端耦合的非常严重。
笔者经由各种考试测验终极选用的是next.js,一个基于react的后端渲染框架,可以利用react开拓支持SEO的网站了。
next.js
Next.js 是一个轻量级的 React 做事端渲染运用框架,基于node可以快速创建运用,集成干系框架(koa、semantic、antd等)非常随意马虎。
官网:https://nextjs.org
文档:https://nextjs.org/docs/
文章链接:https://www.lvbby.com/p/md/1811101117442551cd0008