跨平台移动轻量级动态装配式软件开发框架设计研究

左海春

跨平台移动轻量级动态装配式软件开发框架设计研究

左海春

(广州南洋理工职业学院信息工程学院,广东 广州 510925)

随着进入移动互联时代,越来越多的开发者致力于移动应用app开发。但是，由于移动端各类操作系统的差异，导致应用移植困难、开发周期长等问题。本文通过分析现有的移动跨平台技术，结合web技术和设计模式，提出跨平台移动轻量级动态装配式软件开发框架的解决方案。对该框架从总体设计到详细设计进行了深入探讨与研究。该框架对关键技术进行了优化设计，具有实现过程简单，开发成本低、周期短、性能优、体验优、动态易构等特点，并适合主流移动平台,具有良好的跨平台性。

移动设计；跨平台；开发框架；设计模式

1 现有移动跨平台开发实现方法分析

1.1 虚拟机的应用模型

虚拟机通过软件模拟出一个完整的计算机系统，运行在虚拟机上应用软件,不受真机的系统软件与硬件的影响，使应用软件具有跨平台性。例如Adobe AIR应用虚拟机，是最典型的利用虚拟机实现的跨平台应用，可以在不同的操作系统中高效运行，其主要特点:系统资源占用率低，具有丰富的互联网应用，其表现良好的运行速度和顺畅动画视觉。例如java虚拟机，它是java语言的运行环境，软件运行在虚拟机上，而不是真机上，因此使用java程序应用非常广泛。由于它具有很好的跨平台性，使得java最具吸引力。在移动应用领域，运行基于AIR平台及基于java虚拟机平台上开发的应用程序必须在客户端安装虚拟机，受制于硬件及系统平台的支持,给客户端带来负担。目前，ios平台已宣布将不提供支持Flash技术的web引擎，而基于移动平台java虚拟机实现较困难。

1.2 B/S的应用模型

web app开发是一种基于HTML5框架开发模式，这种模式下的应用程序ui通过浏览器来解析呈现，具有天生的跨平台优势。该模式S端为HTML5云服务器,B端为APP应用客户端。app开发只需安装客户应用的框架部份，而ui则通过网络去云端取数据呈现给移动用户。bootstrap的ui，看起来还是网页风格，不像原生app的ui控件，用户体验差；国内现有流行mui框架，以ios 7的ui为基础，补充了部分android系统特有的ui控件，比较接近原生app的ui体验，但无法调用手机终端的硬件设备。

2 移动跨平台动态装配式开发框架总体设计

本框架的设计与实现是基于B/S体系和虚拟技术相给合，通过创新改良客户组件技术，引入虚拟DOM技术，云数据引擎技术，以及移动设备JS API接口设计，提出了跨平台移动轻量级动态装配式软件开发框架。它具有B/S和虚拟技术开发优点,同时有更高的开发效率与开发学习低成本,真正实现原生ui体验。

2.1 总体设计思想

本框架是基于跨平台轻量级动态装配式移动软件开发,这种模式中云服务器负责业务处理，客户端只负责视图，业务与视图通过双向数据通道相连。该框架专注于MVC架构中的V，实现视图组件化。从ui出发抽象出不同的组件，然后客户端软件界面像搭积木一样把它们拼装起来。本框架总体设计如图1所示。本框架分七层体系设计，引入组件库，数据模块，页面模块,数据引擎，虚拟DOM，组件渲染引擎，移动设备JS API接口等分布在不同层次。各个组成部分相互之间采用松耦合的设计方法，尽量减少它们之间的关系。例如虚拟DOM，开发者操作虚拟DOM，将它们渲染到真正的 DOM上，这样改善了原DOM加载慢问题，提高程序性能。同时也引入不同平台的渲染引擎，如将应用代码渲染到云服务端的DOM，或者ios/android平台组件,实现跨平台移动软件开发。例如组件库技术，开发人员可以根据组件规范，扩展开发出个性化的组件,应用于自己的应用程序,这种设计，帮助开发人员提高开发效率，并提高开发项目的稳定性。总体上，本框架是一个松耦性框架，各个组成部分相对独立，也能自我扩展，个性化应用。

图1 跨平台移动应用开发框架 图2 组件库模型

2.2 组件库设计

如图2所示，基于组件体系设计，开发者可以像搭积木一样制作移动应用程序，组件也可以嵌套子组件形成新的组件，新的组件又可以当作子组件嵌套至任意组件形成新的组件，由于组件根据规范，可以扩展功能，也可以自定义组件，新开发的组件可以放入组件库中，也可上传到云组件库共享，这样组件功能越来越丰富，组件越来越多，这样开发人员可用组件越来越多，节省了UI组件开发设计的时间成本，提高了开发效率。本框架组件设计，通过虚拟DOM及VIEW组件渲染技术,实现在B/S模式下原生app的用户体验。

2.3 移动设备JSAPI接口设计

