网站开发的发展(后端路由/前后端分离/前端路由)

1.后端路由阶段

在早期的网站开发中 网页的渲染工作其实是交由服务器完成的 所以该渲染也被称之为后端渲染

具体的过程就是:浏览器发送url给服务器 服务器解析该url 使用后端路由(在服务器中 用于储存url和页面映射关系的路由)获取指定url对应的页面 然后交由jsp去处理该页面(包括html+css+java/php 其中java/php用于从数据库中获取数据并动态展示到页面中)并渲染该页面(由于渲染操作发生在后端 所以也称之为后端渲染) 最终返回给浏览器展示

但是后端路由存在着一些缺点:

① 整个页面的前后端都是由后端人员编写和维护的 代码量庞大

②前端人员如果想要开发该阶段的页面的话 必须掌握java/php等后端语言

③通常情况下 该阶段的页面是由html和java混合组成的 编写和维护难度很大

2.前后端分离阶段

该阶段主要是将前后端彻底剥离开来 能够达到各司其职、分工明确的目的 让后端人员专注于数据 而前端人员专注于页面的可视化和交互 使得开发效率大幅提升

主要的一个流程就是:浏览器发送url向静态资源服务器中请求页面(html+css+js) 由浏览器解析html+css并渲染为页面 然后运行js代码(其中通过ajax调用api获取服务器中的数据)并渲染到页面中

当移动端出现以后 他获取的数据依然是通过和网页端一致的api调用获取的 后端不需要进行任何额外的处理

该模式目前很多网站仍然在采用

3.前端路由阶段

该阶段也可以被称之为SPA(single page application)阶段 即单页面富应用阶段(一套html+css+js 但是整合了多个网页 主要是分离js/vue组件 而复用html/css 因为一个vue文件对应一个网页 而多个网页会整合到js中) 可以理解为前后端分离阶段的基础上 内置了前端路由的阶段(前后端分离阶段的静态资源服务器中主要是一个网页对应一套html+css+js 而该阶段则是一个网站的所有网页对应一套html+css+js)

而其中肯定存在根据不同网页url从同一套html+css+js中剥离出独有的部分进行执行渲染的机制 即前端路由(储存着url和vue组件的映射关系) 并且每一次url的变化并不像后端路由那样需要重新发送请求 前端路由会事先将整一套html+css+js下载到浏览器中 然后监听url变化根据映射表中的关系去进行渲染 不需要重新发送url请求

相关推荐
IT_陈寒10 小时前
Redis性能翻倍的5个冷门技巧,90%开发者都不知道第3个!
前端·人工智能·后端
jingling55511 小时前
vue | 在 Vue 3 项目中集成高德地图(AMap)
前端·javascript·vue.js
油丶酸萝卜别吃11 小时前
Vue3 中如何在 setup 语法糖下,通过 Layer 弹窗组件弹出自定义 Vue 组件?
前端·vue.js·arcgis
J***Q29218 小时前
Vue数据可视化
前端·vue.js·信息可视化
ttod_qzstudio19 小时前
深入理解 Vue 3 的 h 函数:构建动态 UI 的利器
前端·vue.js
_大龄20 小时前
前端解析excel
前端·excel
一叶茶20 小时前
移动端平板打开的三种模式。
前端·javascript
前端大卫20 小时前
一文搞懂 Webpack 分包:async、initial 与 all 的区别【附源码】
前端
Want59520 小时前
HTML音乐圣诞树
前端·html
老前端的功夫21 小时前
前端浏览器缓存深度解析:从网络请求到极致性能优化
前端·javascript·网络·缓存·性能优化