前端渲染与后端渲染本质上可以理解为:浏览器渲染与服务器渲染
备注:以下纯属本人个人的一些总结与看法,如有异同,欢迎大家指教;
渲染的本质:字符串的拼接,将数据渲染进固定格式的html代码中,形成最终的html显示在用户页面上。
对比:
1.前端渲染(数据传回前端显示)---- 填
优点:不占用服务器运算资源(解析模板)
弊端:占用客户端运算资源,
2.后端渲染(1.后端配置模板 2.数据渲染并返回) ---- 吐/喷
优点:模板统一在后端,前端省事,不占用客户端运算资源(解析模板)
弊端:占用服务器运算资源,请求的数据量偏大,前端的交互样式更改需要联动修改
3.jQuery的html,append等方法
实现:直接插入DOM节点或者内容
优点:前端可控,操作DOM结构比较方便
弊端:各种字符串,DOM节点的拼接比较麻烦
最大区别:后端渲染&前端渲染区别:后端吐出拼好的hml页面
特点:
1.前端渲染:比较灵活,使用与DOM操作比较频繁或交互复杂的业务场景。不必反复请求,理论上更加符合前后端分离。 编码效率高。
2.后端渲染:相对模块化,适用于片展示型的页面,利于SEO,因为后端已经渲染好了,所以加载体验相对较好,网速差时 表现较差。编码效率较低。
从后端渲染到前端渲染,发生了什么改变?
*计算机任务的转移
原本有服务器渲染的任务交给客户端,大量用户访问时,大大减轻了后端的压力。性能大大提高,因为服务器做的事情确实减 少了。而且随着客户端硬件的发展,也能处理好多数的渲染任务。
*放弃前端权限
将页面整个的UI逻辑交给客户端的话,一些有经验的用户可能会看到一些本不该看到的页面,违反了安全原则。所以后端不能 轻信从前端传来的数据,一定要做好过滤与验证。
结语
前端渲染与后端渲染的选择,更多的是要看业务场景。