企业官网建设流程全解析

互联网的发展速度极为迅速, 而支撑着它的Web开发技术, 也历经了巨大的变化。

初始之时的网页, 仅仅是静态信息予以展示, 于技术层面而言并无前后端予以区分, 从事开发工作的人员常规情形下一人包揽整个页面。

先是网页从单纯的 HTML 页面, 一步步地演变成能够跟用户进行交互的, 并且能实时作出响应的复杂应用, 而后, 前后端的概念才慢慢地出现了。

近些年来, 全栈化的这种趋势愈发显著, 去领会前端、后端以及全栈的演变进程, 对于掌握当前的技术脉络以及规划未来的发展走向而言, 是关键性的。

前后端分离之前

任何技术的出现都有着它需要解决的问题。

在互联网早期，WEB 技术还不像现在这样发达。

那时的网页仅起到静态展示作用，服务器的工作极其简单。

接手接收请求这一行为, 找寻到与之对应的HTML文件, 将其发送给浏览器, 如此这个任务就算是达成告知性完成状态了。

由于用户对于个性化内容以及交互的需求呈现出增加的态势, 所以服务端开始去承担更多的任务。

HTTP属于无状态协议, 每次请求于服务器而言, 皆是全新的、彼此独立的，服务器自身不会记住用户上一次所进行的操作。

于是, 状态管理被引入了, 客户端运用其来纪录状态信息, 并且在发起请求的时候, 将这些信息发送给服务端, 服务端在接收请求之后, 依据那信息展开相关处理。

但是, 仅仅依靠内存来存储状态, 这样是脆弱的, 服务器要是进行重启, 或者进程出现崩溃, 就会致使所有会话丢失。

为达成状态的持久化这一目的, 保证应用数据于服务器重启之际依然具备有效性, 促使数据库变成了服务端所必不可缺的基础设施, 它被用以存储诸如用户信息、产品数据以及订单记录等之类的核心业务数据。

客户端请求被接收之后, 服务端就得依据请求去处理数据, 还要动态生成 HTML 页面予以返回。早期的 JSP, ASP 等技术都是为了这个而产生的。

就这样，后端开发的核心任务渐渐清晰起来, 其一是管理用户状态, 其二是执行业务逻辑, 其三是访问数据库, 其四是根据请求动态生成 HTML 页面。

在前后端还没有分离的那个时代, 开发者从管理状态开始, 涉及到执行业务逻辑, 再到访问数据库, 最后生成HTML页面, 这一整个流程都要去负责, 这便是服务端开发的雏形。

前端的兴起

其实在早期时, 并没有前端这样的一个概念。那个时候, 网页开发的主要任务, 便是将设计稿转化成网页。

曾几何时, 网页大体上呈现为静态之态, 匮乏丰富多样的动画效果, 并且交互逻辑也近乎不存在, 开发者着重聚焦于页面的布局以及样式, 仅仅被用于开展某些简易的特效或者表单验证, 所以一般是由服务端来兼任此项工作的。

于二零零四年四月一日这一天, 推出Gmail, 其乃正式推出, 它对电子邮件予以改变, 并且还对诸多事情产生了改变。

它曾进行过若干新的概念的尝试, 其中最为关键重要的一项是, AJAX（二者为and以及XML）。

在AJAX出现之前, 用户得去点击一个位于网页之中的链接, 或者是点击网页上所存在的按钮, 紧接着就得等待页面重新进行加载, 如此这般之后才能看到全新的结果。

于AJAX之后, 开发者能够于不使整页进行刷新的情形下, 以异步的方式去加载以及更新局部数据。

这般情形之下, 用户能够瞧见最新动态, 无需进行点击操作, 也无需予以等待, 用户体验实现极速提升。

当时, 仅仅是用在了小型的网站之上, 而且还是那种实验性的网站, 经历了多年的发展历程, 然而却始终都还没有流行于大网站。

Gmail 不是第一个采用 AJAX 的网站, 然而它是第一个证实能够大规模运用 AJAX 的网站。

从那之后, 前端先是单纯进行页面展示, 而后渐渐扩展到管理UI状态, 再到处理异步请求, 另外还有事件交互等核心功能。它已经不单单是起到点缀作用了, 而是转变成对用户体验有着影响的关键环节。

前端工程化

AJAX 兴起了之后, 前端渐渐开始承担更多的逻辑, 然而在早期的时候, 浏览器之间的差异是比较大的, 所以需要大量的兼容性代码。

等库框架对这一问题起到了缓解的作用, 然而频繁地对 DOM 进行操作致使出现了性能瓶颈。

2009年, Node.js出现了, 它能够运行在服务端, 并且借助npm推动了模块化与工具链的发展, 进而为前端工程化提供了支撑。

探索前端工程化, 是以 2010 年的发布作为开端的, 它借助双向数据绑定以及依赖注入达成结构化开发。

接下来的一年, React于News Feed上首次被运用, 在两年之后进行开源，React把虚拟DOM以及JSX引入进来, 将组件化以及单向数据流思想带到前端。

2014年, Vue进一步把轻量化跟渐进式设计相互结合, 使得中小型的项目, 也都是能够迅速应用组件化以及响应式编程的。

现代开发框架出现, 带来了范式转变, 这些框架给前端带来了组件化思想, 也带来了声明式编程思想。

研发这相关从业者, 仅仅只需去描绘, 应用于各异状态之下, 界面所应当显呈现的模样, 也就是, View等于f(state)。

变化至状态之际, 框架担当职责, 借由特定比较算法, 实施 DOM 更新之举, 手动操作 DOM 的负担得以减轻, 开发效率以及代码可维护性因之显著提升。

