Weex

2016年4月21日,阿里巴巴在Qcon大会上宣布跨平台移动开发工具Weex开放内测邀请。

Weex

是一套简单易用的跨平台开发方案,能以 web 的开发体验构建高性能、可扩展的 native 应用,为了做到这些,Weex 与 Vue

合作,使用 Vue 作为上层框架,并遵循 W3C 标准实现了统一的 JSEngine 和 DOM API,这样一来,你甚至可以使用其他框架驱动

Weex,打造三端一致的 native 应用。

Weex能够完美兼顾性能与动态性,支持iOS、安卓、YunOS及Web等多端部署。

其工作原理

Weex

表面上是一个客户端技术,但实际上它串联起了从本地开发环境到云端部署和分发的整个链路。开发者首先可以在本地像撰写 web 页面一样撰写一个

app 的页面,然后编译成一段 JavaScript 代码,形成 Weex 的一个 JS bundle;在云端,开发者可以把生成的 JS

bundle 部署上去,然后通过网络请求或预下发的方式传递到用户的移动应用客户端;在移动应用客户端里,WeexSDK 会准备好一个

JavaScript 引擎,并且在用户打开一个 Weex 页面时执行相应的 JS bundle,并在执行过程中产生各种命令发送到 native

端进行的界面渲染或数据存储、网络通信、调用设备功能、用户交互响应等移动应用的场景实践;同时,如果用户没有安装移动应用,他仍然可以在浏览器里打开一个相同的

web 页面,这个页面是使用相同的页面源代码,通过浏览器里的 JavaScript 引擎运行起来的。


Mint UI

基于 Vue.js 的移动端组件库

Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要。通过它,可以快速构建出风格统一的页面,提升开发效率。

真正意义上的按需加载组件。可以只加载声明过的组件及其样式文件,无需再纠结文件体积过大。

考虑到移动端的性能门槛,Mint UI 采用 CSS3 处理各种动效,避免浏览器进行不必要的重绘和重排,从而使用户获得流畅顺滑的体验。

依托 Vue.js 高效的组件化方案,Mint UI 做到了轻量化。即使全部引入,压缩后的文件体积也仅有 ~30kb (JS + CSS) gzip。


vue-carbon

基于 vuejs 1.0 开发 material design 风格的移动端 WEB UI 库

使用文档地址 https://myronliu347.github.io/vue-carbon/book/v0.5.0/index.html


Muse-UI

基于 Vue 2.0 和 Material Desigin 的 UI 组件库

特性

1.组件丰富

Muse UI 基本实现了 Material Design 设计规范类的所有组件,另外还开发许多的功能性的组件

2.可定制

Muse UI 使用less文件,所有的颜色都有一个变量维护,通过编写 less 文件完成自定义主题,另外组件内部也提供一些修改效果的参数

3.基于 Vue 2.0

Muse UI 基于 Vue2.0 开发,Vue2.0是当下最快的前端框架之一,小巧,api友好,可用于开发的复杂单页应用


VUWE

vuwe是一款基于微信WeUI所开发的,专用于Vue2的组件库。

它与WeUI完全解耦。用户通过自定义WeUI的样式文件,可以方便地对VUWE实现定制化。

vue-mobile

vue-mobile is an UI Framework build with Vue.js for SPA:

Full Page Structure - header, content, footer

Page transition support by vue-router

Bunch of Powerful Components, easy to use and extend

high performance CSS3 Animation

1px border for all components - as well as round border

Write with Vue - the most important


vonic

一个基于 vue.js 和 ionic 样式的 UI 框架,用于快速构建移动端单页应用。

和 ionic 的关系:没有关系,只是在样式方面以 ionic 的 css 文件为基础(做了一些调整)


vux

