前端框架图图形展示：

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打包工具等等。