以这个为基础, 单页应用SPA渐渐变成主流, 把页面加载以及路由控制全部交给前端去处理, 运用异步来请求数据, 并且动态更新视图, 给用户带来了不用刷新页面的流畅操作感受。

跟着 SPA 兴起, 前端要处理路由、状态以及性能等繁杂问题, Babel、Jest 等工具先后出现, 并且跟诸多现代框架结合, 渐渐形成完整工程化体系, 包含开发、构建、测试、部署环节。

到此为止, 前端那门技术, 已经从服务端这项当中, 脱离了出来, 进而演化成了一项, 具备独立的理论体系, 还有工程方法, 以及工具生态环境的, 技术学科。

前后端分离

在2007年的时候, 苹果进行了发布, 这一发布重新界定了智能手机的形态以及功能, 使得智能手机从一个用来通讯的工具转变成了互联网终端。

在此之后紧接着的, 随即就发布了, 通过采用开源策略联合着好多硬件厂商, 从而加快了智能手机大众使用的进程速度。借此促使智能手机进而得以进入到了具备多个厂商、多样终端类别的竞争局面之中。

人们开始借助手机随时去访问网络服务, 这直接促使了用户对于跨终端一致体验产生需求, 并且也致使开发者们不得不再次思考怎么办才能够在多设备环境之中提供统一的用户体验以及 API 服务。

SPA以及现代前端框架全面普及, 这立刻促使前后端分离架构广泛落地, 这意味着开发职责以及协作模式出现根本性转变, 在这样的架构里, 职责划分变得清晰起来。

关于前端, 它着重于用户界面以及用户体验, 承担着视图渲染的职责, 还有状态管理以及路由控制的工作, 借助 API 同后端展开通信, 最终演变成了一个具备高度自治特性的应用。

后端致力于业务逻辑的处理, 进行数据的存储跟访问, 开展 API 的设计以及认证授权。它脱离了对 UI 渲染的直接介入。

仅仅是双方, 只需要事先协商达成一致的 API 契约, 就能够达成高度的并行开发, 极大地提升了开发的效率, 并且缩短了项目的周期。

其次, 前端团队与后端团队获得了充分的关于技术选型的自由权利, 就此能够依据自身所需以及场景情况, 单独挑选最适宜恰当的框架, 并且挑选合适的语言, 还有挑选恰当的工具, 不再受到对方技术栈方面的限制约束, 进而对之有效推动促进了技术创新发展。

同时, 鉴于两者是分开进行开发的, 前端所涉及的应用能够独立地被部署于CDN或者静态资源服务器之上, 进而能够充分借助边缘缓存以及内容分发的机制, 以此为全球范围内的用户供给极为极致的访问速度以及体验。

后端服务呢, 能够独立予以部署, 部署的地方是应用服务器或者云平台, 并且可以灵活地开展性能优化工作, 还能够进行资源弹性伸缩操作, 以及版本迭代更新的行为。

历经最终阶段, 这般架构将早期那种模糊不清的混合开发模式予以了彻底改变, 使得开发者得以在各自所专注的领域当中深化彼此的专业技能, 进而显著地提升了工程相应的能力以及团队协作的效率。

其普及, 意味着前端后端分离形态广泛应用, 这表征着Web的开发, 从起初的混乱无序状态, 朝着高度偏向运用工程化方法、专业化技术以及协作化模式的成熟状态迈进, 也为现代的大型Web应用开发, 奠定坚实巩固基石, 亦为高效团队协作奠定稳定牢固基础。

全栈的回归

由于 SPA 被广泛运用, 其于首次加载全部资源的时候所带来的那种流畅体验, 也将对于 SEO 不太友好的弱点暴露了出来, 进而使得服务端渲染也就是 SSR，以及静态站点生成也就是 SSG 等技术, 再度回归到前端工程当中。

同时, 于快速迭代且资源有限的现实情形里, 原本分工明确的前端与后端又再次趋向于融合, 这就是现代全栈趋势的由来。

Node.js 延伸至服务器端, 该平台使部署运维得以简化, BFF 以及像 Next.js 这样具备开箱即用端到端能力的元框架, 这些技术一同让全栈开发的门槛被大幅降低。

全栈模式的核心价值在于整合与效率。

可任由小团队, 或者是个人, 从界面设计开始, 然后迅速推进到后端实现, 接着再到部署交付, 这对于原型验证以及中小型项目而言, 是极其适合的。

但全栈化绝非技术的倒退，而是能力的螺旋上升。

早期时, 后端开发者兼做前端工作, 原因在于前端的复杂度相对而言比较低。现如今所呈现出的全栈化这种趋势, 是因为生态以及工具链走向成熟, 从而让具备跨越前后端界限的那种综合能力, 拥有了更高的投入产出比例了。

哪怕这需要开发者拥有横跨用户界面、业务逻辑、数据持久化、API集成以及基础设施部署等不一样技术领域的综合技能跟知识, 极大地增添了开发者的负担。

早期时, 后端兼任前端职责, 后来, 演进成现代开发者。现代开发者具备前后端综合能力, 这一情况, 标志着开发者技术广度与工程掌控力的提升。

总结

Web开发的进程清晰可察；起始于早期的混合样式, 发展至明晰的前后端分开, 进而到当下基于成熟生态的全栈样式。

第一步, 是为了使开发变得更加合理, 更进一步, 是为了让开发变得更加高效, 与此同时, 还要提供更好的用户体验。

全栈是一条路径, 专业化是另一条路径, 二者有所不同, 然而它们的目标都是使得开发能够更加灵活, 并且效率变得更高, 同时体验也能更好。

若知晓这段历程, 便有益于挑选契合自身团队以及项目的开发方式, 还能助力我们更为妥善地运用诸如 AI 等新技术, 使得 Web 开发变得更加轻松、高效。

参考资料