思否开源项目推介丨Remax:使用 React 构建跨平台小程序

clipboard.png

开源项目名称:Remax
开源项目负责人:@yesmeck
开源项目简介:使用 React 构建跨平台小程序
开源项目类型:团队开源项目
项目创建时间:2019 年
GitHub 数据:3K Star,211 Fork
GitHub 地址:http://github.com/remaxjs/remax

项目介绍

clipboard.png

Remax 将 React 运行在小程序环境中,让你可以使用完整的 React 进行小程序开发。

  • 真正的 React - 不同于静态编译的方案,在 Remax 中使用 React 没有任何限制,包括 React Hooks。你可以把 Remax 理解为针对小程序的 React Native。
  • 多端支持 - 使用 Remax 把代码转换到多个小程序平台。
  • TypeScript - 完整的 TypeScript 支持,给你满满的安全感。

Remax 的实现原理

clipboard.png

Remax 本身分为两个部分,remaxreamx-cliremax 提供运行时,remax-cli 提供构建功能。其中Remax 的运行时本质是一个通过 react-reconciler 实现的一个小程序端的渲染器。

Remax 把 React 和 ReactReconciler 运行在小程序的逻辑层中,并通过 Remax 把生成的「虚拟 DOM」渲染到视图层。从而做到了使用真正的 React 去构建小程序。

且受 CSS 属性名前缀的启发,Remax 团队重新设计了 Remax 的跨平台方案。 团队非常克制地选取了 9 个基础组件,统一了他们之间非平台私有的属性,并且以属性名前缀的方式来支持各个平台私有的特性。Remax 团队希望开发者在做跨平台开发时能清楚地意识到使用者写下的这行代码只会在特定的平台上生效。

对了,Remax 默认支持 TypeScript 开发,提供完整的组件和 API 类型定义,为你的项目保驾护航。

思否推荐

内容介绍里有一个点没有提到,Remax 是蚂蚁金服前端团队开源的项目,能够很好保证项目的质量。Remax 口号是使用真正的 React 构建跨平台小程序,相比 Taro 静态编译的方式实现的复杂度,Remax 更像是新的 React 渲染器,技术层面要简单很多。

Remax 还原 React 的开发体验,默认支持 TypeScript 开发、多端支持也是基础特性。借用开发者的话:把 React 运行在小程序中可以带来非常大的想象力。小程序本身可以说是一种创新,它把应用分为两层来提高视图层的渲染速度,但是微信从一开始就选择使用私有且落后(起码目前看来是落后的)的技术方案来定义小程序,而后面的追随者为了吸引开发者亦使用了跟微信小程序类似的设计。Remax 希望能打破这个局面,通过开放的生态为开发者带来全新的小程序开发体验。


clipboard.png

该项目已入选「SFOSSP - 思否开源项目支持计划」,我们希望借助社区的资源对开源项目进行相关的宣传推广,并作为一个长期项目助力开源事业的发展,与广大开发者共建开源新生态。

有意向的开源项目负责人或团队成员,可通过邮箱提供相应的信息(开源项目地址、项目介绍、团队介绍、联系方式等),以便提升交流的效率。

联系邮箱:pr@segmentfault.com

clipboard.png


SegmentFault_行业快讯
第一时间为开发者提供行业相关的实时热点资讯

思否编辑部官方账号,欢迎私信投稿、提供线索、沟通反馈。

4k 声望
116.9k 粉丝
0 条评论
推荐阅读
抖音私域:三域互通后的流量新生态
在这个「后流量时代」,只浪费一半似乎都已经成为极具性价比的操作,无论是平台还是 B 端企业,都急需颠覆传统的流量模型,打造一种可以健康流转的流量新生态。

阿遂6阅读 14.5k评论 1

深入理解React Diff算法
fiber上的updateQueue经过React的一番计算之后,这个fiber已经有了新的状态,也就是state,对于类组件来说,state是在render函数里被使用的,既然已经得到了新的state,那么当务之急是执行一次render,得到持有新...

nero31阅读 11.8k评论 3

探索小程序底层架构原理
双线程架构在这之前,我们先来思考一个问题,小程序在架构上为什么会选择双线程?为什么是双线程?加载及渲染性能小程序的设计之初就是要求快速,这里的快指的是加载以及渲染。目前主流的渲染方式有以下3种:Web...

南玖16阅读 2.7k评论 2

封面图
微信小程序的开发踩坑
前言记录一下在开发小程序的时候遇到的问题,笔记跟坑我都稍微写一点关于开发的一. 生命周期和路由跳转实在记不住( = = ||),但是用到的几率挺高,所以就索性抄下来了1.页面的生命周期onLoad—-监听页面加载onRead...

bug之所措11阅读 27.1k

把React新文档投喂给 GPT-4 后...
大家好,我卡颂。最近,React新文档终于上线了。从内容上看,新文档包括:理论知识、学习指引API介绍从形式上看,新文档除了传统的文字内容,还包括:在线Demo示意图小测验可以说是阅读体验拉满。但是,由于文档...

卡颂7阅读 6.1k评论 3

封面图
PDF 预览和下载你是怎么实现的?
在开发过程中要求对 PDF 类型的发票提供 预览 和 下载 功能,PDF 类型文件的来源又包括 H5 移动端 和 PC 端,而针对这两个不同端的处理会有些许不同,下文会有所提及。

熊的猫7阅读 1.7k评论 1

封面图
第九期:前端九条启发分享
下图是一个常见的列表, 点击列表里的详情按钮会跳到详情页, 那么也许我们在详情页修改了数据状态, 此时可能需要把修改后的状态直接传给列表页从而本地直接更新列表, 这样就不用发送新的api请求与后端交互了。

lulu_up8阅读 462

思否编辑部官方账号,欢迎私信投稿、提供线索、沟通反馈。

4k 声望
116.9k 粉丝
宣传栏