Weex 教程

🌙
手机阅读
本文目录结构

Weex 是什么

Weex 是阿里发布的一款用 WEB 方式开发原生 app 的开源产品

官网介绍:Weex 是一个可以使用现代化的 Web 技术开发高性能原生应用的框架。

Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验,来构建 Android、iOS 和 Web 应用。简单来说,在集成了 WeexSDK 之后,你可以使用 JavaScript 语言和前端开发经验来开发移动应用。

Weex 渲染引擎与 DSL 语法层是分开的,Weex 并不强依赖任何特定的前端框架。目前 Vue.js 和 Rax 这两个前端框架被广泛应用于 Weex 页面开发,同时 Weex 也对这两个前端框架提供了最完善的支持。Weex 的另一个主要目标是跟进流行的 Web 开发技术并将其和原生开发的技术结合,实现开发效率和运行性能的高度统一。在开发阶段,一个 Weex 页面就像开发普通网页一样;在运行时,Weex 页面又充分利用了各种操作系统的原生组件和能力。

概述

Weex 能够完美兼顾性能与动态性,让移动开发者通过简捷的前端语法写出 Native 级别的性能体验,并支持 iOS、安卓、YunOS 及 Web 等多端部署。对于移动开发者来说,Weex 主要解决了频繁发版和多端研发两大痛点,同时解决了前端语言性能差和显示效果受限的问题。

开发者只需要在自己的 APP 中嵌入 Weex 的 SDK,就可以通过撰写 HTML/CSS/JavaScript 来开发 Native 级别的 Weex 界面。Weex 界面的生成码其实就是一段很小的 JS,可以像发布网页一样轻松部署在服务端,然后在 APP 中请求执行。

与 现有的开源跨平台移动开放项目如 Facebook 的 React Native 和微软的 Cordova 相比,Weex 更加轻量,体积小巧。因为基于 web conponent 标准,使得开发更加简洁标准,方便上手。Native 组件和 API 都可以横向扩展,方便根据业务灵活定制。Weex 渲染层具备优异的性 能表现,能够跨平台实现一致的布局效果和实现。对于前端开发来说,Weex 能够实现组件化开发、自动化数据绑定,并拥抱 Web 标准。

谈到阿 里巴巴为何要开源如此有价值的移动开发工具,阿里巴巴无线技术资深总监庄卓然表示,“阿里希望能够赋能移动开发生态,与移动开发者分享阿里的技术积累,和 开发者共同成长。我们欢迎更多的开发者和技术团队加入 Weex 开源项目,让中国的移动社区在世界上产生更大的影响。”

无 线业务快速发展,2015 财年手机淘宝用户数达 4 亿左右,去年天猫双 11 移动端成交占比高达 68%。阿里无线团队一直在探索兼顾动态性和性能的跨平台移动 开发方案。Weex 的诞生得益于阿里内部早期研发的一个通过 JSON 数据描述 native 渲染的项目 WeApp,以及 Vue.js 这款优秀的前 端开源 MVVM 框架。阿里工程师把 WeApp 优秀的渲染能力和 Vue.js 优秀的前端开发体验进行了深度结合,创造出了 Weex 这款跨平台移动 开发工具。

“目前 Weex 已经可以支持手机淘宝这样的航母级移动应用,很好的解决了动态性问题,把移动应用本身的灵活性、迭代更新的周期和 成本优化到极致。”Weex 项目负责人,阿里资深无线专家吴志华介绍,“例如支持商家在手机淘宝中实时装修自己的店铺,或是在历次大促活动中及时调整界面 信息和状态,确保在瞬息万变的活动中紧跟促销节奏。”

后续 Weex 会依托阿里百川为移动开发者提供开源支持和社区交互,帮助更多开发者快速学习和应用。在当天的 QCon 大会上,阿里百川与极客邦科技达成战略合作伙伴,共建移动开发者生态,为中国的移动开发者营造更优秀的社区氛围和成长环境。

使用前端框架

Weex 应用需要依赖前端框架来编写,但 Weex 并没有绑定、限制在特定的框架上。目前 Vue.js 和 Rax 是最广泛应用于 Weex 开发的前端框架,也是目前功能最全、最稳定的方案。

  • Vue.js 是一个不断进化中的前端框架。
  • Rax 是提供类 React 语法和兼容性的前端框架。
  • Vue.js 和 Rax 都已经集成到 Weex 中,并默认提供。

将自己喜欢的前端框架和 Weex 进行结合是可以的,但并不是那么容易。我们也在不断开发和简化这种接入工作,如果想了解如何做,或有任何想法可以和我们联系。你也可以先阅读一下 使用前端框架 这篇文档了解它是做什么的。

产品服务

对于移动开发者来说,Weex 主要解决了频繁发版和多端研发两大痛点,同时解决了前端语言性能差和显示效果受限的问题。开发者可通过 Weex 官网申请内测。 开发者只需要在自己的 APP 中嵌入 Weex 的 SDK,就可以通过撰写 HTML/CSS/JavaScript 来开发 Native 级别的 Weex 界面。Weex 界面的生成码其实就是一段很小的 JS,可以像发布网页一样轻松部署在服务端,然后在 APP 中请求执行。

AXIHE / 精选教程

浏览全部教程

HTML

CSS

JS

书籍推荐