1.SPA页面的存在的缺点
1.首屏加载速度慢
出现这样的原因是因为对于spa页面的应用我们的客户端浏览器开始请求网站网址的时候,最开始只是从服务端下载下来一个index.html文件,然而这个文件通常只是包含了一个body标签和一个div id='root'类似这样的标签。
浏览器还需要下载其他的html,css,js文件然后在浏览器上面先执行这些文件,帮他们执行完之后才会解析生成对应的我们想要看到的页面,这一系列操作完成之后才会展示页面所以会导致首页加载慢。
2.SEO优化,搜索引擎优化问题
同样的原理当浏览器进行网站数据爬取的时候一般情况下也只是进行下载网站的index.html文件进行解析,但是由于index.html文件中存在的内容信息比较少,就会导致搜索引擎爬取到的信息比较少,搜索引擎对于本网站的收录的信息比较少从而影响到网站在浏览器中的排名,收录的信息越少,排名越靠后。
2.SSR服务端渲染的优点和原理
1.服务端渲染的优点
优点对应上面SPA页面的确定就是,首屏加载速度快,SEO优化好。
首先因为SSR的渲染是在服务端进行提前将spr页面的数据文件下载下来进行组合渲染好的,所以当我们进行网站请求的时候就是直接请求到的是通过node服务端渲染组装好的网页,而不需要客户端的浏览器再去进行index.html ,css,js等等文件的下载和浏览器执行和拼接,而是直接渲染组合好的页面。也就是相当于省去了浏览器执行和渲染的过程,而是将这一步给到了node服务端帮我们提前完成,从而达到首屏加载速度的提升。
同样node服务端是将一个拼接组合好的页面返回给客户端的,在搜索引擎进行爬取网站数据的时候也是直接得到的是一个完整的网页的数据,就可以收录更多的关于本网站的信息,从而提升本网站在搜索引擎的排名。
2.SSR原理
SSR渲染的原理就是通过将spa页面设置为同构应用,然后先在node服务器端将spa页面的数据请求下来,然后在node端进行执行文件的js文件和html等文件,提前将文件执行完拼接出来一个完整页面的静态的页面,当客户端请求的时候直接将完整的页面发送到客户端即可。
但是需要注意的是node端只是渲染出来的是一个静态的页面,还需要浏览器端进行js文件的执行然后将事件等注入到服务端渲染出来的页面当中。