服务端渲染的基本原理

前后端分离和服务端渲染

众所周知, 我们的页面, 也就是我们打开的 html 文件也是存储在服务器上面,只不过我们在地址栏输入了地址以后, 会根据对应的规则找到对应的服务器,拿到这个 html 文件, 被浏览器解析显示了出来,不管 html 文件, 你所有的 图片, 视音频, css, html, js 文件其实都是存储在服务器上面的。

1.前后端分离

其实就是前端干前端的事情, 后端干后端的事情,也就是我们以前的情况,当你在地址栏输入地址的时候,服务器返回一个文件给你,当这个文件运行的时候, 通过执行内部的 js 代码,发送一个 ajax 请求,拿到对应返回的数据,把数据渲染在页面上。

2.服务端渲染

其实就是在服务端把所有的事情做完, 直接把结果给到前端,刚才我们说了, 页面等所有文件其实都是存储在服务器上面的。当你在地址栏输入地址以后,服务器会找到你需要的 html 文件, 但是先不给你,然后去找到当前这个文件内所需要的数据内容,然后, 把数据内容组装成一个 html 结构插入到页面内,然后把插入好数据的页面直接返回给你。

区别

1.数据渲染
前后端分离 : 后端把数据返回给客户端, 在客户端运算渲染出来
服务端渲染 : 后端把数据直接渲染在了 html 文件上, 把渲染好的文件给你

2.源文件
前后端分离 : 你得到的 html 源文件是没有对应的渲染内容的, 需要依靠执行 js 渲染
服务端渲染 : 你得到的 html 源文件就是所有数据都书写好的文件

3.页面加载速度
前后端分离 : 得到 html 页面以后, 还需要等待 ajax 请求数据再进行渲染
服务端渲染 : 得到的 html 就是完整的最终页面, 直接展示即可

4.SEO
前后端分离 : 因为页面没有结构, 所以不利于搜索引擎抓取
服务端渲染 : 得到的 html 就是完整内容, 搜索引擎可以抓取到所有内容

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容