SPA场景下问题
SEO
通常情况下,SPA应用或前后端分离的开发模式下页面加载的基本流程是,浏览器端先加载一个空页面和JavaScript脚本,然后异步请求接口获取数据,渲染页面数据内容后展示给用户。那么问题来了,搜索引擎抓取页面解析该页面HTML中关键字、描述或其他内容时,JavaScript尚未调用执行,搜索引擎获取到的仅仅是一个空页面,所以无法获取页面上中的具体内容,这就比较影响搜索引擎收录页面的内容排行了。尽管我们会在空页面的里面添加keyword和description的内容,但这肯定是不够的,因为页面关键性的正文内容描述并没有被搜索引擎获取到。
如果使用后端数据渲染,在页面请求时将内容渲染到页面上输出,那么搜索引擎获取到的HTML就已经包含页面完整的内容,页面也就更容易被检索到了。
首屏渲染慢
在前后端分离的开发模式下页面在JavaScript执行渲染之前是空白的,用户在看到数据时已经花费的网络等待时间:
DOM下载时间+DOM解析时间+JS文件请求时间+JS文件执行时间+请求后台接口+DOM渲染
SPA(单页面应用)
SPA优点
Spa的优点 1.更好的用户体验,让用户在web感受natvie的速度和流畅; 2.经典MVC开发模式,前后端各负其责。 3.一套Server API,多端使用(web、移动APP等)。 4.重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交
Spa的缺点 1.对搜索引擎不友好,SPA将视图的渲染从Server交给了浏览器,Server只提供JSON格式内容。而搜索引擎抓取的内容,需要有完整的HTML和内容。 2.需要一次性加载所有js、css首屏渲染慢
Elasticsearch
Elasticsearch是个开源分布式搜索引擎,提供搜集、分析、存储数据三大功能。它的特点有:分布式,零配置,自动发现,索引自动分片,索引副本机制,restful风格接口,多数据源,自动搜索负载等。