通过javascript脚本调用本地设备JS API，采用异常通信技术发送请求，实现对底层设备的操作，设备接收到处理消息后通过执行脚本组件的loadinit方法来实现脚本的回调。这一设计实现了对不同移动设备操作DOM不带来影响。是本框架具有强大的跨平台能力原因之一。其本质是使用异步方式与设备通信，在不需要下载插件或者小程序的情况下，使应用程序具有非常迅速的响应能力,改善了程序性能。

3 移动跨平台动态装配式开发框架层次设计

本框架设计成七个层次，各个层次之间是相互独立与相互协作。移动开发人员根据框架规范进行配置(配置模块)，在不需了解框架内部结构情况下就能高效地开发出跨平台的移动应用系统。利用本框架开发，第一步，加载轻量级javascript引擎，进行页面初始化。第二步，在云服务器下载组件或自己开发设计组件，经过配置，然后通过拖曳方式设计移动用户程序界面。第三步，配置数据引擎，运行应用程序，从云服务器端异步加载组件数据，对于大数据可以本地缓存,再呈现,如表格组件中的数据，可以设置成在缓冲中加载数据，当缓冲中数据不够或失效时，数据引擎会自动向云服务器取数据。第四步，优化与测式，通过测试网络加载性能，优化配置参数，例如去掉不必请求连接，提高加载速度，达到软件最优状态。现对框架中的虚拟DOM，数据引擎进行详细设计说明。

3.1 虚拟DOM详细设计

用javascript对象表示DOM 信息和结构，当状态变更的时候，重新渲染这个 javascript 的对象结构。虚拟DOM是保留了Element之间的层次关系和一些基本属性。虚拟DOM里每一个Element实际上只设置有用的几个属性，所以比BW DOM快很多。具体算法实现：(1)用 javascript 对象结构表示 DOM 树的结构；然后用这个树构建一个真正的 DOM 树，插到文档当中;(2)当状态变更的时候，重新构造一棵新的对象树。然后用新的树和旧的树进行比较，记录两棵树差异;(3)把所记录的差异应用到步骤(1)所构建的真正的DOM树上，视图就更新了。

3.2 数据引擎详细设计

客户端组件到云服务器端的数据传递由数据引擎来完成，客户端的数据获取与存储也是由数据引擎完成。数据引擎在客户端与服务器间形成一条数据通道，实现对客户组件数据抽注。客户端提交请求的数据先提交给数据引擎存储，然后再将数据发送给服务器。在服务器对应的业务程序被执行，然后把需要返回的数据存储到数据引擎中，最后通过解析，由客户端展示显示出来。

数据引擎由单独的一个类设计而成，执行算法如下：

(1)执行then方法，CDEngine异步操作成功时,执行回调方法进入callbacks队列；(2)创建CDEngine实例时传入的函数赋予给另一函数的参数，即resolve，参数value表示异步操作返回的结果，当then方法执行成功后，将调用resolve方法，这时候将callbacks队列中的回调函数将全部执行。

4 结语

本文通过分析现有的跨平台技术，结合web技术和设计模式，提出跨平台移动轻量级动态装配式软件开发框架的解决方案。本框架实现前后端高度解耦,前端的所有逻辑处理均使用JS进行处理，而后端为纯粹的业务逻辑处理;前端开发面向组件对象化,通过JS面向对象特性进行简单封装，在业务逻辑数据请求的处理上，与后端数据类型、实体结构以及处理逻辑上保持一致;由于该框架对关键技术进行优化设计，运用该框架开发，具有实现过程简单，开发成本低、周期短、性能优、体验优、动态易构等特点，并适合主流移动平台,具有良好的跨平台性。

[1] 刘玉.基于跨平台的移动应用开发框架研究[D].北京交通大学，2014.

[2] 刘海岩,梁建龙.基于中间件的分布式系统开发过程的研究[J].计算机应用研究，2004，(01).

[3] 刘林.基于多模式的软件项目开发过程管理系统设计与实现[D].山东大学，2014.

Researchondevelopmentframeworkdesignofcross-platformmobilelight-weightdynamicfabricatedsoftware

ZUOHai-chun

(GuangzhouNanyanPolytechnic,GuangzhouGuangdong510925,China)

As the era of mobile internet is ushering in，an increasing number of developers are engaged in development of mobile applications.Because of different operational systems in mobile terminals，all applications face the problems such as transplantation difficulty and long development cycle.This paper，based on the existing cross-platform mobile technology and combined with web technology and design pattern，put forward a solution to development framework design of cross-platform mobile light-weight dynamic fabricated software.The overall and detailed designs of the framework are explored and studied deeply in this paper.The framework optimizes the key technology，using it for development has advantages of low cost，short cycle，excellent performance，great experience，and dynamic reframing，so that it will suit the mainstream mobile platform and have good cross-platform ability.

Mobile design；Cross-platform;Development framework;Design pattern

2017-08-07

左海春(1977-),男，硕士,高级工程师，主要研究方向:软件工程,软件应用研究,网络安全研究.

1001-9383(2017)03-0007-04

TP311

A