Rax 1.0 版本更新与特性介绍
作者:亚城 发布于:2019-10-16 03:47:13

Rax 1.0 版本更新与特性介绍




一些数据


本数据截止 2019 年 9 月下旬,Rax 进行了一次大版本的更新,支持了的 Hooks 的编码方式,在工程体系上支持了支付宝小程序的能力,在 Web 项目的体验上有了较大的提升。


  • 4919 commits
  • 1076 pull requests
  • 309 issues
  • 5451 stars



用户体验



Rax 1.0 在 Web 体验上做出了重大突破,更小的包体积、更好的 Web 体验以及服务端渲染让你的页面加载与预览更加流畅。



Core 体积更小以及 Hooks 写法对代码的精简让 Bundle 体积得到一定程度的瘦身,部分 API 从 Core 中剥离按需引用更加灵活。



Core 体积相对于 Rax 0.6.5 有了近一半的体积瘦身。








研发效率





多端的支持上 Rax 1.0 新增支付宝小程序。



小程序的支持方式是通过编译时 JSX 转小程序的方式。



Go Rax 是 Rax 官方组件与 API 的示例项目,可以在官网上找到并预览。







工程插件化,可以更灵活的满足各种业务需求





全新的官网,内容更加丰富。



提供更加智能的工作方式。



更加规范的设计。



开发规范



npm init rax <YourProjectName> 创建工程



区别于 0.6,Rax 1.0 必须指定 Driver。



Hooks 是 Rax 1.0 新增的特性,它可以让函数组件(Function Component)使用状态和生命周期。Rax 在实现上遵循了 React Hooks 的标准。



部分非核心 API 从 Rax Core 中被移除,以独立包的形式提供给业务使用


Example:


import findDOMNode from 'rax-find-dom-node';



Rax 支持了一种 JSX 扩展语法 JSX+,它能帮助业务开发者更爽更快地书写 JSX。JSX+ 不是一种新的概念,它是 JSX 基础上的扩展指令概念。



组件在概念上类似于 JavaScript 函数,它接收任意的参数(组件的参数称为“props”),然后返回一个可以被渲染的 Rax 元素。



Rax 元素的事件处理和 HTML 的 DOM 元素类似,但在语法上有一些区别:


  • 事件采用驼峰式命名。
  • 传入函数作为事件处理器而不是字符串。



Rax 中支持 内联样式和独立 css 单位,推荐使用 rpx 单位进行多端开发



  • 不同端上样式支持程度不同需要注意
  • 不同端上提供的 API 也不尽相同,需要了解各自端上特性



未来计划