c239夜沉如何打造可扩展高生产力的研发平台

⾼效的上层：LowCode/ProCode盒⻢⼯作盒⻢⼯作台（6000+⻚⾯微应多⻚应 ……垂直业垂垂直业垂直业垂直业垂直业

有6000+存量⻚⾯，3000+活 ⻚⾯，对新旧应⽤的研发效率要求⾮常⻚⾯之间关联较弱，交互相对模式化（List/Detail/Form），适合LowCode技术做快速搭需要⽀持微应⽤多⻚应⽤单体应⽤/…等多种研发流程，流程上需要考虑可扩ReXDev定位与演进策ReX提升研发效率，降低上⼿成本，让ReX⾮前端开发者也能参与前端开

ReX（授⼈以⻥

（授⼈以渔

前端提供【⾜够低成本的】【常规模式化、特定垂直场景】ReXDev技术分层架⾼效的上层：采⽤渐进式的LowCode/ProCode融合研发⽅案，让不同⼈群、不需求->开发需求->开发->联调->部署->测试->上应应⽤应⽤应⽤应⽤应⽤应⽤极简CI/CD 业务

产品

应业务

产品

应业务产品线 产品线App1 App2 App2 App3

ACDE分⽀创 资源部 卡点检 版本推

builddeploypublishstagesactionssuccesssuccessbuilddeploypublishbuilddeploypublishPipeline调度Pipeline调度引从上个 输

输出写⼊⾄当前stage均为独⽴执⾏，需要通过contextstage的输出成为下⼀个stagebuild build-daily

build-

stage的并⾏逻辑相当于并⾏执⾏的stages构成⼀个虚拟stagepipelinepipelinepipeline

input

scheduler

DTS(auto-A

RealtimeLogB resultBresult=start

TaskExecutor(e.g.def/just-cloud/fx)endendcontext&IOpipelinepipelinecontextDCBAstageinstancesD级MiddleLow级MiddleLowyamldocker的通⽤持续集SDK/egg-plugin，实现CI/CD 迭代循创建迭

配置迭

开发迭

部署迭

上线迭

线上/线下

wdk-wdk-wdk-appwdk-appwdk-app*-app*-app*-app*-app*-assets-appuiassets-appflowassets-appservicehippo-builderhippo-appuihippo-appflowhippo-appserviceappappappappappappappappproductproductproduct productproductproductstages+actions完成流程定制；（参考第⼀节研发卡点扩展Lint、CR、API，SPIcallbackAPI模 SPI模

ABC3rd-partSPIService微微应ABCDSPIABCDSPISPIRexhippo-appservice(egg-plugin/ts)configAppSPIconfigSprintSPITypeScript类型定义来约egg-plugin简化扩展逻辑，并提供mock⽀持ReXDevTasksTasksSprintWebUIslots TaskPool

Task任务，并⾄TaskManager的任务中⼼，并Task；卡点触发：流程通过emit()⽅法来触发Task，由TaskManager执⾏的状态渲染：基于WebUI的

(addtask&listen

机制，每种Task都有相应的FPC组件做⾃定义UI渲染；TaskWebUI扩类似SPI思想，FPC(FeatureProviderComponent)Hippohippo-app

Assetsassets-apptab.config task.blocktab.configtask.blocktabtabapp-infoapp-infofpc.register(appType,taskdeployRexDevSprintRexDevSprint…

FPC组件的定义

（如果流程没有本质差异的化LowCode/ProCode研发⽅案设研发模适应⼈适应场示专业前端开发、前端外复杂业务场排线、排LowCode->前端外包、专业前端开常规的模式化业务场配送站管理、合⾮前端开发、前端外简单的模式化场简单查询列⾮开发⼈特定领域的垂直场表单、⼯作台配LowCode单⼀模式困境：业务早期很简单，基于LowCode/NoCodeLowCodeNoCodeNoCodeProCode/LowCode/NoCodeNoCodeLowCodeappframework

从ProCode->LowCode->NoCode，本质上是产品封装appframework，核⼼是View与Model的分离，并具备强约束；⽽ProCode与LowCode互转则具备更⼤的 LowCode/ProCode互转⽅案选SchemaLowCode与JSX-AST⽅案说明通过schematocode的转码⽅⽣成代码，实LowCode->ProCode

⽅案说明在解析JSX⽣成AST时，对View进⾏标记，实现Code-View的映射，View侧修改直接操作AST，⽣成相应的JSXCode。不⾜：⽆法逆向转换，⾮渐进Schema⽅ JSX-AST⽅

性，我们选择JSX-AST⽅案。JSX-ASTLowCode实现机位置标记：babel编译时，为每个JSX/Reac ement添加对应的AST标记，这样渲染后的View也会带上标记

JSXCode(<Button(babel-plugin:标记

ProCode转码：每次AST储，实现⽆缝的LowCode/ProCode互转JSCode

AST

AST操作：视图编辑操作转换为可枚举的Action,每个Action都⽣成对应的AST Actions查询列表场查询列表场模ReX单据详情场表单录⼊场WebIDEY符合严模N锁ReX单据详情场表单录⼊场WebIDEY符合严模N锁（不提供⾃由搭建能⼒

才能基LowCode统⼀Node/Web侧的构建机制，实现ProCode/LowCode

For Forwwckcompiler(loader+plugin+sharedappsharedappentryRemoteDependency(pre-buildLocalRemoteDependency(pre-buildLocalDependency ckonweb源码[磁盘 ckonwebNodebowl(mocknodeNodebowl(mocknodeNodeLowCode/ProCode融合设计⼩选择最合适的⽅案JSX-AST的