阅读 1800

第三期 | 前端搞搭建一些思考

写文之前,首先感谢大会的组织者、志愿者们,各位辛苦了。近来,刚换了新东家,由业务需求转向基础架构这块领域,思维和编程上都在一定程度上做转换。所以架构方面的文章、书籍都有在啃,本期前端搭建也是工作方向之一,7 场分享都有在细心听取、研读、知识抽取和重新梳理,并在接下来的工作上落地实践。如果可以后面可以开源出来,不过需要很长一段时间了。

大会情况

首先谈一谈对于本期前端早早聊整场下来的一些看法:

  • 较前2期,本期新增了2场放在了上午,所以本期从上午10点就开始了。
  • 讲师方面,淘系4位(占了一半以上)、阿里妈妈1位(所以阿里系5位)、京东系1位和政采云1位,建议同系讲师不要超过2位,不同系讲师可供大家对单主题的分享有多种可能的理解。
  • 术语方面,本期专业术语体量有些多,所以在理解上对于一些小伙伴有些阻力。
  • 演讲方式,我不太清楚的是本期早早聊对于本期参与小伙伴的级别上是否有要求,本期一半以上是在阐述需求场景、产品设计和实现思路,这没有什么问题,但是在落地实现上一笔带过,只有一两名讲师在编程实现有所分析,希望早早聊在讲师分享内容上有所衡量和把控,不否认阿里系的产品很厉害,大家也想做到那样,可是很多公司在一段时间内达不到的,建议每期可以有 1~2 位可以让大家开眼的讲师做分享,个人觉得用得上,听得懂,抄得走的除了设计理念(思路)还有一些代码层面上的实现

上面分析或阐述只代表我个人想法,有不完整或欠缺的地方还请指出或轻喷,这是一个思想自由、技术自由探讨的地方,所有的声音都应该得到尊重(那些带有情绪或恶意人身攻击的除外)。

相关术语

为了方便小伙伴(方便自己)阅读后面的内容,先将一些术语整明白。

  • PasS,Platform-as-a-Service,平台即服务,把应用(编辑器或设计器)的运行和开发环境作为一种服务来提供的模式。
  • MPM,Mart Page Maker,卖场页面生成器,京东自研的一个可视化搭建系统,用来减少重复开发、释放生产力的有效方案。
  • Low-code,低代码,通过可视化的方法帮助开发人员进行应用程序开发,快速构建应用程序。通过低代码平台,企业可以快速构建应用程序,同时非技术人员也可以参与到开发的过程来。低代码开发平台通过模型驱动逻辑使用预编译来创建web和移动应用程序,对比传统的编程方式,可以实现更高的生产效率。减低开发本和增强竞争力,比如 Google 的 App Maker。
  • 物料,可按照规范进行标准化构建,并且可以在不同项目、不同团队、不同成员之间复用的任意资源。比如基础框架、组件库、区块、模板和插件。
  • 编辑器,可理解为页面可视化搭建, 是一个历久弥新的话题. 更广义上讲, 页面是 GUI 的一部分, GUI 的拖拉生成在各种开发工具上很常见。前端页面早在十几年前就能用 Dreamweaver 等工具可视化搭建出来虽然说 Dreamweaver 死了, 但是页面可视化搭建工具依然广泛需要和使用, 所以这个话题依然值得探讨。
  • JSON Schema,JSON 模式是一种基于 JSON 格式定义 JSON 数据结构的规范,可以理解为是对 JSON 的一种约束。可以用于接口的数据校验, 表单提交前的校验, 前后端同构的校验, 如果有中间数据处理层, 接收多方数据, 用 JSON Schema 来保证数据一致性也是一个比较好的实践。

大纲

  • 前端编程方式
  • aPaas 平台服务
    • 中台管理
    • 物料生态
    • 插件生态
    • 低代码搭建编辑器
    • 基础建设
    • 其他功能
  • UI2Code
  • 总结

前端编程方式

  • Pro-code,程序编码,基于代码从底层开始研发
  • Low-code,低代码开发,前提是先做好代码生产物料零件,后面通过可视化用于组装界面(搭积木),对于复杂逻辑通过可视化配置信息,从而达到整体提效;
  • No-code,无代码开发,即非编程人员可直接使用可视化搭建来组装界面,从而转移生产关系(前端无需参与),从而释放前端资源;
  • Auto-code,根据设计图纸或需求文档自动生产零件进行组装界面,从而释放前端资源(此块深度学习、机器学习、算法工程以及后期部分还需专业前端技术支持,不管怎么说也是一个可行性发展方向);

低代码开发

低代码开发平台在面向的用户是有一定前端基础的开发者,以快速交付应用程序为目的,解决传统软件开发模式带来的周期长、成本高等问题。

大多数的低代码工具,都是采用“编辑器(设计器)+ 网页应用部署”形式。使用者用编辑器完成应用程序的模型层和界面层的设计,然后将设计完成的网页版部署在服务器上,解决具体的业务问题。

无代码开发

是在低代码开发平台的基础上提出的,它面向的用户是业务人员,而不是有一定前端基础的开发者。业务人员根据业务的实际需求,通过表格或者表单界面,自行创建业务模型层,且最终的应用程序界面也是表格或者表单。

无代码平台的一个显著特征是:业务人员可以自行设计并使用应用程序,新需求可以自行增加,不依赖有一定前端基础的开发者,没有严格的设计和运行的界限,新需求随时更改随时上线,无需部署。

