最近在想有些东西、网站能被搜索得到,有的为什么搜索不到?这是怎么回事?然后慢慢的就找到了这三个概念,下面是一些自我理解如有不对欢迎大家多多指正。
SEO
SEO(Search Engine Optimization),中文一般译作:搜索引擎优化
SEO是一种通过了解搜索引擎的运作规则(如何抓取网站页面,如何索引以及如何根据特定的关键字展现搜索结果排序等)来调整自己的网站,以提高该网站在搜索引擎中某些关键词的搜索结果排名。
SPA
SPA全称是 (single page application),也就是现在流行的单页面应用,通过动态地重写页面的部分与用户交互。我们常用的Vue、React就是SPA的框架。
SPA优点
- 后端程序只需要提供API,完全不用管客户端是Web界面还是说手机、小程序等
- 单页面应用是局部刷新所以页面之间的切换非常快
- 一定程度上减少了后端服务器的压力
SPA缺点
- 首屏打开速度很慢,因为用户首次加载需要先下载SPA框架及应用程序的代码,然后再渲染页面。所以会出现首次加载的时候白屏现象
- 不利于SEO, 因为在初始化的时候通过 Ajax 获取内容,抓取工具并不会等待异步完成后再行抓取页面内容。所以就难以保证我们的页面能被搜索引擎正常收录到。并且有一些搜索引擎不支持执行JS和通过AJAX获取数据,那就更不用提SEO了。
这是一个Vue写的单页面应用的首页源码搜索引擎的爬虫爬取不到关键数据。
可能有些网站不需要SEO,但是对像优快云、简书、知乎这种网站而言SEO就显得至关重要,所以SSR便登场了
SSR
SSR全称是 (Server-Side Rendering),服务器端渲染
在普通的SPA中,一般是将框架及网站页面代码发送到浏览器,然后在浏览器中生成和操作DOM(这里也是第一次访问SPA网站在同等带宽及网络延迟下比传统的在后端生成HTML发送到浏览器要更慢的主要原因),但其实也可以将SPA应用打包到服务器上,在服务器上渲染出HTML,发送到浏览器,这样的HTML页面还不具备交互能力,所以还需要与SPA框架配合,在浏览器上“混合”成可交互的应用程序。所以,只要能合理地运用SSR技术,不仅能一定程度上解决首屏慢的问题,还能获得更好的SEO。
SSR优点
- 更快的响应时间,不用等待所有的JS都下载完成,浏览器便能显示比较完整的页面了。
- 更好的SEO,我们可以将SEO的关键信息直接在后台就渲染成HTML,而保证搜索引擎的爬虫都能爬取到关键数据。
SSR缺点
- 相对于仅仅需要提供静态文件的服务器,SSR中使用的渲染程序自然会占用更多的CPU和内存资源
- 在服务器生成的页面所以,一些常用的浏览器API可能无法正常使用,比如window、docment和alert等,如果使用的话需要对运行的环境加以判断
- 开发调试会有一些麻烦,因为涉及了浏览器及服务器,对于SPA的一些组件的生命周期的管理会变得复杂
- 可能会由于某些因素导致服务器端渲染的结果与浏览器端的结果不一致。
大家可以看看知乎的源码他所有的标题什么都能在源码里看到所以保证了搜索引擎的爬虫都能爬取到关键数据。