前端框架图图形展示:

framework

如上图所示,WeX5前端框架(UI2)分以下部分:

  • 基础库

WeX5前端依赖的两个基础库:数据感知MVVM和jQuery,其中数据感知MVVM基于Knockoutjs改进的。

  • 模块框架

UI2遵循AMD模块标准,采用RequireJS实现。模块化是UI2的基础,UI2的所有资源(包括js、css和html等)都是模块,都采用模块化方式引入,采用模块化方式管理依赖。

  • 组件框架

组件化框架提供组件规范、组件生命周期管理能力和丰富的组件体系。组件化框架的实现本身也是基于js模块化,并且依赖基础库中的数据感知体系MVVM(基于Knockoutjs实现)和jQuery。

  • 页面框架

WeX5的页面模式支持单页模式(Single-page Application)和多页模式(Multi-page Appliction),默认实现是单页模式。

WeX5的前端是由若干个页面构成的,每个页面由三个文件(.w文件、.js文件和.css文件)组成,除了这三个文件之外,页面也可以引用其它的js模块、css模块和图片等资源。在逻辑上, 每个页面由若干个组件构成,同时页面也可以包含若干个子页面(类似HTML中的iframe)。

  • Studio开发工具

WeX5是一个开发手机应用和Web应用的快速开发平台,提供了强大的Studio开发工具,辅助用户开发,主要包括:页面可视化设计工具、丰富的页面模板向导、代码自动提示、页面编译工具、LESS工具、资源合并工具、手机APP打包工具等等。