注册 / 登录

新时代UI架构的思考

分会场:  爆款架构/数据平台/工程实践

分享时间: 2017年11月9日 - 12日

案例来源 :

案例讲师

程劭非(winter)

淘宝 高级前端技术专家

winter,程劭非,淘宝高级前端技术专家,在微软做过WinCE浏览器,在盛大做过电子书,现在在淘宝网负责前端框架。

扫描二维码分享案例

 

案例简述

 

我会分享一些近期关于UI架构的思考。从UI架构的历史出发,讲到现代UI框架带来的复杂性,用我们在实施中遇到的问题和解决方案来阐述一种新的架构风格:以表达式为核心的UI架构风格。

 

案例目标

 

从计算机诞生开始,输入和输出设备组成了UI,程序员们对UI架构的思考从来没有间断过,1979年的MVC到最新的Redux,UI架构领域在配合计算机的发展逐渐地诞生新的理论。 随着weex和rn这样的原生+JS框架发展,我们面对的UI架构环境更加趋于复杂,UI架构中使用到的语言就包括了标记语言、脚本语言和原生代码,在这样的环境里我们要解决的不仅仅是数据的流向和事件的传导,还要考虑各个语言层的通讯开销。

 

成功(或教训)要点

 

我们试图提炼出一种新的模式,它借鉴函数式语言中lambda的“函数即表达式”的想法,把表达式当做UI架构中各个语言层通讯的一种数据结构,通过构建过程避免掉诸如redux之类纯靠约定的函数式的问题。 我们把这个技术和架构用在手势、陀螺仪、滚动、动画等UI编程的富交互场景,一方面补充了React等框架对View层的忽略,另一方面解决了Native和JS通讯的开销问题,在产品中完成了很多之前此类UI难以完成的效果。

 

案例ROI分析

 

更新中...

 

案例启示

 

以表达式为核心的定义,约束了代码的结构,使得使用者对UI的抽象风格趋于一致。