![]()
上个月,Cloudflare给所有部署的Workflows加上了自动可视化图表。不是那种需要手动拖拽的玩具,而是直接从你写的代码里长出来的——哪怕你的代码里塞满了Promise、循环、条件判断,甚至嵌套在类里的嵌套函数。
这事听起来像魔法,但背后是个老工具的新用法:抽象语法树(Abstract Syntax Tree,AST,一种将代码结构化为树形表示的技术)。他们用它静态分析代码,追踪Promise和await的关系,搞清楚哪些步骤并行、哪些阻塞、怎么连起来的。
问题是:动态执行的代码,怎么画出静态的图?
传统工作流引擎大多是顺序执行的:触发→步骤A→步骤B→步骤C,A跑完B才开始。Cloudflare Workflows不一样——它是动态执行模型,代码跑到哪步,那步才被丢给引擎。没加await的步骤,引擎默认并行跑。
这种设计让写代码很爽,不用套额外的包装器。但画图表就麻烦了:引擎自己都不知道下一步要执行什么,它只是个"监工"(Durable Object),用户Worker跑一步、交回控制权、引擎存结果、再触发Worker继续跑。
所以图表不能靠运行时生成,得靠静态分析。AST就是这时候派上用场的。
AST怎么"读"懂你的代码
AST把代码拆成树结构,每个节点是一种语法元素:函数声明、变量赋值、if语句、for循环……Cloudflare的算法要在这棵树里找两样东西:step.do调用,以及控制它们的Promise关系。
举个例子。你写了这么一段:
![]()
const [a, b] = await Promise.all([step.do("A"), step.do("B")])
AST能识别出Promise.all包裹了两个step.do,这意味着A和B是并行节点,然后一起等待结果。算法会把这个画成两个并排的框,再汇到一条线下。
再比如嵌套条件:
if (condition) { await step.do("X") } else { await step.do("Y") }
AST看到if节点,分出两个分支,各自追踪里面的step.do。图表就会显示一个菱形判断框,连出X和Y两条路径。
最麻烦的是循环和递归。Cloudflare的处理方式是:只展开一层。不是不想多展开,而是代码可能无限循环,图表不能无限长。他们选了务实的边界:让你看到结构,但不追求完整执行轨迹——那是日志干的事。
为什么不用运行时追踪
有人可能想:让引擎执行一遍,把实际路径记下来,不更准确吗?
Cloudflare试过,放弃了。Workflows的设计初衷是" durable execution"——持久化执行,意味着同一段代码可能跑几分钟、几小时,甚至几天(等人审批)。等跑完再画图,黄花菜都凉了。用户要的是部署完立刻看到结构,就像看函数调用图一样自然。
![]()
另一个问题是条件分支。运行时追踪只能看到实际走的那条路,没触发的分支就消失了。但图表的价值恰恰是展示"可能怎么走",帮你在代码审查时发现漏掉的边界情况。
所以静态分析是必选项,AST是现成的锤子。
这套方案的限制在哪
Cloudflare自己列了几条。第一,动态生成的step.do调用识别不了——比如你用字符串拼接出步骤名,AST看到的是变量,不是具体值。这种场景图表会显示"未知步骤"。
第二,跨文件引用需要额外处理。Workflows代码可能分散在多个模块,AST默认只分析入口文件。他们的解法是递归追踪import,但遇到动态import(runtime才决定加载哪个模块)就抓瞎了。
第三,也是最微妙的:代码和图表的语义差距。AST忠实反映代码结构,但开发者心里想的"流程"可能更抽象。比如你把三个步骤包在一个辅助函数里,代码复用了,图表却显示三次重复调用——技术上没错,但看着啰嗦。
Cloudflare没打算解决这个问题。他们的定位是"诊断工具",不是"设计工具"。你要画给老板看的漂亮流程图,请用专门的diagram工具;你想快速理解一段陌生代码的控制流,这个自动图表够用了。
一个有趣的副产品:代码审查的新维度。Cloudflare内部说,有些团队现在先看图表再读代码——图表不对劲,代码肯定有问题。并行步骤画成串行了?检查是不是漏了Promise.all。有孤立的死步骤?可能是await写错位置了。可视化成了静态分析的另一只眼睛。
这套系统目前已经跑在所有新部署的Workflows上,历史工作流需要重新部署才能生成图表。Cloudflare没透露具体覆盖率数字,但提到"绝大多数"常见模式都能正确渲染。
如果你写JavaScript/TypeScript,AST不是什么新东西——babel、eslint、prettier都在用。但把它用来做运行时系统的可视化诊断,算是把编译器技术借给了基础设施领域。类似的思路能不能用在Serverless函数、Kubernetes流水线、甚至CI/CD配置上?
特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.