前端渲染与后端渲染之间的区别?

前端没兴起之前,网页的展示大都是后端渲染,也就是服务器渲染。
随着前端行业的发展,前端的工作越来越精细。前后端开始分离,前端只关注ui渲染。后端只提供数据和进行逻辑处理。
简单的解释,前端写好html模板,让后端直接填数据,这就是后端渲染。
前端渲染是,通过ajax请求接口返回的数据,将数据渲染出来。后端只写接口,分工更明细。

前端渲染:

指的是后端返回JSON数据,前端利用预先写的html模板,循环读取JSON数据,拼接字符串(es6的模板字符串特性大大减少了拼接字符串的的成本),并插入页面。

好处:网络传输数据量小。不占用服务端运算资源(解析模板),模板在前端(很有可能仅部分在前端),改结构变交互都前端自己来了,改完自己调就行。

坏处:前端耗时较多,对前端工作人员水平要求相对较高。前端代码较多,因为部分以前在后台处理的交互逻辑交给了前端处理。占用少部分客户端运算资源用于解析模板。

后端渲染:

前端请求,后端用后台模板引擎直接生成html,前端接受到数据之后,直接插入页面。

好处:前端耗时少,即减少了首屏时间,模板统一在后端。前端(相对)省事,不占用客户端运算资源(解析模板)

坏处:占用服务器资源。

 

前端渲染与后端渲染对比:

后端渲染:</

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/358454.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

比较中的Commons VFS,SSHJ和JSch

几周前&#xff0c;我评估了一些用于Java的SSH库。 对它们的主要要求是在远程计算机上进行文件传输和文件操作。 因此&#xff0c;它存在一个基于SSH&#xff0c;SSH文件传输协议&#xff08;或SFTP&#xff09;的网络协议。 因此&#xff0c;我需要一个支持SFTP的SSH库。 一项…

Android自定义xml解析

<?xml version"1.0" encoding"utf-8"?> <resources><Users><User name"jason" age"12" location"Beijing"/><User name"peter" age"18" location"Shanghai"/&g…

前端常见的安全性问题有哪些?

安全性 前端安全问题有哪些? XSS 跨站请求攻击XSRF 跨站请求伪造上边这两个问题,前端也只是辅助,主要还是靠后端XSS原理 在博客里可以写文章,同时偷偷插入一段<script>代码。发布博客,有人查看博客内容打开博客时,就会执行插入的js攻击代码在攻击代码中,获取cook…

(fofa信息收集骚操作)windows查看文件的md5值

1、winr 输入cmd进入控制界面 2、certutil -hashfile XXXX md5(XXXX为绝对路径) Linux下查看文件md5值&#xff1a; 进入文件目录&#xff0c;使用md5sum加文件名&#xff0c;例如md5sum test.txt 像fofa的语法里有可以查找js的md5值&#xff0c;这样就可以收集到更多信息了&…

教你读懂Ajax的工作原理

Ajax的工作原理 1、ajax技术的背景 不可否认,ajax技术的流行得益于google的大力推广,正是由于google earth、google suggest以及gmail等对ajax技术的广泛应用,催生了ajax的流行。而这也让微软感到无比的尴尬,因为早在97年,微软便已经发明了ajax中的关键技术,并且在99年I…

二叉树性质及遍历

一、二叉树的定义 树的每个结点至多只有二棵子树(不存在度大于2的结点)&#xff0c;树的子树有左右之分&#xff0c;次序不能颠倒。 二、二叉树的性质 (1) 在非空二叉树中&#xff0c;第i层的结点总数不超过, i>1&#xff1b;(2) 深度为h的二叉树最多有个结点(h>1)&#…

利用最新Apache解析漏洞(CVE-2017-15715)绕过上传黑名单

目标环境&#xff1a; 比如&#xff0c;目标存在一个上传的逻辑&#xff1a; <?php if(isset($_FILES[file])) {$name basename($_POST[name]);$ext pathinfo($name,PATHINFO_EXTENSION);if(in_array($ext, [php, php3, php4, php5, phtml, pht])) {exit(bad file);}mo…

将数据压缩到数据结构中

这个故事是关于我们最近在Plumbr进行的容量优化任务。 一切始于将无害的要求添加到现有组合中。 如您所知&#xff0c;Plumbr监视解决方案作为连接到服务器的Java代理分发。 只需少量添加即可跟踪一段时间内所有已连接的代理&#xff0c;以便可以实时回答以下问题&#xff1a;…

