SSR和SEO是什么

544 阅读2分钟

SSR( Server-Side Rendering 简写) Server-Side: 服务器端   Rendering:渲染

工作原理:

当浏览器请求一个url的时候,服务器端将首屏幕页面内所有的异步请求数据填充完成后的完整html页面,返回给前端的过程。SSR是一份代码运行在两个环境里面:服务端、客户端。首屏请求的时候,服务端将模板+异步数据,渲染成html页面,返回给前端,前端在载入js文件,完成激活,后续操作就是SPA(单页web应用,主要值vue项目)了。只有一个首屏是服务端渲染的且有数据的html,首屏只需要渲染一个页面,后续激活SPA是发生在浏览器的,不需要在服务端操作,所以解决了首屏渲染问题,同时又能保持SPA的优势。

 

SSR服务端渲染作用:

SEO是一种通过了解搜索引擎的运作规则(如何抓取网站页面,如何索引以及如何根据特定的关键字展现搜索结果排序等)来调整网站,以提高该网站在搜索引擎中某些关键词的搜索结果排名。

我们之前说SPA单页面应用,通过AJAX获取数据,这就难保证我们的页面能被搜索引擎正常收到,并且有一些搜索引擎不支持执行js和通过ajax获取数据,那就更不用提SEO了。为了解决这个问题,,SSR登场了

 

SEO:搜索引擎的优化

1. 更好的SEO

SPA页面的内容是Ajax获取,二搜索引擎爬取工具并不会等待Ajax异步完成后在进行爬取页面内容,所以在SPA页面是抓取不到页面通过Ajax获取的内容。爬虫获取的html,是一个没有数据的空壳子。而SSR,是服务端直接将数据处理好了,在拼接组装好,返回一个已经渲染好的页面(数据已经包含在页面里),所以爬虫可以爬取渲染好的页面。

2. 首屏渲染更快

SPA页面中,需要等所有的Vue编译后的js文件全部下载完毕之后,才开始进行页面渲染,文件下载需要一定的时间,所以首屏渲染需要一定的时间。SSR直接在服务端渲染好页面在返回显示,不需要等待下载js文件之后再去渲染,所以SSR能解决SPA页面首屏渲染时间太长的问题。