简单了解动静分离和前后端分离
⼀、前端和后端的概念(怎么区分是前端还是后端)
什么是前端? 这⼜可以分解成⼏个⼩问题。
1.JS是前端么?
2.只要⽤JS写的,都是前端么?
3.只要是前端⼯程师写的,都是前端么?
4.⼤前端就是指的⽤JS语⾔写的前端,哪怕它是运⾏在服务器那⼀端么?
5.App算前端
么? 6.Html+CSS算前端么? 7.⼩程序算前端么? 8.ReactNative算前端么?
通常情况下,我们说的前端,都是指浏览器这⼀端,浏览器这⼀端,⼜在通常情况下,都是⽤JS来实现的,所以⼜会引申为,⽤JS写的⼤部分程序都是前端,包括App,⼩程
序,H5等。⽽NodeJS出现之后,⽤NodeJS写的后端部分,也会被⼈归类为前端,为了区分之前的前端,就给他们起了⼀个名字,叫做“⼤前端”。
但,这种以语⾔为分界点去区分前后端,真的合理么?
在过去,我们是不分前后端的,⽆论是Java还是JS,全都是⼀个⼈来写。
到底是什么原因让我们开始区分前后端了?
javascript属于前端吗
第⼀个,是可以并⾏开发。前后端的进度互不影响,在过去,前后端不分离的情况下,前端的⼯作量相对较少,⼀个前端可以对四个后端。可以理解为,前端花了⼀周时间写好了静态页⾯,只需要调⼏个Ajax接⼝,不需要路由,也不需要渲染,所以第⼆个,是成本问题。在过去,后端的成本还是⽐前端要⾼⼀些。同样的⼯作,如果能拆给两个⼈做,⼀个成本⾼⼀点,⼀个成本低⼀点,能接受。
第三个,CSS太难了。JS还好,和后端语⾔在对技能的训练上相差不⼤,可是CSS是什么⿁?记住那么多的属性,和Hash算法有关系吗?
所以才分成了前后端,⽽Html+CSS+JS,都是在浏览器端执⾏,统⼀称之为前端。⽽Java,C,Python,PHP这些可以运⾏在服务器端的,统⼀称之为后端。
所以前后端的定义,不应该是以语⾔来定义,⽽是应该以它的运⾏环境,如果是在服务器端,就应该被称之为后端,代表着你看不见,摸不着。
⽽如果运⾏在⽤户端,就应该被称之为前端,代表你是可以看得到的。
⼆、动静分离
静态页⾯:是指互联⽹架构中,⼏乎不变的页⾯(或者变化频率很低)。
动态页⾯:是指互联⽹架构中,不同⽤户不同场景访问,都不⼀样的页⾯。
动态资源 jps servlet spring mvc 与静态资源 js html img css 不会部署到同⼀个服务器。接⼝与视图分开部署,前端项⽬与后端项⽬都是独⽴部署的。也就是说前台通过后端提供
的接⼝来拿到数据,后台只为前端提供接⼝。动静分离就是将动态请求和静态请求区分访问。将静态资源部署到⼀个服务器,动态资源部署到⼀个服务器,它们是分开部署的。
三、为什么要动静分离
静态页⾯访问路径短,访问速度快,⼏毫秒。动态页⾯访问路径长,访问速度相对较慢(数据库的访问,⽹络传输,业务逻辑计算),⼏⼗毫秒甚⾄⼏百毫秒,对架构扩展性的要
求更⾼。静态页⾯与动态页⾯以不同域名区分。
这样可以提升系统的访问速度,提升资源利⽤率。
四、前后分离
核⼼思想是前端html页⾯通过ajax调⽤后端的restuful api接⼝并使⽤json数据进⾏交互。
前后端分离并⾮仅仅只是⼀种开发模式,⽽是⼀种架构模式(前后端分离架构)。千万不要以为只有在撸代码的时候把前端和后端分开就是前后端分离了,需要区分前后端项
⽬。前端项⽬与后端项⽬是两个项⽬,放在两个不同的服务器,需要独⽴部署,两个不同的⼯程,两个不同的代码库,不同的开发⼈员。前后端⼯程师需要约定交互接⼝,实现
并⾏开发,开发结束后需要进⾏独⽴部署,前端通过ajax来调⽤http请求调⽤后端的restful api。前端只需要关注页⾯的样式与动态数据的解析&渲染,⽽后端专注于具体业务逻
辑。
五、前后端交互
前后端数据交互均是json格式,前端传到后台的都是json格式的数据,即前端提交表单时会将表单数据序列化为json数据,那么在后台涉及到对象的都必须⽤@RequestBody接
收。