程序员面试需要注意的问题

今天给朋友带来的是找一份工作的流程详细介绍&#xff0c;以及期间所需要注意的东西&#xff0c;其中包括&#xff1a; 简历&#xff08;附带写简历的注意事项&#xff09;笔试&#xff08;附带笔试题详细介绍的链接&#xff09;电话面试(附带常见的面试题)面试&#xff08;详…

CVE-2017-15715漏洞复现

复现环境 docke apache 2.4.0到2.4.29即可 php5.5 复现过程 先在物理机上创建目录 mkdir -p /var/www/html 然后创建个容器&#xff0c;并关联物理机的/var/www/html目录 docker run -d -v /var/www/html:/var/www/html -p 8080:80 --name apache php:5.5-apache 再把物理机的/…

Linux网络流量实时监控ifstat iftop命令详解

ifstat 介绍 ifstat工具是个网络接口监测工具,比较简单看网络流量 实例 默认使用 #ifstateth0 eth1 KB/s in KB/s out KB/s in KB/s out0.07 0.20 0.00 0.000.07 0.15 0.58 0.00 默认ifstat不监控回环接口&#xff0c;…

一种移动端自适应屏幕的方法

前端移动端开发的时候肯定是会面对不同型号的手机的页面展示问题的&#xff0c;今天给大家推出另外一种自适应不同移动端的方法&#xff0c;使用vw&#xff0c;vh单位。 vw和vh单位的大小是多少&#xff1f; vw和vh是根据设备的宽度和高度来决定的&#xff0c;设备的宽就是10…

Metasploit--后渗透(一些基本操作方法)

查看主机是否运行在虚拟机上 run post/windows/gather/checkvm关闭杀毒软件 拿到目标主机的shell后第一件事就是关闭掉目标主机的杀毒软件&#xff0c;通过命令 run killav获取目标主机的详细信息 run scraper它将目标机器上的常见信息收集起来然后下载保存在本地 Meterpre…

CentOS6 下Vim安装和配置

1.系统只安装了vim-minimal&#xff0c;执行以下命令安装另外两个组件 yum install vim-common yum install vim-enhanced 2.安装ctags yum install ctags 下载linux-2.6.32.27内核源码并解压到~/arm/linux-2.6.32.27&#xff0c;进入该目录&#xff0c;生成索引文件 ctags -R …

端到端测试_端到端测试的滥用–测试技术2

端到端测试我的上一个博客是有关测试代码方法的一系列博客中的第一篇&#xff0c;概述了使用一种非常常见的模式从数据库检索地址的简单方案&#xff1a; …并描述了一种非常通用的测试技术&#xff1a; 不编写测试 &#xff0c; 而是手动进行所有操作。 今天的博客涵盖了另一…

vue全家桶指的是哪些?

vue全家桶&#xff1a; vue&#xff08;整体架构&#xff09;  vuex&#xff08;状态管理&#xff09;  vue-router&#xff08;路由&#xff09;  vue_resource || axios&#xff08;ajax请求&#xff09;  mint-UI(移动端UI框架库) || antd-vue(PC端UI框架库)

Metasploit 之生成木马(msfvenom)

msfvenom参数 相关参数介绍 -p, --payload <payload> 指定需要使用的payload(攻击荷载) -l, --list [module_type] 列出指定模块的所有可用资源,模块类型包括: payloads, encoders, nops, all -n, --nopsled <length> 为payload预先指定一个NOP滑动长度 -f, --for…

KVO 和 KVC 的区别?

KVO 和 KVC 的区别&#xff1f; key value coding ,key value observer KVC 是 路径访问的规范 KVO 观察某个变量的变化过程 它提供一种机制&#xff0c;当指定的对象的属性被修改后&#xff0c;则对象就会接受到通知。简单的说就是每次指定的被观察的对象的属性被修改…

react全家桶指的是哪些?

react全家桶&#xff1a; react&#xff08;整体架构&#xff09;  redux || mobx&#xff08;状态管理&#xff09;  react-router&#xff08;路由&#xff09;  axios&#xff08;ajax请求&#xff09;  antd || react-material || antd-model(UI框架库)

将Redis集成到您的Spring项目中

本文展示了如何通过注释配置将Redis缓存集成到您的spring项目中。 我们将从Gradle配置开始。 我们将使用jedis驱动程序。 group com.gkatzioura.spring version 1.0-SNAPSHOTapply plugin: java apply plugin: eclipse apply plugin: idea apply plugin: spring-bootbuildscr…