TMagic腾讯魔方支持多种框架组件的编写，比如vue2、vue3、react，其通过DSL技术将这些组件统一转化为魔方可识别的Schema，再由引擎解析渲染。

JS Schema

TMagic Editor的配置使用JS Schema来描述，其通过id来标识组件ID，name标识组件名称，type标识组件类型，items配置子组件，style配置组件的css样式，events配置相关事件。上述字段中，style和events的规则与JavaScript语言类似，方便前端人员掌握。

JS Schema本质上是一个JS对象，能支持动态函数，因此相比JSON配置灵活性更强，对前端更友好，不过对于后端人员来说则需要掌握一定的前端知识。

编辑器

如图所示，TMagic内置了编辑器，其分为左面板、工作区、右面板和工具栏四部分，涵盖了组件展示拖拽、页面预览模拟、组件属性、样式和行为编辑、历史回退等核心低代码功能。

Runtime

Runtime是TMagic的页面运行环境，包含了两种类型，预览Runtime和生产Runtime，前者在编辑器的模拟器中运行，而后者在页面发布后的真实环境中运行。

由于TMagic的组件支持vue2、vue3、react框架，因此Runtime本身也分为了vue2、vue3、react等Runtime。各类Runtime除了作为不同框架下的渲染环境，也作为不同框架打包构建的载体。