在大前端技术领域,当我们遇到了需要解决重复性的问题时,通常会考虑设计一个DSL(Domain-Specific Language)或者抽象出一个框架层,专门来解决这些类似的问题。使用DSL我们并不需要为特定终端编写多套代码,还可以利用宿主语言的抽象能力,确保各终端渲染效果的一致性以及对开发者友好。
目前流行DSL有:React支持的JSX语法、Vue定义的SFC结构和v-*指令集、微信小程序的WXML/WXS语法等。这些DSL最终被编译为目标代码,直接发布于小程序平台,或者借助JS-Runtime运行于APP和Web浏览器。
其中,React是函数式编程思想的实践者,最大的特点是发明了JSX语法,允许开发者使用xml的方式在JS中声明UI,并通过组件化和更加语义化的代码而非模板来高效的定义界面,以提供最大的灵活性和响应能力;React只对开发者暴露基础的生命周期和过程,更多的实现和逻辑细节则交由用户灵活定制,单纯的使用JS语言即可完成整个开发过程,有客户端开发经验的开发者将更容易上手React。
而Vue则希望通过尽可能简单的API实现响应式的数据绑定和UI组件的组合及管理,因此默认屏蔽了非常多的操作细节,这对初学者而言提供了巨大的方便;其单文件组件模板语法也更贴近原生Html5,具备Web前端基础的开发者,将能够流畅的过渡到Vue开发中。
二者的共同设计思想是虚拟DOM以及数据驱动视图更新,设计目的都是为了降低Web开发的复杂度,提升编码体验以及开发和维护效率,让开发者聚焦在业务上。
随着移动互联网的迅猛发展,前端技术的范畴已经从Web前端扩展到移动端H5,Android& iOS App,小程序等多端,业务重心也转移到移动端。而经过多年发展的React和Vue已经变得臃肿,难以适应多端背景下,更个性化和深入下层的应用场景,我们迫切需要从已有的技术中提取精华,构建出更简单轻巧,能够对不同端的特性实现针对性优化和处理的能力。
APICloud新产品前沿谍报
即将发布的全新AVM(APICloud View Model)是APICloud基于标准H5子集设计的DSL中间语言编程框架,其可具备如下能力:
● Virtual DOM:通过虚拟DOM,渲染到不同终端,充分尊重系统特性,为不同终端执行差异处理,实现高效渲染;
● 组件化:高可重用性、可组合性、可维护性的架构设计,隐藏了复杂的DOM结构和行为,让开发者专注于应用的功能和外观;
● 数据绑定:轻松将数据源绑定到应用用户界面,降低逻辑复杂性和开发难度;
● 状态管理和路由:有效分离用户界面和数据处理,实现项目的工程化管理;
● 类Vue语法和兼容React JSX,兼具Vue的轻巧和React的灵活性。
APICloud DSL最终可编译为标准JS,通过DeepEngine渲染到app端和Web端,或者编译为微信小程序代码,用于微信小程序平台发布。
APICloud DSL使用Vue方式定义组件或页面:
APICloud DSL使用兼容React JSX方式定义组件或页面: