如何提升架构思维?

您好, 如果喜欢我的文章或者想上岸大厂,可以关注公众号「量子前端」,将不定期关注推送前端好文、分享就业资料秘籍,也希望有机会一对一帮助你实现梦想

什么是架构

"架构",即架设、构建。完成对于平台的合理架设,包括其首当其冲的可用,到可扩展、容易被开发、产品、业务、销售等全面接受的一个整体的设计。

完成对于平台的完备构建,是指,将设计好的、开发好的平台,能够有容器展示其本色。英雄本色,不能让英雄落寞。找一个最好的场地,展示其能力,构建出一个完备性的平台。综合两点,即可以是一个好的架构。

工程架构

如果你是普通开发,或许对于架构师这个词,对于你来说很遥远,或者说是互不关己的态度,但其实每个人在成为架构师之前,都需要有架构思维,当你有了架构思维,你也是在不知不觉当中成为了架构师。

架构分很多种,比如系统架构、产品架构、业务架构,再细粒化可以拆散到领域模型设计、工程项目架构设计,再细粒化下去,或许你不敢相信,我们都是做前端的,前端的组件拆分,业务嵌套,它其实也是架构,我们可以把它称为前端组件架构设计,就像是这样:

这是一个任务中心的需求,前端将需求按组件维度拆解出来,让整个前端链路看的非常清楚,同时也提到了消费侧、数据流转方式有props和context两种方案,并且将组件的层级也画了出来。如果你的技术氛围足够规范,在每一次开发前,你需要经历的过程会分为如下几步:

  1. 需求评估;
  2. 前端系分,出架构图、排期表,聚合在系分文档中拉系分评审会,产研一起讨论技术方案合理性;
  3. 投入研发;
  4. 联调&自测;
  5. 提测;
  6. 灰度;
  7. 正式发布;

如果没有架构图,你的研发节奏、排期、目标节点只能以估算的形式,但有了架构图,你的开发节奏就是以架构图中一个个子模块来走的,这就是架构的好处。并且如果你开发过的模块需要接手给其他同学开发,只需要给文档即可,不需要做过多的解释和过渡,可以帮助你自己节省很多时间。

很多人说前端简单,只是系统表壳,只是因为在系统架构中前端占了前一部分,但是将这一部分细粒化出来,前端架构也是非常复杂的,上面一张图是一个功能模块的示例,如果将系统前端架构画出来,就需要把项目架构、各子模块架构给关联起来,最后会是一张很大很复杂、交互性很强的架构图。

说完前端我们再来说说后端,系分文档后端会有领域模型变更,就像这样:

这其实和前端系分的架构图是一样的,只是研发角色不一样而已,但架构思维是通用的。

而前后端结合起来就是系统架构图,并且也是一比一的关系,就像这样:

前端负责跨平台、UI、交互、请求、异常抛出;后端负责数据加工、缓存、服务整合。

我们需要在自己的日常中让架构无处不在,架构思维才能不断提升,最后有自己的架构能力。所有的事情、复杂的事情、简单的事情,都可以用架构的方式让它变得更简单,更容易让人理解,就像一份说明书设计一样。

来自自己老板的一句话:"述职报告最前面,请放上架构图,让大家都知道你的工作是什么、一眼看懂你的工作量和价值在哪里。"。于是在场后面述职的同学,都偷偷的在文档最开头放了项目的架构图。

业务架构

那什么是业务架构呢?不涉及到具体的技术,用一张图把系统的所有业务部分讲清楚并且把业务流程描述出来的,就是业务架构图。

就像这样:

要学习的架构思维是通用的,图的组成结构也是一样的。

因此我们最后做一个总结:只要是人,就需要培养架构思维,可以让自己走得更远,做事做得更漂亮。拥有架构能力,可以标准化自己的工作产出,创造出更多的机会。

如果喜欢我的文章或者想上岸大厂,可以关注公众号「量子前端」,将不定期关注推送前端好文、分享就业资料秘籍,也希望有机会一对一帮助你实现梦想。

相关推荐
white-persist4 分钟前
Python实例方法与Python类的构造方法全解析
开发语言·前端·python·原型模式
新中地GIS开发老师41 分钟前
Cesium 军事标绘入门:用 Cesium-Plot-JS 快速实现标绘功能
前端·javascript·arcgis·cesium·gis开发·地理信息科学
Superxpang1 小时前
前端性能优化
前端·javascript·vue.js·性能优化
Rysxt_1 小时前
Element Plus 入门教程:从零开始构建 Vue 3 界面
前端·javascript·vue.js
隐含1 小时前
对于el-table中自定义表头中添加el-popover会弹出两个的解决方案,分别针对固定列和非固定列来隐藏最后一个浮框。
前端·javascript·vue.js
大鱼前端1 小时前
Turbopack vs Webpack vs Vite:前端构建工具三分天下,谁将胜出?
前端·webpack·turbopack
你的人类朋友1 小时前
先用js快速开发,后续引入ts是否是一个好的实践?
前端·javascript·后端
知识分享小能手1 小时前
微信小程序入门学习教程,从入门到精通,微信小程序核心 API 详解与案例(13)
前端·javascript·学习·react.js·微信小程序·小程序·vue
文火冰糖的硅基工坊2 小时前
《投资-111》价值投资者的认知升级与交易规则重构 - 价值投资的思维模式:穿越表象,回归本质
重构·架构·投资·投机