实现原理谈谈低代码

在讨论各个低代码方案前，首先要明确「低代码」究竟是什么？

这个问题不好直接回答，因为低代码是非常宽泛的概念，有很多产品都声称自己的低代码，但我们很容易反过来回答另一个问题：「什么是低代码产品唯一不可缺少的功能？」

我认为这个功能是可视化编辑，因为非可视化编辑就是代码编辑，而只有代码编辑的产品不会被认为是低代码，因此可视化编辑是低代码的必要条件，低代码其实还有另一个更清晰的叫法是可视化编程。

既然可视化编辑是低代码的必要条件，那从实现角度看，实现可视化编辑有什么必要条件？

我认为可视化编辑的必要条件是「声明式」代码，因为可视化编辑器只支持「声明式」代码。

解释一下什么是「声明式」，除了声明式之外还有另一种代码模式是「命令式」，我们分别举两个例子，如果想绘制一个红色区块，用「声明式」来实现，可以使用 HTML+CSS，类似下面的方法：

<div style="background:red; height:50px"></div>

而换成用「命令式」来实现，可以使用 Canvas API，类似下面的方法：

const ctx = canvas.getContext('2d');
ctx.fillStyle = 'red';
const rectangle = new Path2D();
rectangle.rect(0, 0, 100, 100);
ctx.fill(rectangle);

虽然最终展现效果是一样的，但这两种代码在实现思路上有本质区别：

• 「声明式」直接描述最终效果，不关心如何实现。

• 「命令式」关注如何实现，明确怎么一步步达到这个效果。

从可视化编辑器的角度看，它们的最大区别是：

• 「声明式」可以直接从展现结果反向推导回源码

• 「命令式」无法做到反向推导

反向推导是编辑器必备功能，比如编辑器里的常见操作是点选这个红色区块，然后修改它的颜色，在这两种代码中如何实现？

如果是「声明式」的 HTML+CSS，可以直接改 style 的 background 值，而基于 Canvas 的命令式代码则无法实现这个功能，因为无法从展现找到实现它的代码，命令式代码实现同样效果的可能路径是无数的，除了前面的示例，下面这段代码也可以实现一样的效果：

const ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(50, 0);
ctx.strokeStyle = '#ff0000';
ctx.lineWidth = 100;
ctx.stroke();

甚至有可能这个颜色是多个字符串加随机数拼接而成，即便通过静态分析也找不到来源，从而无法实现可视化修改。

「命令式」代码无法实现可视化编辑，而可视化编辑是低代码唯一不可少的功能，所以我们可以得到结论：所有低代码平台必然只能采用「声明式」代码，这也是为什么所有低代码平台都会有内置的「DSL」。

既然低代码都是声明式，那我们可以通过分析其它「声明式」语言来了解低代码的优缺点，其实在专业研发里，声明式语言在部分领域已经是主流了：

• HTML+CSS 是一种页面展现的 DSL

• SQL 是一种数据查询及处理的 DSL

• K8S 的 yaml 是一种服务部署的 DSL

• NGINX conf 是一种反向代理的 DSL

上面这些方案目前都是主流，但它们早期并不被看好，比如十几年前还曾经争论过到底是用 B/S 还是 C/S 架构，CSS 2 的功能主要是面向图文排版，并不适合用来构建应用界面。

SQL 最开始也不被看好，下面引用《硅谷简史》这本书里的部分文字：

1970年，IBM研究员特德·科德（Ted Codd）发表了一篇里程碑式的论文，《大型数据库的系统模型》，介绍了关系数据库理论。

当时大多数人认为关系数据库没有商业价值，因其速度太慢，不能满足大规模数据处理或者大量用户存取数据，虽然关系数据库理论上很漂亮而且易于使用，但它的速度太慢。

上面两段其实说的是 Oracle 的发家故事，可以看到当时关系型数据库并不被看好，因为大家都觉得慢，这点很好理解，数据库在查询前还得先解析 SQL语法、估算各种查询的代价、生成执行计划，存储也只能使用通用的数据结构，没法根据不同业务进行定制。

综合来看这些「声明式」语言有以下优点：

• 容易上手，因为描述的是结果，语法可以做得简单，非研发也能快速上手 HTML 及 SQL。

