漫谈：从全栈开发到技术架构

作者：神说要有光来源：神光的编程秘籍

前端、客户端主要是负责构建和用户打交道的界面，也就是 UI（user interface)，而构建 UI 需要在不同的位置显示文字、图片、视频等等，要分成不同的区块和页面，为了简化构建 UI 的过程，前端、客户端都提供了相应的布局方案，甚至还提供了 DSL 来简化布局的描述，比如前端的 html、css，安卓的 xml 都是用来简化 UI 描述的 DSL。

基于这些布局方案，我们可以快速构建出应用的界面，但是有的时候这些布局方案不适用，就需要自己绘制，这时候就要通过 canvas、webgl 的方式来绘制更灵活的 2d、3d 视图。安卓、ios等也提供了 canvas 的 api。

绘制界面整体上就分为这两种，一种是基于各平台的布局方案的，一种是自己绘制，前者常用来做应用开发，后者常用来做游戏开发和一些可视化。这两种构建UI 的方式区别还是挺大的，应用开发、游戏（可视化）开发是两条不同的路。

基于浏览器的 dom 和 css 的布局的方案，也就是基于 dom 的，可以使用一系列 dom api 来操作 dom，然后重新布局和绘制，通过这种方式来做各种交互。

而不基于 dom 的绘制方案，也会维护一套对象体系，比如 stage、sprite 等，然后在修改了对象的属性之后，重新绘制到 canvas。

绘制时需要各种资源还有数据，而提供这些资源和数据的就是后端，后端通过 http、websocket 等方式来传输绘制需要的资源和数据，资源存在静态服务器，托管在 CDN，数据都存在数据库里，根据不同的请求参数来进行资源的 CDN 的查找和数据的 CRUD，然后提供给前端。

随着应用规模的上升，后端的提供数据的服务器和提供资源的 CDN 都会做分布式，通过部署在不同地区的多台机器来保证效率和稳定。

这就是 web 应用运行的基本流程。

从开发到部署运行是有个过程的，这个过程就是软件工程的生命周期，从一次开发完所有功能的瀑布，到快速迭代的敏捷，从手动执行构建和部署，到完全自动化的 devops，工程效率是越来越高的，这是一个必然的趋势。

作为 web 应用的开发者，要掌握前端的两种绘制界面的方式，掌握后端的数据库和 CRUD 以及提供接口给前端，掌握 CDN 的部署、后端服务的部署，如果应用规模大了以后还要掌握各种中间件和分布式的技术。此外，还要掌握 devops 的自动化的工具链。这些技能掌握之后，就是一个全栈开发者了。

在完成功能的基础上，对于比较复杂的场景，需要做代码的设计，也就是架构，保证随着迭代代码复杂度不会失控。相对来说，后端的复杂场景多一些，前端相对较少，所以后端谈架构比较多，但前端也有一些复杂场景需要架构设计，比如微前端，比如 vscode 的 ioc、service、多进程划分等。

从能够完成基本功能的全栈开发，到能处理复杂场景的技术架构，就是web开发程序员的成长路径了。