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

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请求

相关推荐
Ten peaches22 分钟前
Selenium-Java版(环境安装)
java·前端·selenium·自动化
心.c34 分钟前
vue3大事件项目
前端·javascript·vue.js
姜 萌@cnblogs43 分钟前
【实战】深入浅出 Rust 并发:RwLock 与 Mutex 在 Tauri 项目中的实践
前端·ai·rust·tauri
蓝天白云下遛狗1 小时前
google-Chrome常用插件
前端·chrome
多多*1 小时前
Spring之Bean的初始化 Bean的生命周期 全站式解析
java·开发语言·前端·数据库·后端·spring·servlet
linweidong2 小时前
在企业级应用中,你如何构建一个全面的前端测试策略,包括单元测试、集成测试、端到端测试
前端·selenium·单元测试·集成测试·前端面试·mocha·前端面经
满怀10152 小时前
【HTML 全栈进阶】从语义化到现代 Web 开发实战
前端·html
东锋1.32 小时前
前端动画库 Anime.js 的V4 版本,兼容 Vue、React
前端·javascript·vue.js
满怀10152 小时前
【Flask全栈开发指南】从零构建企业级Web应用
前端·python·flask·后端开发·全栈开发
小杨升级打怪中3 小时前
前端面经-webpack篇--定义、配置、构建流程、 Loader、Tree Shaking、懒加载与预加载、代码分割、 Plugin 机制
前端·webpack·node.js