• 中文
  • ENGLISH
Rax深入浅出 – 开篇
2017/02/09

本系列文章,主要围绕Rax/Weex展开,由浅入深讲解《如何一站式开发一个·跨平台应用·》。

在学习本文档之前:

  • 如果,你还不了解Weex是什么?赶紧去【Weex官网】看看。
  • 如果,你不清楚Rax是什么?没关系..,只要你接触过React,稍微看看【Rax官网】,你就会知道怎么使用Rax!

本文档主要由「基础篇」、「高级篇」、「原理篇」和「实战篇」四部分部分组成。

  • 基础篇:从「Hello World」例子说起,介绍如何使用Rax编写一个简单的Weex应用。
  • 高级篇:一个完整的Weex应用在上线前,区别于传统的Web应用,需要注意哪些优化点。
  • 原理篇:将会深入Weex和Rax源代码,了解它的运行原理架构思路
  • 实战篇:将实际的上线项目作为案例,讲解如何从0到1开发一个复杂的Weex应用。

本系列,所有示例代码大部分均使用Rax编写。

所以,在进入下一个话题之前,请务必先弄懂以下几个问题:

  • Weex是什么?
  • Rax是什么?

What is Weex

A framework for building Mobile cross-platform UI.

官方描述:一个构建移动端跨平台UI的框架

关键词:

  • mobile:移动端
  • framework:框架
  • cross-platform:跨平台(Web/IOS/Android)

Why use Weex

Weex之所以能够在前端社区中脱颖而出,主要归功于它的两大特性:

  • Cross-Platform:跨平台/容器
  • Native Speed:Native性能和体验

如果说,早前的Hybrid API开放了前端开发者调用Native Module的能力,那么Weex做到的远不止于此,它还赋予了前端开发者渲染Native UI的能力。

相较于,早前React带来的Learn Once, Write Anywhere,Weex所提倡的Write Once Run Everywhere,100%的代码跨平台复用,减少的不仅是学习成本,还有真真实实合二为一的开发成本

What is Rax

A universal React-compatible render engine.

官方描述:一个通用的跨容器的渲染引擎

关键词:

  • universal:跨容器(Browser/Native/Node)
  • React-compatible:React语法基本兼容

Rax,除了像React一样支持Browser和Node端渲染之外,通过weex-rax-framework还实现了基于Weex的Native端渲染,简而言之:使用Rax – React DSL,可以开发Browser/Native/Node三端的应用

Why use Rax

Weex本身是Vue@1.x的语法糖,如果你和你的团队的技术栈之前就是React,并没有Vue,那么Rax将是一个不错的选择。

由于Rax基于React DSL,所以天生就享有React社区所带来的一些资源,比如:Redux

此外,相比于React,它的优势:

  • 渐进渲染模式,白屏时间更短
  • 8.5kb(min+gzip),文件体积更小

参考资料

订阅我们