芋道源码：能浪才是好浪，源码精品专栏分享及画图方法论介绍

hwyzw

    点击上方“芋道源码”，选择“”

    管她前浪，还是后浪？

    能浪的浪，才是好浪！

    每天 8:55 更新文章，每天掉亿点点头发...

    源码精品专栏

    技术传播的意义不仅在于借助商业化的产品与开源项目，缩短我们开发应用的过程，加快业务部署的速度，更在于卓越工程师们对提升工作效率、优化产品性能以及改善用户体验等宝贵经验的交流与分享，从而增强我们的专业技能。

    在尝试用一幅或几幅图画来展现我们的系统时，我们是否常常面临以下几种情形：

    若遇到相似的疑惑，本文将阐述一种绘图的理论体系，旨在使架构图更加直观易懂。

    架构是对系统中各个实体及其相互间联系的一种概括性表述，它涉及一系列关键性的选择与判断。

    架构是结构和愿景。

    系统架构是对概念的具体展现，它涉及对物体或信息的功能与构成要素之间的匹配关系的安排，同时，它也定义了这些要素之间的相互联系以及它们与周围环境之间的相互作用。

    构建框架是一项繁复的工作，同时也涉及众多议题，本文将不予详述。一旦框架确立，便需确保所有相关方都能理解和执行相应的决策。

    系统架构图旨在以抽象的方式展现软件系统的全局概貌，包括各个组成部分之间的相互作用、限制范围，同时全面展示软件系统的物理布局以及其发展演变的总体趋势。

    一幅图胜过千言万语。为了使相关人员能够理解和遵从架构决策，我们必须将架构的相关信息有效传达。架构图作为一种理想的媒介，其作用不容小觑。因此，绘制架构图的目的是：

    收集了众多资料，资料种类繁多，其中一种颇受欢迎的分类方法是4+1视图，它包括场景视图、逻辑视图、物理视图、处理流程视图以及开发视图。

    场景视图旨在阐述系统参与者与功能用例之间的相互联系，呈现系统的核心需求与交互设计方案，一般通过用例图来进行表达。

    逻辑视图旨在阐述系统软件功能被分解成各个组件后的相互关系，以及这些组件的约束条件和边界设定，它揭示了系统的整体构成及其构建过程。此类视图通常通过UML（统一建模语言）中的组件图和类图进行表达。

    物理视图旨在阐述系统软件与物理硬件之间的对应关系，揭示了系统各组件在计算节点集合上的具体部署情况，并为软件系统的部署与实施提供了指导。

    流程视图旨在展示系统软件各组件间的交互顺序，以及数据的流入和流出情况，同时体现了系统的功能运作与数据流动，一般通过时序图和流程图来呈现。

    设计视图旨在阐述系统的模块结构和构成，同时深入到内部包的具体设计层面，旨在为开发者提供便利，并映射出系统开发与实施的全过程。

   

    这五种架构视图分别从各个侧面展现了软件系统的不同特性，当它们被整合起来，便构成了一个系统的架构蓝图，用以详细描绘系统的整体架构。

    这些分类源自前人的经验归纳，图片则是从网络中选取的，那么这些图片的质量如何呢？我们是否应该直接模仿这些图片来绘制类似的作品呢？

    暂且不论这些图表的质量如何，我们经过对这些图表的分类和功能的分析，得出了一些结论。我们认为，在绘制一个优秀的架构图之前，首先要搞清楚目标受众是谁，接着要明确需要向他们传达哪些信息。因此，不应仅仅为了绘制物理视图而绘制物理视图，也不应仅仅为了绘制逻辑视图而绘制逻辑视图。相反，应根据不同的受众和需要传达的不同信息，通过图表精确地展现出来。最终的图表或许就会包含在这些分类之中。判断一幅画是否出色，一个直观的评判标准在于：观者是否能够精确捕捉到画作所要传达的核心信息。

    在明确了这两个关键点后，从接受者的视角来看，一张优秀的架构图理应无需额外说明，它需具备自我解释的能力，同时还要确保信息的一致性以及达到必要的精确度，从而与代码内容相契合。

    画架构图遇到的常见问题

    为何选择方框而非圆形，这背后是否蕴含着某种特殊的象征意义？若随意选用方框或其他图形，是否有可能导致理解上的困惑？

    随意使用线条或者箭头可能会引起误会。

    构建架构是一项繁复的任务，若仅依赖单一图表来展示，往往会导致令人困惑的语义混淆。

    C4模型通过容器、组件以及代码等元素来展现软件系统的静态构成。此类图形绘制相对简便，同时提供了绘图的关键指导。然而，我们认为其最核心的价值在于，它清晰地指出了各类图形的目标读者群体及其所承载的意义。

    此案例源自C4官方网站，我们在此基础上融入了自己的见解，旨在探讨如何更有效地阐述软件架构。

    这是一个构想中的、尚待开发的网络银行平台，该平台通过接入外部的大型主机银行系统来处理客户账户和交易数据，并利用外部电子邮件系统向客户发送邮件。其结构直观、明了，无需过多解释，一目了然。它涵盖了将要建设的系统本身、系统的用户群体，以及与该系统进行交互的周边系统。

    用途

    这张图示简洁明了，它揭示了所需构建系统的本质；指明了系统面向的用户群体，以及这些用户如何使用它，以及它如何与现有信息技术环境相融合。该图的目标受众包括开发团队的成员，以及来自外部的技术和非技术人员。换言之：

    怎么画

    该系统居中，四周环绕着用户及其他相互影响的系统。图示的核心在于理清即将构建系统的用户群体及其高层级的关联，一旦梳理完毕，绘制出来仅需短短几分钟。

    容器图是把语境图里待建设的系统做了一个展开。

    图中所示，除了用户界面及外围系统，待建系统涵盖：一个采用Java和MVC模式的Web应用作为功能接入点，一个基于架构设计的手机应用程序作为移动端接入，一个基于Java的API应用负责提供服务，以及一个MySQL数据库用于数据存储。

    各个应用之间的交互都在箭头线上写明了。

    在审视这幅图像时，人们往往不会注意到其中的直角或圆角方框，亦或是实线箭头与虚线箭头的区别，甚至对于箭头的具体指向也并未给予过多的关注。

   

    我们拥有多种绘图方法，每种方法都对框和线的含义进行了阐释。为了准确解读图形中的全部信息，绘图者与观图者都必须对这些定义有清晰的认识。然而，在现实中，这一要求往往极高，因此，许多人只能大致把握图形的寓意。

    用途

    该图表的适用对象涵盖团队内部的开发人员以及外部的同行，亦包括负责运维的技术人员。其应用范围包括但不限于：

    怎么画

    以框图形式展现，其内部可包含项目名称、技术选型、角色分工等信息，同时需清晰描绘这些框图间的相互联系，若涉及外部系统，则需明确界定其边界。

    组件图是把某个容器进行展开，描述其内部的模块。

    用途

    该图表主要面向内部开发团队，旨在指导他们进行代码的整理与构建工作。其应用范围包括：

    这个图很显然是给技术人员看的，比较常见，就不详细介绍了。

    这是内部使用的实时数据工具的架构示意图。作为一张具备自解释性的架构图，这里就不再赘述。若有人感到难以理解，那可能是因为这张图绘制得还不够完善。

    绘制架构图的方法众多，本文重点阐述了C4这一方法，且C4的理论持续发展。不论采用何种绘图方法，我们应牢记绘图的根本目的——促进有效沟通。在绘图过程中，我们不应受限于繁琐的规则。概括来说，在动笔之前，应明确：这幅图是为谁而画，展示何种内容，以及如何让人无需解释即可理解。

    C4官网：

    为什么需要软件架构图：

    *FR1pH

    书籍：《程序员必读之软件架构》

    作者为三画，系阿里巴巴集团的技术专家。他早年投身于工作流引擎的研发领域，积累了丰富的经验。目前，三画专注于高并发移动互联网应用的架构设计与开发。值得一提的是，本文的另一位贡献者同样来自阿里巴巴零售通部门。

    诚挚邀请您加入我的知识星球，让我们共同深入研究架构知识，分享源码心得。加入途径很简单，只需长按屏幕下方的二维码即可。

    已在知识星球更新源码解析如下：

    近期对《芋道 2.X 入门》教程进行了更新，现已发布超过20篇文章，内容涉及Redis、ES、数据库分片与分表、读写分离策略、权限管理、Dubbo框架以及Kafka消息队列等多个方面。

    附赠了包含约三万行代码的示例，还提供了超过四万行代码的电子商务微服务项目。