高生产力应用程序平台

hpaPaaS,全称 High-Productivity Application PaaS,可也称为应用程序平台(aPaas)。将尝试将云计算的优势跟无代码开发平台的优势结合起来,更大限度的提升生产力。其一个巨大优势在于可帮助企业搭建的是一个“应用程序平台”,而不是一个独立运行的单个应用程序。在这个平台中,企业可以定制化搭建满足不同需求的各类应用程序,比如 OA,ERP,CRM,SCM,MIS 等等,并且应用程序之间是可以数据互通的,老板可以统览企业经营的所有状态,这就从本质上解决了数据孤岛问题。

对于初创公司,或者需要进行企业信息化建设和改造的公司,必须提前考虑到数据孤岛可能在未来带给企业的沉重负担,因此,从一开始选择 aPaaS 平台,是这类企业的不二选择。不论是低代码、无代码还是 aPaaS,都有它存在的现实意义,且未来这三种平台必然会走向统一,因为所有对于生产力提升有帮助的事物都是社会发展的必然趋势。

对比

属性对比 Low-code No-code hpaPass
面向企业 中大型有 IT 中心 中小型没有 IT 中心 中小型没有 IT 中心
定制化程度
使用复杂度
面向用户 有一定前端基础设计业务人员使用 业务人员设计与使用 业务人员设计与使用
运行环境 本地编辑和运行 云端编辑和运行 云端编辑和运行
部署方式 本地编辑器和服务器 无需部署,即改即上线即用 无需部署,即改即上线即用
生产产物 生成当个独立的应用系统,系统间业务无关联 生成多个独立的应用系统,系统间业务无关联 即时创建独立的应用系统,系统间数据打通的
新需求增减 有一定前端基础的开发者增加新需求,重新发布,用户方可使用新功能 业务人员即改即上线即用 业务人员即改即上线即用
工作协同
开发效率
成本

虽然我们其中大多数离 aPaas 还有很大距离,或许我们还处于 Pro-code,可那又有什么关系,至少我们还在前端路上一直行走,同时在前端路上也多了一种可能。

aPaas 平台服务

中台管理

不管哪种编程方式,对于业务数据、物料管理这块就不得不提到中台管理了,大致可分为站点管理、页面管理、埋点管理、模板管理、区块管理、组件管理、元件管理和数据看板几大管理模块。

物料生态

为了使平台编辑器有更好的交互体验,我们需要物料库的支撑。物料生态的搭建离不开元件搭建、组件搭建、区块搭建、模板搭建等,然后发布物料,实现物料共享。除了平台发布的物料之外,用户可自定义物料

插件生态

物料平台搭建完备后,可以物料面板的形式来补充我们的插件生态。除了物料面板,还有属性面板、事件面板、样式面板、逻辑编排、流程编排、数据驱动、模型驱动图像识别等。

低代码搭建编辑器

具备编排能力、插件能力、渲染模块、骨架支持、主题定制和国际化支持等。其中编排涉及到逻辑编排、视觉编排、交互编排和数据编排

产品设计

每家公司业务不同,搭建出来的产品(中后台搭建、图表搭建、表单搭建、小程序搭建、流程搭建等)也不同,所以编辑器的产品设计也是各不相同,这里罗列几个:

数据编排

通过在编辑器编排好视觉和交互设计,将数据进行编排并存储到服务器。而数据编排方式可通过描述协议 JSON Schema 范式将结构与数据整合实现渲染。

  • 结构类型

  • 结构

  • 数据
  • 数据与结构合并

数据聚合分发策略

数据源可制定聚合分发策略,同类请求对象在发出前 pack 合并,响应后经 unpack 拆包分发。其中引擎以队列形式来收集客户端发起的请求对象,等到下个 Tick 再发起请求。

基础建设

上面一整套玩下来,基本涉及到了整个平台服务的内容了。为了能够使得整个平台持续健康的玩转下去,基础建设是少不了的,需要有搭建协议、视觉规范、组件规范、技术文档、工程脚手架、命令行工具、GUI 工具支撑。

其他功能

  • 保存、预览和发布功能
  • 代码回滚服务
  • 多人协同能力
  • 多系统打通

UI2Code

一份 photoshop 设计稿或 sketch 设计稿甚至是一张图片,经过深度学习、机器学习、专家系统和算法工程的识别然后生产出一份代码。这背后涉及到核心技术点包括 UI 智能识别表达拆解、UI 信息架构识别逻辑代码智能生成

前端迈脚踏入人工智能领域,本期淘系团队在这领域已有很深的研究和一些产品实现了,所以也没有那么多不可能,很多公司虽然给不到平台和资源来支持前端做这块研究,但自己还是可以可劲折腾的嘛,只要你想,前端路上总有志同道合之人,可能在你身边,可能在地球的另一端,可那又怎样呢?身体都能到达的地方,更何况思想呢?!

结语

前端路漫漫,一个人总会太孤单。虽然不能面对面把酒言谈圈内事天涯亦可若比邻,知识点领悟到了就够了。欢迎一赞,手留余香,可尽情挥洒文字(在评论区),这里所有的想法都会得到尊重(那些带有情绪或恶意人身攻击的除外)。

关于大会

前端早早聊大会目标成为用得上,听得懂,抄得走的前端大会,计划 2020 年办 12 期,由前端早早聊与掘金联合举办,未来前端早早聊大会行程动态、资料下载请扫码下方公众号跟进: