当前位置: 首页 > article >正文

浅谈跨平台框架的演变(H5混合开发->RN->Flutter)

引言

这里分为四个阶段:

第一阶段 : 原生开发

第二阶段 : H5混合开发

第三阶段: 跨平台RN

第四阶段: 跨平台Flutter

正文

第一阶段: 原生开发

开发成本比较大 : 需要Android 和ios 开发两端。

动态化需求 : 需求变化 需要发版本。

第二阶段:H5 混合开发

WebView 担任桥梁JavaScript 与原生API之间通信的Bridge桥梁。

用于在javaScript 与原生之间的通信工具 WebView javaScript   Bridge (JsBridge)

如图:

缺陷:

WebView 性能堪忧 

webView 会引起内存泄漏。Android 自身问题,webView 在运行中,消耗的内存无法及时回收。

所以我们在用webView 把它移到一个单独进程中。

Android WebView性能优化(一) - 简书

WebView内存泄露的解决方案 - 简书

WebView内存泄露终结解决方案 - 简书

Android调用js的坑 - 简书

第三阶段 : 跨平台RN

H5 作为第二阶段的性能瓶颈, RN通过桥梁完成原生绘制 ,以达到更优的性能。

讲解:

用js写出配置文件(相当于xml),通过bridge 发给平台,然后平台根据配置文件去创建相应的原生控件。所以RN渲染方式是用原生方式渲染。

缺陷:

javaScript 通过 Bridge 传递到native完成原生绘制,bridge的成本高,因为需要频繁的跨桥调用,导致卡顿等性能。

第四阶段 :跨平台 Flutter

那么我们就要考虑能不能干掉“桥” , 所以flutter就是干掉了桥,利用DVM(dart虚拟机)减少桥的交互。

原理如下图:

Flutter 架构

 

framwork 提供了各种基础组件库,包括widget。动画等。

Engine  Skia渲染。Drat VM 等。

 

性能和特点:

性能稍微低于原生。

单线程,不存在上下文切换的性能损耗 ;不需要锁 不存在数据竞争和数据同步问题。

多生代无锁垃圾回收器,专门为ui框架中常见的大量Widgets对象创建和销毁优化。


http://www.kler.cn/a/595300.html

相关文章:

  • 【C++11】左值引用、右值引用、移动语义和完美转发
  • 编程语言选择分析:C#、Rust、Go 与 TypeScript 编译器优化
  • 【华为Pura先锋盛典】华为Pura X“阔折叠”手机发布:首次全面搭载HarmonyOS 5
  • 城市更新浪潮下的破局之道:中建海龙模块化集成建筑技术的新应用
  • 2020年全国职业院校技能大赛改革试点赛高职组“云计算”竞赛赛卷第三场次题目:公有云部署与运维
  • centos 9 编译安装 rtpengine
  • 【Agent】Dify Docker 安装问题 INTERNAL SERVER ERROR
  • 如何提高G口服务器的安全性?
  • springboot整合modbus实现通讯
  • dfs刷题排列问题 + 子集问题 + 组和问题总结
  • 超出了存储过程、函数、触发器或视图的最大嵌套层数(最大层数为 32) 进行问题排查
  • python中所有内置类型
  • 20250321在荣品的PRO-RK3566开发板的buildroot系统下使用ll命令【直接编译进IMG】
  • 单臂路由实验
  • ubuntu 解挂载时提示 “umount: /home/xx/Applications/yy: target is busy.”
  • 【Linux】Makeflie CMake快速上手指南
  • IoTDB TTL不生效
  • 无人设备遥控器之信道编码技术篇
  • 【AI-Coding】2025再实现简单的省市联动
  • 代码随想录第55期训练营第八天|LeetCode344.反转字符串、541.反转字符串II、卡码网:54.替换数字