rn源码ios_浅谈 flutter/RN/deno 架构

fd506c242afc5c94331fbd87d826a375.png

halo,大家好,我是 132,真的好久不贱了,过去一段时间忙着面试一直没怎么写代码了

虽然没怎么写代码,脑子还是一直在冥想的,这篇文章主要谈谈我的冥想结果

事情的起因是 RN 在推特说要使用 rust 重写 ios 的 js 引擎,听上去很感兴趣,于是乎就一直在思考这个问题

68769d3266d75ea4c934d82f5a57f613.png

上图为 RN 最新的 fabric 架构,说白了比旧的架构好在,不需要通过一层很大的 json 传递数据了,类似于浏览器,很多方法都可以直接调 c++(native code),可以理解为 RN 找到了一种很好的 native binding 方法

这其中,主要变化发生在 js 引擎上,也就是 android 端的 hermes,RN 主要就是 react 写 js 代码,然后 hermes 跑 js,最终生成一颗树,我们统称为 render tree,然后去映射渲染原生视图

然后,如果把 js 引擎换成 dart,把 react 的组件换成 widget,那就和 flutter 比较相似了

824d5d4d93f4b5c5dc66a0c7dbe2e702.png

上图是 flutter 的架构图,也是最经典的一张图,可以看到,一部分是 dart framework,一部分是 skia

dart framework 就相当于 js 引擎,它负责跑 dart 源码,也包含了俩组件库

他们都是渲染出一个 render tree

它的好处主要是,dart 在 android 和 ios 都有一致的 native binding,不需要和 RN 一样,写两个 js 引擎去分别适配

同时,flutter 和 RN 最大的不同在于,flutter 底层是使用 skia 进行渲染,每一个组件相当于一个 skCanvas,比 RN 纯粹得多

其实到这里,我们已经比较清楚他们的架构,如果让我选,可能我会搞一个他们的组合:

1. 和 RN 一样,使用 js 引擎跑 js 而不是使用 dart
2. 和 flutter 一样,使用 skia 进行渲染

但,这不是,重点

就像文章开头提到的,事情的最初是因为 rust,因为无论如何,RN 和 flutter 我早就知道了,但我一直没什么兴趣,直到 RN 提出 rust 重写 js 引擎之后

接下来谈一下 deno

6b7c12a6a338fa15b9e8be87cb09ae37.png

上图是很老的一张图,我实在找不到新的了,但是总的来说,deno 主要是 rust 去调 v8 跑 js,然后使用 rust 本身的能力去实现大部分功能,比如 tokio

为什么使用 rust?

因为 rust 是一门现代语言,它独特的内存管理机制决定了它特别适合做跨语言跨平台的事情,而且它真的是现代语言,有非常好的包管理,不需要各种的编译

以往,我虽然对底层的东西有兴趣,但我对传统语言,如 java,c++ 等望而却步,我认为这些臃肿弱智的家伙,不符合我的性格

deno 其实和 RN 和 flutter 也是可以联系到一起的,因为他本质上也是跑了个 js 引擎,只是这个 js 引擎是 v8,不负责 UI 的 binding 而已

但同样的思路是完全可以复刻的,不难发现,其实这些东西,套路都是一样一样的,就像我们写前端框架,都是套路都是套路

所以如果让我选,我可能

1. 和 RN 一样,使用 js 引擎跑 js 而不是 dart
2. 和 flutter 一样,使用类似的渲染管线,而且使用 skia 进行渲染
3. 和 deno 一样,使用 rust 进行 js 引擎与 skia 的绑定而不是 cpp

是的你没有看错,和前端框架一样,框架作者只需要打出不同的组合

我特别喜欢这个充满套路的世界,换个方向,又是一场组合游戏

望天,竟然扯了这么多

以上,就是近期冥想的内容,谢谢观看

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值