腾讯低代码引擎建设思考和实战
如果无法正常显示,请先停止浏览器的去广告插件。
1. 第 十 六 届 D 2 前 端 技 术 论 坛
腾讯低代码引擎建设思考和实践
MarsboyDing(丁涛)
2. 个人简介
2017年,硕士毕业于中国科学技术大学。
校招加入腾讯互娱,现为腾讯11级前端工程师,
腾讯IEG增值服务效能前端团队负责人,负责星图
低代码前端、游戏营销前端效能组件、工具等项
目。
牵头成立腾讯第一个低代码企业标准、牵头孵化
腾讯第一个低代码开源协同Oteam。
MarsboyDing 丁涛
3. 通用能力架构
目录
通用能力引擎设计
内部低代码平台的实践
4. 低代码通用能力架构方案
5. 01 低代码通用能力架构方案
1.1 概念
易企秀
VB6.0
DW
6. 01 低代码通用能力架构方案
1.1 概念
那么低代码该如何定义?
广义 所有可以降低生产成本,减少代码开发的方式、过程或者工具/系统
狭义 指通过图形化、可视化的开发方式,基于模型驱动和逻辑编排的能力,进行拖拽和配置,最
后生成我们想要的产物(应用程序、接口等)
7. 01 低代码通用能力架构方案
1.2 低代码、无代码、纯代码
低代码
无/0代码
纯代码
需要自己编写的代码量占比
0%
100%
在(0,100)的量化空间内,低代码的定位很灵活,不同的量化定位,决定了低代码平台的应用形式和特征。
开发灵活性 人员友好性 运行稳定性 封装性 复杂需求
无代码 低 容易上手 好 好 难以实现
纯代码 高 专业性高 差 差 可实现
8. 01 低代码通用能力架构方案
1.3 全生命周期的LCDP
可视化开发
DSL开发
解析执行
预览
调试
编译执行
灰度
热更新
全量
监控
测试
9. 01 低代码通用能力架构方案
1.4 LCDP通用能力要求
LCDP属于哪种IT服务
SaaS
aPaaS
PaaS
iPaaS
IaaS
高易用性 非专业技术人员也可使用,大大降低了开
发成本,减少沟通成本,缩短开发周期
互联互通 将各应用、能力和数据进行打通和集成。
避免传统开发链路多,重开发的问题
可视化 开发者可以使用拖拉拽、属性配置等交互
方式替代代码编写的工作,降低门槛。
低代码开发平台
(LCDP)
一种格式化的开发数据规范,定义了包括
通用Schema UI、逻辑、数据等规范。是LCDP最基础核
心的概念。
10. 01 低代码通用能力架构方案
1.4 LCDP通用能力要求
具体的能力架构
(来自腾讯低代码企业规范)
11. 01 低代码通用能力架构方案
1.5 腾讯低代码Oteam的建设架构
Oteam是什么?
在腾讯,Oteam是公司级的一种开源协同项目组织形式。主要是为了统一公司内某一领域相
关项目的建设,减少重复轮子的建设,由各相关BG、部门同学一起参与协同共建。
腾讯低代码Oteam的目标?
在公司内,低代码Oteam旨在建设统一的低代码开发平台(LCDP)的通用底层引擎、SDK。
为更多的低代码开发平台提供最底层统一能力接入,助力各领域,各场景下LCDP上层平台的
建设。
12. 01 低代码通用能力架构方案
1.5 腾讯低代码Oteam的建设架构
核心引擎层
13. 通用能力引擎设计
14. 02 低代码通用能力引擎设计
UI可视化引擎
15. 02 低代码通用能力引擎设计
2.1 UI可视化引擎
关键词?
拖拉拽 UI组件 配置事件
预览 编辑样式 多页面
…
16. 02 低代码通用能力引擎设计
2.1 UI可视化引擎
长啥样?
拖拽预览区
物料区
微搭低代码
拖拽预览区
表单配置区
物料区
阿波罗低代码
表单配置区
17. 02 低代码通用能力引擎设计
2.1 UI可视化引擎
如何定义和描述UI的内容?
H5 Schema
定位布局
Console Schema
更多业务
组件
UI Schema
流式布局
Other Schema
…
丰富表单
组件
Schema Core
特性定义
物料定义
数据
布局
页面
样式
容器
事件
组件
生命周期
插件
动作
18. 02 低代码通用能力引擎设计
2.1 UI可视化引擎
预览与编辑引擎设计架构
installComponent
Install
installPlugin
installXXX…
UI Engine
Editor
操作物料
Page
component
container
plugin
Add
操作类型
Edit
Remove
操作特性
events actions
style data
Others…
init
UI Data
Render
refresh
update
19. 02 低代码通用能力引擎设计
逻辑可视化引擎
20. 02 低代码通用能力引擎设计
2.1 逻辑可视化引擎
关键词?
拖拉拽 流程连线 条件控制
预览 网络与DB 微服务
…
21. 02 低代码通用能力引擎设计
2.2 逻辑可视化引擎
长啥样?
腾讯星图低代码为例:
功能节点区
流程编排区
表单配置区
22. 02 低代码通用能力引擎设计
2.2 逻辑可视化引擎
如何定义和描述逻辑的内容?
Front Schema
UI操作
Backend Schema
云服务调
用
页面操作
Other Schema
…
数据库调
用
Logic Schema
Schema Core
节点特性
节点类型
判断
赋值
原子服务
循环
流程控制
网络调用
通用服务
存储操作
扩展服务
其它
23. 02 低代码通用能力引擎设计
2.2 逻辑可视化引擎
预览与逻辑编排引擎设计架构
InstallBasicNodes
Install
installServiceNodes
installXXX…
Logic
Engine
Editor
操作节点
Atom
Basic
Others
Service
Add
操作类型
Edit
操作特性
Remove
控制节点 赋值节点
表达式 服务节点
Others…
init
Logic Data
Render
refresh
update
24. 02 低代码通用能力引擎设计
DSL
25. 02 低代码通用能力引擎设计
2.3 DSL
DSL:领域专用语言
特征
一种语言
特定领域
尽量简单
转换成传统代码
必要性
与可视化形成补充
开发人员友好
脱离UI编辑器
跨平台二次开发
26. 02 低代码通用能力引擎设计
2.3 DSL
DSL在LCDP中的位置
可视化开发
Schema
切换与补充
DSL
解析与编译
27. 02 低代码通用能力引擎设计
2.3 DSL
DSL引擎的能力设计
语法
文档定义
Standard
语义
To Schema
DSL
Engine
Core
To AST
SDK能力
To DSL
语法检查/高亮
插件能力
IDE
语法提示
28. 02 低代码通用能力引擎设计
生产与运行
29. 02 低代码通用能力引擎设计
2.4 生产与运行
流程架构
30. 02 低代码通用能力引擎设计
2.4 生产与运行
引擎设计
Backend
Runtime
H5
小程序
…
Production
Engine
UI
HTML
CSS
…
Compile
Js
Logic
Go
…
31. 02 低代码通用能力引擎设计
2.4 生产与运行
解析 vs 编译
解析
Runtime
Schema
Schema Parser
Platform
编译
Schema
AST
Code
Runtime
灵活性 热更新 性能 原生能力
解析执行 高 容易实现 较低 一般
编译执行 低 不容易 较高 较好
32. 02 低代码通用能力引擎设计
质量保证
33. 02 低代码通用能力引擎设计
2.5 质量保证
关键词?
性能 调试 测试
异常上报 告警监控 健壮
…
34. 02 低代码通用能力引擎设计
2.5 质量保证
核心能力
能力内容
低代码监控引擎
低代码调试引擎
低代码测试引擎
特点
技术方案
日志采集、日志上
报、数据分析、告警
与工单系统 纯配置化、多维度日
志、按模块/组件配
置、按事件配置 1 将日志采集配置低代码化
2.集成告警规则、告警引擎
3.整个LCDP基于schema,更方便
埋点和配置信息采集
前端UI调试、后端接
口调试 实时模拟器调试、真
实环境调试,接口调
试可视化 1.基于解析引擎,模拟器可以实现调试
2.基于wesocket,编译成源码在远端机上
调试,实时返回调试界面与交互
单组件测试、整体UI
交互测试、前后端联
合测试、压力测试、
性能测试
测试用例可视化开
发、灵活配置输入输
出
1.设计一套测试逻辑解析引擎
2.各种外部因素实现可配置
35. 02 低代码通用能力引擎设计
2.5 质量保证
引擎设计
Log
Monitor
采集 组件 事件
上报 异常 性能
Rule
Alarm
Quality
Engine
Real Debug
Debug
Virtual Debug
UI
Test
Logic
Performance
Network
Interface
UI
Storage
Compatible
Script
36. 公司内低代码平台的实践
37. 03 腾讯低代码开发平台实践
3.1 后端逻辑编排
应用领域
互娱游戏营销活动后
端逻辑开发
抽奖
活动签到
游戏预约
礼包领取
…
腾讯星图低代码平台
38. 03 腾讯低代码开发平台实践
3.1 后端逻辑编排
核心能力
代码级流程绘制
丰富的组件模块
标题页
可视化与代码的融合
便捷的接入调用
在线测试
代码级流程绘制
可视化与代码的融合
便捷的接入调用
丰富的组件模块
在线测试
39. 03 腾讯低代码开发平台实践
3.2 toB中后台管理系统
应用领域
公司内多款业务产品
的管理端系统的搭建
腾讯无极低代码平台
40. 03 腾讯低代码开发平台实践
3.2 toB中后台管理系统
核心能力
页面片的概念
多种DB数据 网关接口
自定义接口 自定义数据
灵活的画布
灵活丰富的数据源支持
数据修剪
页面片的概念
本地cli模式
灵活的画布
灵活丰富的数据源支持
本地cli模式
41. 03 腾讯低代码开发平台实践
3.3 toC的营销活动低代码
应用领域
腾讯地图toC的营销运
营活动的快速搭建
腾讯地图雅典娜低代码平台
42. 03 腾讯低代码开发平台实践
3.3 toC的营销活动低代码
核心能力
可视化物料生产管理
物料数据表单化定义
丰富的业务组件支持
物料数据表单化定义
可视化物料生产管理
丰富的业务组件支持
43. 结语
44. 04 结语
1 低代码应该是一个生态系统
2 LCDP底层引擎的建设就像空气、水分、阳光
3 最适合解决具体领域问题的LCDP就是最好的
45. Thanks