摘要, 华为云于前端领域, 给出了DevUI的场景级解决办法, 以及连通前端与服务端的低码引擎, 助力开发者去开发专业化、设计统一化的前端场景。
一篇分享自华为云社区名为《使用场景级前端解决方案及低代码引擎, 助力开发者生产效能提升-云社区-华为云》的内容发布了, 它的来源是《华为云DTSE》期刊第五期开源专刊, 其目的是以开源促进技术创新和生态协同-云社区-华为云。
如今, 在场景级的前端能力以及物料方面, 业界与之相关的内容和产品数量较少, 而且分布得极为分散, 基本上不存在基础组件的搭配情况, 体验参差不齐, 大部分专业场景能力和物料只有通过商用授权才可获取；就场景的构建而言, 开发效率与开发门槛逐渐变成了非专业前端开发者面临的痛点问题；业界虽已存在多种低码引擎应用, 但这些应用通常只提供前端部分, 开发者要搭建一个完整的低代码平台, 成本依旧十分巨大。
华为云于前端范畴供应了 DevUI 的场景级解决办法, 以及连通前端跟服务端的低码引擎, 以此协助开发者构建专业且设计统一的前端场景, 并与此同时推动开发者生产效能的提高。
前端场景级解决方案与搭建效率提升
在当下大前端趋势的情形下, 物料生态正变得越发繁荣起来, 各种各样的组件库纷纷进行发布, 这就给开发者赋予了愈来愈多能够直接加以使用的能力, 进而借此提升开发效率；然而在完整的场景能力这块, 就好比一个完整的代码编辑场景那样, 它可不单单是组件的运用这么简单, 还牵涉到整体场景的搭建、交互以及体验等方面, 当前业界针对场景级前端解决相关的内容是比较少的, 并且通常是以单个产品的方式来予以提供的, 其内容没有基础设计体系以及基础组件的支撑, 要是直接去使用的话, 就极有可能出现与项目其他场景设计体系不一致、体验不一致等诸多状况, 要是一个项目打算用到多个场景解决方案的话, 那么这些场景的内部皆会存在体验差异性（就如同下面图片所展示的表格场景解决方案与日程场景解决方案分别源自不同的提供方, 在项目当中要是同时使用的话, 依旧得考量其体验的相互兼容问题）。
在当今这个数字化呈现飞速向前发展态势的时代, 企业对于高效且敏捷的应用程序所产生的需求日益变得旺盛起来, 更多的是, 有了场景级的解决方案。为了能够满足这样的一种需求, 越来越多的呈现出涌现态势的是低代码开发平台。这些平台借助于提供简单易用的开发工具以及实现了优化之后的开发流程, 助力开发者迅速构建具备高质量、能够重复使用特点的应用程序, 与此同时降低了开发所具有的难度以及成本, 提升了开发效率以及灵活性。这些低代码开发平台得以出现, 无疑是给企业的数字化转型了提供更快速且更高效的方法, 并且还会推动整个软件开发行业取得进步。业界所拥有的低代码引擎通常都仅仅是提供前端部分, 开发者为了能够搭建出一个完整的低代码平台, 则需要自己去实现一套服务端, 但是成本巨大。
场景级前端解决方案集
对于上述所提及的, 有关场景解决方案匮乏、不存在统一设计体系、各个场景之间体验不相符等同题, 相较于组件库来讲, 前端组件化有了更深入的发展, 所需求的是一个具备专业性的场景级前端解决方案集合, 倚靠已有的统一设计规范, 还有构建完备的基础组件, 去构建一整套专业的场景级解决方案, 该解决方案具备场景专业性、体验先进性以及体验一致性。
就日志场景来讲, 当下已有的产品, 在日志场景方面, 存在体验不一致的状况, 还有功能不足的情形, 以及体验差这样的问题。进一步的解决办法, 便是要去构建, 在业界处于领先地位的, 面向下一代的, 前端日志管理场景的解决方案。
业界产品现状与分析
日志场景最基本的用户需求即为信息的查看与基本搜索。
以常见产品的一些组件的当前状况而言, 在日志场景之中, 多数仅仅达成了最为基础的功能, 从日志的基本搜索方面来讲, 也是不适合去启用的。
部分场景即使可搜索，搜索结果显示也存在体验不足。
比起更多的业界产品而言, 就像cloud的日志查看那样, 在日志查询方面, 其支持能力是比较出色的, 而且在日志可视化程度以及便捷化程度上, 均有着一定的提升。
日志展示，对于基本的查看与搜索，较大颗粒日志支持分组。
日志解决方案
要是目标专门着力于给出针对下一代的前端日志管理场景的解决办法, 日志场景起初的需求是信息的查看以及基本的搜索, 更深一层的需求是错误的辅助剖析与处理。针对日志的查看与搜索再进一步而言:
信息可结构化呈现（时间、信息分类）；
能够迅速地获取信息, 将其按照类别、分块清晰且明了地予以呈现, 同时还提供导航以及日志可视化的功能。
可支持高级搜索与查找，如常用关键词等；
历史日志支持快捷查看。
场景搭建效率提升：前后端流程打通的低代码引擎解决方案
由于使用一般低代码平台时, 存在需自行去实现一套服务端, 且成本很高这样的情况。所以需要一个能使前后端流程贯通的低代码引擎解决办法。前端运用灵活的系统架构, 给出了极高的自定义自由程度, 从而使得用户能够如同搭建积木那般, 去挑选不同的模块来搭建自身专属的设计器。并且还提供插件化的架构, 让用户能够便利地拓展与业务有关的功能。有着完善的插件体系, 其间包含着插件开发所需要的基础UI库, 工具库, 插件面板的显示控制, 生命周期管理, 公共API注册与共享等。这一体系让开发者仅仅依照简单的规范, 就能够迅速开发出业务所需要的插件, 进而极大地提升了开发效率以及灵活性。
服务端把微服务的概念给引入了, 把系统拆分成小的、独立的服务单元, 让每个服务单元都能够独立去开发, 独立去测试, 独立去部署。这样的架构不但提升了团队的协作效率, , 而且能令系统更加便于去扩展, 更加易于去维护。这样的架构不但提高发, 开效率, 还为未来的扩展以及创新奠定了坚实的基础。
微服务具备这样特殊的性质, 开发者通过这般性质去进行操作, 能够容易实现而且可便捷扩展自身的服务端框架结构布置格局体系。
针对业务的引擎予以构建的业务接口微服务, 把其他微服务进行汇总连接从而为前端供给接口。
数据中心被视为数据基座, 它会统一开展数据管理工作, 进而为其他微服务给予一致性的数据支撑。
低代码引擎：为定制低代码平台提供前后端全套解决方案
致力于实现针对开发者场景让开发效率得以提升的华为云, 促使低代码引擎顺势诞生。它属于一种通用型的开发框架, 是借助对低代码平台系统里常常会使用到的功能予以解构, 进而把它划分好些个功能模块, 并且还为每个模块都设定了相应的协议以及开发范式, 如此一来开发者能够依据自身的业务需求, 简便地定制开发出自身的低代码开发平台。
具备低代码底层能力, 且集成了人工智能, 进而让用户可高效开展开发。拥有强大的拖拽功能, 不管是图元还是复杂组件, 都能于画布带来流畅体验。它适用于多场景的低代码平台开发, 涵盖资源编排、流程编排、服务端渲染、模型驱动、移动端、大屏端以及页面编排等低代码平台。
不仅给出前端部分, 还给出了服务端, 能够协助开发者贯通低代码平台构建的前后端整整流程, 极显著地削减了开发者构建低代码平台的成本。
大部分业务大概也许只需于低代码平台里运用拖拉拽的办法去搭建Web应用, 然而仍会存在一些定制要求较高的业务, 平台没办法满足业务全部的需求。基于此我们给出了一套自定义DSL以及源码生成逻辑的机制, 相较于在运行时由平台给予渲染引擎的方式, 这般方式能够给用户提供更多的自主权以及安全性。用户能够随意地定义自身的-DSL, 并且依照需求生成定制化的源代码, 进而更为灵活地把控应用程序的行为和性能。
业务案例：PDM元数据电子审批流
审批流业务场景是现代企业运营中不可或缺的一环。
A公司有着这样的业务场景, 流程发起人A开启了一个电子审批流程, 此流程最先会流转到主管那里施行审批, 于审批进程当中, 主管会认真核查初始业务流程信息以及别的相关数据, 接着判定是否进一步促使流程推进, 或者退还给A去开展修订, 要是主管批准了这个流程, 那它会被转交给下一级审批人, 也就是经理, 在经理的审批环节里, 经理同样会详细审查相关数据与信息, 并且依据这些以及自身的独立判断力来进行决策。需要留意的是, 虽然经理能够查看主管所填写的某些技术信息, 然而这些信息并不向财务以及法务公开, 这便是说, 唯有经理与总经理能够看到这些技术信息, 财务与法务无法知晓, 经理会依据这些保密信息以及其自身的专业判断去决定是否持续推进流程。
一旦经理批准了该流程, 那它就会被送到财务节点来审批。在审批时, 财务着重关注经济方面的问题, 像价格、付款方式之类的。要是财务审批批准了, 流程就会被转交给法务去审批。
和财务审批相类似, 法务审批着重关注法律方面的风险和能契合合规的问题事项。于审批这个行为过程当中, 法务人员会认真仔细地去查看相关的各类合同、协议等这一系列法律文件, 并且还要就其来评估是不是存在着任何的法律风险或者是合规性方面的问题。一旦法务完成了批准流程这个动作之后, 该流程就会被转交给总经理去开展最后的审批工作, 借此来达成整个审批流程的全部环节。
要留意的是, 这种审批流业务情形并非仅有一个, 而是存在诸多。举例而言, 除去上述的采购进程以外, 还有别的业务进程需予以审批, 像: 数据入库流程、报价流程等。每个流程都具备各自的特性且审批节点数量各不相同。有些流程或许仅需两三个节点便可达成审批, 有些则可能得需十几个节点方可完成。然而, 所有类别的审批流大致相仿。比如: 页面上常见的元素涵盖表单、表格以及常用的审批组件等。
专业剖析得知, A公司起初运用传统的那种做事情的方式, 任一增添一种流程之时, 先从前端方面着手开展工作的相关人员, 都必须去完成开发涉及所有审批节点的审批页面这一任务, 并且再度进行发布流程。另外也是如此, 在为系统后端提供支持的相关开发人员, 也需要再次去构建一个审批流, 借助特定的页面录入各个节点的审批人, 还要撰写与之对应的审批流规则。很明显, 这对于前端和服务端从事开发工作的人员而言, 均确实是极为繁杂麻烦的工作。
解决办法是, 为了让审批流程得以优化, A公司依据所提供的前后端解决办法, 研发出一个专门用以电子审批流的低代码平台。接着, 把所有和流程有关的组件, 像模板、评审记录以及流程指引等, 导入到平台的物料区域。并且基于所给的服务端构建了一个特定于flow类型的低代码平台, 用来达成审批流程人员编排。这样一来, 前后端之间的连接达成了完美的连通。最后, 把这个着重于开发审批流的低代码平台整合到PDM元数据电子流业务模块里。
使用途径是, 于低代码平台里, 若要去开发随便哪一个流程的审批页面, 仅需把流程模板拖拉进去, 并且在模板当中嵌入此流程的表单又或者表格, 如此便能轻易地达成该节点的审批页面, 相当大地提升了开发效率以及便利性！
A公司借助所搭建的, 用于PDM元数据的, 有着电子审批流特性的低代码平台, 在公司电子流审批效率方面有显著提升 , 显著节省了公司的大量成本 , 以下呈现的是创建电子流表单的效果图。
DevUI 前端场景解决方案集
华为云就场景级解决方案集的构建, 提出了DevUI, 其目的在于, 依据DevUI设计规范与Token, 在专业工具场景当中, 达成功能先进以及完善程度、体验方面的一致性。
DevUI 日志场景方案实现
就像上面文字所提及的日志场景解决办法那样, 按照上面图片所展示的情况, 到了基本日志的查看环节, DevUI 日志作出的是, 提供了对信息的分类展示, 呈现出不同信息的结构化, 就信息的快速导航方面而言, 能实施小地图的操作, 以及滚动条导航, 从而迅速地找寻到对应的信息。
在飞速进行寻找、当开展搜索筛选之际, 给予了完备的搜索扶持, 常见的关键词、正则表达式搜索等等全都提供支持, 而且搜索得出的结果能够清晰地做到显著显示:
要是对错误的信息开展过滤操作, 能够过滤得出来处于当下不同级别的信息, 面对错误的场景, 用户能够一键筛选出错误以及警告, 而且针对错误的情况, 还能够作出错误解决方案的提示。
以上所述, DevUI日志场景所提供的那一系列能力, 对于内部产品日志场景的能力而言, 有了较大幅度的提升, 且要是和业界各个产品相比较来看, 在功能的丰富程度以及完善水准上, 也有着一定程度的超越, 并且这个呢, 是DevUI的一个场景解决方案, 它是基于DevUI设计体系的, 与DevUI基础组件相配合, 进而构建出来的场景与项目具备良好的体验一致性。