• 支持可视化编辑，微软的 HTML 可视化编辑 FrontPage 在 1995 年就有了，现在各种 BI 软件可以认为是 SQL 的可视化编辑。

• 容易优化性能，无论是浏览器还是数据库都在不断优化，比如可以自动改成并行执行，这是命令式语言无法自动实现的。

• 容易移植，容易向下兼容，现在的浏览器能轻松渲染 30 年前的 HTML，而现在的编译器没法编译 30 年前的浏览器引擎代码。

而这些语言的缺点是：

1、只适合特定领域，命令式的语言比如 JavaScript 可以用在各种领域，但 HTML+CSS 只适合渲染文档及界面，SQL 只适合做查询，所有这些语言都。

2、灵活性差，比如 SQL 虽然内置了很多函数，但想只靠它实现业务是远远不够的，有些数据库还提供了用户自定义函数功能（UDF），通过代码来扩展。

3、调试困难，遇到问题时如缺乏工具会难以排查，如果你在Firefox出现前开发过页面就会知道，由于IE6没有开发工具，编写复杂页面体验很差，遇到问题要看很久代码才发现是某个标签没闭合或者 CSS 类名写错了。

4、强依赖运行环境，因为声明式只描述结果而不关注实现，因此强依赖运行环境，但这也带来了以下问题：

1. 功能取决于运行环境，比如浏览器对 CSS 的支持程度决定某个属性是否有人用，虽然出现了CSS Houdini 提案，但 Firefox 和 Safari 都不支持，而且上手成本太高，预计以后也不会流行。

2. 性能取决于运行环境，比如同一个 SQL 在不同数据库下性能有很大区别。

3. 对使用者是黑盒，使用者难以知道最终实现，就像很少人知道数据库及浏览器的实现细节，完全当成黑盒来使用，一旦遇到性能问题就不知所措。

4. 技术锁定，因为即便是最开放的 HTML 也无法解决，很多年前许多网站只支持 IE，现在又变成了只支持 Chrome，微软和 Opera 在挣扎了很多年后也干脆直接转向用 Chromium。同样的即便有 SQL 标准，现在用的 Oracle/SQL Server 应用也没法轻松迁移到 Postgres/MySQL 上。低代码行业未来也一样，即便出了标准也解决不了锁定问题，更有可能是像小程序标准那样发展缓慢，功能远落后于微信。

因为低代码就是一种声明式编程，所以这些「声明式」优缺点，其实就是低代码的优缺点，了解声明式的历史及现状就能更好理解低代码，因为：

• 低代码的各种优点是「声明式」所带来的。

• 低代码被质疑的各种缺点也是「声明式」所导致的。

— 2 —

低代码的实现方案

说完了声明式，我们就对低代码有了全面认识，接下来进入正题，开始介绍已知的各种低代码实现原理，将会分为前端和后端两部分。

— 3 —

生成代码的方案算不算低代码？

在讨论各种方案前，有一种方案比较特别，它虽然也有配置规范或 DSL，甚至有可视化编辑，但最终应用运行是通过生成代码的方式实现的，不依赖依赖运行环境。

这个方案最大的优点是可以和专业开发整合，因此灵活性强、可以使用原有的开发流程，本质上和专业开发一样。

但也有如下缺点：

• 强依赖研发，无法做到给非研发使用，因为后续代码需要编译上线。

• 无法持续可视化编辑，因为代码无法可视化编辑，生成代码后只要有修改就没法再反向还原成低代码的形式，后续只能代码编辑。

• 难以实现完全用低代码开发应用，因为不能生成太复杂的代码，使得这种方案一般不包括交互行为，通常是只有前端界面支持可视化编辑。

• 无法做到向下兼容，因为生成的那一瞬间代码依赖的框架版本就固定了，目前还没见过哪款前后前端框架做过到完全向下兼容。

因此我认为生成代码的方案不算真正的低代码，本质上它还是一种开发辅助方式，一种高级点的脚手架工具，和大部分IDE的生成样板代码能力一样，使用这种方案无法做到持续可视化开发，我还没见过有人将 HTML+CSS 编译成 C++ 代码后二次开发。

— 4 —</