带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(9)

简介: 带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(9)

带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(8)https://developer.aliyun.com/article/1340319?groupCode=taobaotech


组件代码自动生成

跨平台、标准化、低耦合,往往意味着编码更加繁琐,也意味着难以落地。

 

举个例子,假如我在组件A要去操作组件B,显示一个对话框,我需要写的代码有:

  1. IxxBService 组件接口
  2. CxxBService 组件实现
  3. IxxBPresenter P层接口
  4. CxxBPresenter p层实现
  5. IxxBPresenter::IxxBViewDelegate p层定义的ViewDelegate接口
  6. CxxBView view层实现

 

要在6个对象里写代码,这简直就是一个灾难!!!但是考虑到长期的可维护性、跨平台,又必须这么做。于是,我们开发了一个代码生成工具,根据上面各种情况下的ui关系,可以从模板自动生成组件代码。

由于篇幅限制,这里不具体展开。

 

 

产生的效果

 

这套跨端组件化方案,已在跨端千牛/跨端旺旺产品中落地,目前双产品三端已经发布上线。

(目前win千牛功能 > 跨端千牛,跨端千牛的win版本尚未发布,敬请期待)

  1. 双端完全一致的使用体验,完全复用相同业务逻辑代码。
  2. 双端开发成本天然降低一半。
  3. 适合团队协作,组件分拆,协同开发的效率高。
  4. 组件间完全解耦,可维护性大大增强。一次开发,到处使用,简单方便。
  5. 可用工具自动生成组件代码,只需关注业务逻辑,效率高,风格一致。
  6. 集成了大量集团基础能力,沉淀了pc跨端应用组件化框架,提供快速搭建阿里系pc应用能力。

 

再回到我们选择这个方案时的目标,

  1. 首先是支持跨平台,
  2. 其次是可维护性、扩展性,长期来看,可维护性对产品质量、效能和研发体验都影响深远。
  3. 然后是良好的性能和稳定性,
  4. 最后是较好的研发效能和研发体验。

 

目前来看,prg组件框架在前3点上表现出色,在第4点研发体验上,由于跨多端的严苛要求,ui组件分层较多,开发略显繁琐,我们通过自研组件代码生成工具,缓解了这一问题。

 

总的来说,prg组件跨端框架可以在未来的3-5年里,很好的支撑起千牛/旺旺,甚至其他阿里系pc应用的业务。

 

跨端组件框架的演进思考

技术基础能力完善

 

框架基础能力,例如支持事件订阅优先级、支持组件链路/性能监控、增加基础能力组件等。                   ui组件单元测试能力,ui组件都是pv结构的,ui逻辑都在p层,用简单的uidelegate即可串联ui逻辑,实现ui单元测  试。

研发效能和研发体验,完善代码模板和自动化工具 ,实现接口级别代码自动生成/补全,进一步提升研发效率和研发体验。

 

 

带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(10)https://developer.aliyun.com/article/1340317?groupCode=taobaotech

相关文章
|
Web App开发 移动开发 前端开发
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(1)
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(1)
105 1
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(8)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(8)
|
缓存 小程序 前端开发
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(5)
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(5)
104 0
|
JavaScript Android开发 C++
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(3)
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(3)
|
存储 iOS开发 MacOS
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(2)
带你读《2022技术人的百宝黑皮书》——跨桌面端Web容器演进(2)
129 0
|
开发框架 开发工具 Windows
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(1)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(1)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(5)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(5)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(5)
|
前端开发 JavaScript API
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(17)
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(17)
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(17)
|
前端开发 开发者
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(5)
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(5)
100 0
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计: 组件驱动式Web设计(5)
|
测试技术 C++ Windows
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(7)
带你读《2022技术人的百宝黑皮书》——跨桌面端之组件化实践(7)