Vux(读音 [v'ju:z],同views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。

基于webpack+vue-loader+vux可以快速开发移动端页面,配合vux-loader方便你在WeUI的基础上定制需要的样式。

vux-loader保证了组件按需使用,因此不用担心最终打包了整个vux的组件库代码。

vux并不完全依赖于WeUI,但是尽量保持整体UI样式接近WeUI的设计规范。最初目标是创建一个易用,实用,美观的移动端UI组件库,现在离理想状态还有不少距离,因此需要大家及时反馈问题及贡献代码。

即使你不使用vux的代码, 但能从源码得到一些参考那么也是件让人高兴的事情。


更多angular1/2、ionic1/2、react、微信小程序等技术文章、视频教程和开源项目,请关注微信公众号——ionic实战

vue移动端框架到底哪家强的更多相关文章

  1. 学习Vue.js之vue移动端框架到底哪家强

    官网:https://cn.vuejs.org/. 转载:http://www.cnblogs.com/8899man/p/6514212.html Weex 2016年4月21日,阿里巴巴在Qcon ...

  2. ANDROID 推送到底哪家强(转)

    之前在群里有同学问我关于推送的一些问题,解答之后我觉得这个话题还挺有用,因为几乎大部分人都会遇到这个问题,那姑且就写篇文章总结给你们吧. 1. 为什么要用推送? 推送功能可谓是现如今任何一个 App ...

  3. 贝叶斯vs频率派:武功到底哪家强?| 说人话的统计学·协和八(转)

    回我们初次见识了统计学理论中的“独孤九剑”——贝叶斯统计学(戳这里回顾),它的起源便是大名鼎鼎的贝叶斯定理. 整个贝叶斯统计学的精髓可以用贝叶斯定理这一条式子来概括: 我们做数据分析,绝大多数情况下希 ...

  4. PAT 1032. 挖掘机技术哪家强(20)

    为了用事实说明挖掘机技术到底哪家强,PAT组织了一场挖掘机技能大赛.现请你根据比赛结果统计出技术最强的那个学校. 输入格式: 输入在第1行给出不超过105的正整数N,即参赛人数.随后N行,每行给出一位 ...

  5. PAT乙级 1032. 挖掘机技术哪家强(20)

    1032. 挖掘机技术哪家强(20) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 为了用事实说明挖掘机技术到底 ...

  6. PAT (Basic Level) Practise:1032. 挖掘机技术哪家强

    [题目链接] 为了用事实说明挖掘机技术到底哪家强,PAT组织了一场挖掘机技能大赛.现请你根据比赛结果统计出技术最强的那个学校. 输入格式: 输入在第1行给出不超过105的正整数N,即参赛人数.随后N行 ...

  7. .NET ORM 哪家强

    ORM到底哪家强? 很多人都想知道这个问题,自已也没测试过,只能道听途说. 闲的无聊就将几个ORM拿出来比一比,假如怀疑测试代码有问题可以将它下载下来慢慢研究. 参赛ORM 1.SqlSugar:是一 ...

  8. 挖掘机技术哪家强(c++实现)

    描述:为了用事实说明挖掘机技术到底哪家强,组织一场挖掘机技能大赛.现请你根据比赛结果统计出技术最强的那个学校. 输入:输入在第1行给出不超过105的正整数N,即参赛人数.随后N行,每行给出一位参赛者的 ...

  9. PAT-乙级-1032. 挖掘机技术哪家强(20)

    1032. 挖掘机技术哪家强(20) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 为了用事实说明挖掘机技术到底 ...

随机推荐

  1. js架构设计模式——前端MVVM框架设计及实现(二)

    前端MVVM框架设计及实现(二) 在前端MVVM框架设计及实现(一)中有一个博友提出一个看法: “html中使用mvvm徒增开发成本” 我想这位朋友要表达的意思应该是HTML定义了大量的语法标记,HT ...

  2. 使用DatePickerDialog、TimePickerDialog

    DatePickerDialog与TimerPicker的功能比较简单,用户也简单,只要如下两步即可. ①通过new关键字创建DatePickerDialog.TimePickerDialog实例,调 ...

  3. 选项卡(TabHost)的功能与用法

    TabHost是一种非常实用的组件,TabHost可以很方便地在窗口上放置多个便签页,每个标签页相当于获得了一个与外部容器相同大小的组件摆法区域.通过这种方式,就可以在一个容器里放置更多组件,例如手机 ...

  4. swift webView的高度自适应内容

    废话不多 直接上代码 //在webView的协议方法里实现以下代码 func webViewDidFinishLoad(webView: UIWebView) {//加载完成 //        se ...

  5. Refused to set unsafe header "Connection"

    参考 http://stackoverflow.com/questions/7210507/ajax-post-error-refused-to-set-unsafe-header-connectio ...

  6. Runtime of Objective-C

    [0] Outline --  [1] 版本和平台 --  [2] 与Runtime System交互 --  [3] 方法的动态决议 --  [4] 消息转发 --  [5] 类型编码 --  [6 ...

  7. SuperSocket入门(二)- 探索AppServer、AppSession,Conmmand和App.config

          在上一篇文章中,我们已经了解到了如何在SuperSocket处理客户端请求. 同时我们可能会发现一个问题,如果我们的服务器端包含有很多复杂的业务逻辑,这样的switch/case代码将会很 ...

  8. HDU5914

    Triangle Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total Su ...

  9. Yii2 独立操作

    看到最近有些人在问 yii2 独立操作相关的东西,在这做简单的说明吧, 平时核心业务逻辑一般用的还是比较少的.因为  独立操作 出现的原因 是 对重复被使用的操作进行简化,或 分配一个 额外处理逻辑的 ...

  10. ArcGIS API for JavaScript 4.2学习笔记[2] 显示3D地图

    3D地图又叫场景. 由上一篇可知, require入口函数的第一个参数是字符串数组 ["esri/Map", "esri/views/MapView", &qu ...