Flutter热更新技术探索

ChatGPT狂飙160天,世界已经不是之前的样子。

新建了人工智能中文站https://ai.weoknow.com
每天给大家更新可用的国内可用chatGPT资源


一,需求背景:

APP 发布到市场后,难免会遇到严重的 BUG 阻碍用户使用,因此有在不发布新版本 APP 的情况下使用热更新技术立即修复 BUG 需求。原生 APP(例如:Android & IOS)的热更新需求已经比较成熟,但 Flutter 技术栈目前还缺少类似的技术方案,因此 Flutter 研发团队,也需要类似的热更新技术。

二,Flutter 热更新技术方向分析:

经过分析目前可能有三种可行的方案:1)类似 RN 框架;2)页面动态组件框架;3)Dart 虚拟机定制方案;

方案名称原理优点缺点开源方案
类似 RN 的方案用 JS 以 Flutter 语法写 dart,然后用 JavaScript 把 XML DSL 转为 Flutter 的原子 widget 组件,然后再让 Flutter 来渲染由于 ios 系统内置支持 js,ios 上完全可以实现更新1) 由于跨语言执行,对于性能有影响;学习成本高 2) Android 端需要额外引入 JS 库手 Q 的 MXFlutter,58 同城的 Fair
页面动态组件方案编译期时插桩 / 预埋好 DynamicWidget 到代码中,然后动态下发 Json 数据,通过协定好的语义匹配到 JSON 内的数据,动态替换 Widget 内容来实现更新能支持 Android/iOS 两端的更新1)UI 更新相对较容易,业务逻辑动态化较麻烦;2)语义解析器开发成本相对较大,且不易维护 3)需要一整套前后端服务和工具天猫的 Tangram,淘宝的 DinamicX 等
Dart 虚拟机定制方案通过分析 Dart 虚拟机的原理,修改 Flutter Engine 层 Java/C++ 代码实现热更新的目标;性能影响小,动态性很高,技术上可以替换所有 Flutter 页面(包括 UI,逻辑,资源文件)由于使用的是定制引擎,需要维护不同版本的 Flutter 引擎代码;未开源

因为其他方式都有开源的示例,本案将重点以第三种 “Dart 虚拟机定制方案” 为目标,做方案的研究讲解。

三,预备知识

在开始了解技术方案之前,需要提前了解一些相应的技术概念:

3.1 Flutter 编译模式

Flutter 开发语言是 Dart,它的编译模式来自 Dart 的编译模式,主要有 JIT (Just In Time) 和 AOT (Ahead Of Time)。

编译模式名称特点优点缺点
JIT即时编译,典型例子 V8,它可以即时编译运行 JS,只需要输入源代码字符串,就可以编译运行代码可以动态下发和执行代码,不用管 CPU 架构,可以提供动态化内容1, 大量字符串代码让 JIT 编译器花费时间和内存;2, 性能不好;
AOT预先编译,典型例子 C/C++,通过 GCC 编译成二进制代码,然后安装取得权限后才可以加载执行事先编译好的,加载和执行速度快1, 编译时区分 CPU 架构;2, 生成的二进制代码包比较大;3, 二进制代码需要取得权限才可以执行,无法在 ios 系统上动态更新

Flutter 编译模式有:Debug,Release,Profile;

Flutter 编译模式特点
Debug对应 JIT 模式,支持设备和模拟器;打开了断言,支持快速开发,支持 HotReload;并未对包大小,执行速度做优化;
Release对应 AOT 模式,支持真机,不支持模拟器;禁止了所有断言调试信息;对包大小,启动和执行速度进行了优化;
Profile类似 Release 模式,保留了一些调试功能,帮助性能分析;

3.2 Flutter 编译产物分析

Flutter 下的 iOS/Android 工程本质上是一个标准的 iOS/Android 的工程;IOS 平台: Flutter 通过在 BuildPhase 中添加 shell (xcode_backend.sh) 来生成和嵌入 App.framework 和 Flutter.framework 到 ios; Android 平台: Flutter 通过 gradle 来添加 flutter.jar 和编译完的二进制文件添加到 Android;

3.2.1 引擎层结构分析:

3.2.2 Android 编译产物的分析

3.2.3 IOS 编译产物的分析

四,热更新技术方案分析

4.1 业务代码分析

根据 “3.3.1” ~“3.3.2” 的分析可以确定无论是 IOS 还是 Android APP 业务代码都是由四个段组成:kDartVmSnapshotData、kDartVmSnapshotInstructions、kDartIsolateSnapshotData、kDartIsolateSnapshotInstructions;理论上只要能动态替换加载的代码段 & 数据段代码即可实现目标。

名称注释作用注释
kDartIsolateSnapshotDataDart isolate 数据段类信息,全局变量,函数指针等允许动态下发
kDartIsolateSnapshotInstructionsDart isolate 指令段包含由 Dart isolate 执行的 AOT 代码IOS 不允许动态下发
kDartVmSnapshotDatavm isolate 数据段isolate 之间共享的 Dart 堆 (heap) 的初始状态允许动态下发
kDartVmSnapshotInstructionsvm isolate 指令段包含 VM 中所有 Dart isolate 之间共享的通用程序的 AOT 指令IOS 不允许动态下发

注释:isolate, snapshot, vm isolate 含义解释如下:

名称含义
isolateDart 是单线程,isolate 跟线程差不多,可以理解为 Dart 中的线程。isolate 与线程的区别:线程与线程之间是共享内存的,而 isolate 和 isolate 之间是内存不共享的。不存在锁竞争问题,两个 Isolate 完全是两条独立的执行线,且每个 Isolate 都有自己的事件循环,它们之间只能通过发送消息通信,所以它的资源开销低于线程。
snapshot将类信息、全局变量、函数指令直接以序列化的方式存在磁盘中,称为 Snapshot(快照)。
vm isolate同一个进程里可以有很多 isolate,但两个 isolate 的堆区是不能共享的,所以官方设计了 VM isolate,也就是 kDartVmSnapshot,用来多个 isolate 之间的交互。

4.2 业务代码的加载分析(运行时)

按照 4.1 的分析思路,我们首先需要了解 Flutter 运行时代码加载的完整流程,经过梳理分析流程如下:

1 )Android- APP 业务代码的加载流程:

2)IOS- APP 业务代码的加载流程:

4.3 业务代码的编译生成(编译时)

根据以上的分析,我们知道了 Flutter 业务代码的数据结构,也知道了在运行时如何加载,因此我们只需要在编译时做更改,产生自己需要的代码段,和数据段文件。在运行时加载自己的构建产物即可达到目标。

1)在此以 IOS 构建自己的业务代码流程做详细分析:

** 有完成构建流程可以分析,基本流程是 “Dart Code(业务代码)” -> (通过 Dart 编译器 gen_snapshot.cc) 生成 snapshot_assemble.S 的汇编文件 -> (通过 xcrun 工具) 生成 snapshot_assemble.o 的 obj 文件 -> (通过 xcun clang 工具链) 生成了 App.Framework。

2)Android 的产物构建流程和 IOS 类似。由于 Android 有其他更简单的方案, 因此省略详细的构建流程分析,大致如下:

4.4 实现热更新的方案探索

根据上面的技术分析结果,已经可以独立生成自己的代码段,数据段文件。通过需改虚拟机底层代码的方式,也可以动态的加载运行。但由于 IOS 系统目前底层的系统还不能动态加载可读写的代码段数据到内存中,所以还有技术难点需要突破。但 Android 端有更简单的路径可以解决,因此下面以 Android 端为例重点分析思路,大致如下图所示:

由上图可以得知,Android 端 热修复核心步骤如下:

1, 修改 Flutter Engine 代码,加载指定路径的 libapp.so 和 flutter_aasets,比如私有目录 (data/data/files);

2, 编译 APK 时,利用 Gradle Transform 插件,根据 Flutter SDK 的 engine version 动态替换官方的 Flutter engine,最终写入修改后的 engine 到 APK;

3, 生成补丁包:利用 BSdiff 算法比较新旧 APK 文件,生成 patch 补丁包

4, APP 启动时访问后端接口,根据参数(app 的版本号,补丁包版本号,md5,flutter SDK 版本号,Engine 版本号)拉取补丁包;

5, 合成补丁包:校验 md5,app 版本号,补丁版本号,安装时间;

6, 自定义 Flutter Engine 加载指定路径的 libapp.so 和 flutter_assets 资源文件;


ChatGPT狂飙160天,世界已经不是之前的样子。

新建了人工智能中文站https://ai.weoknow.com
每天给大家更新可用的国内可用chatGPT资源

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/37224.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Chat-REC、InstructRec(LLM大模型用于推荐系统)

当众多chat-xxx和xxxGPT喷涌而出的时候,博主就在等它被做到推荐系统的这一天。本篇博文将简要看看一些文章的具体做法。 Chat-REC: Towards Interactive and Explainable LLMs-Augmented Recommender System 先上地址, https://arxiv.org/abs/2303.145…

使用python爬取股票信息

基本思路 首先查看robots.txt,文档说明是允许爬虫的 查找接口:第一次对整个页面进行了爬取,发现返回的内容并不包含我们所需要的信息。说明这部分的信息是通过AJAX渲染的,这就需要我们去查找接口。按F12打开开发者模式&#xff0…

Python爬虫实战,requests模块,爬虫采集网易财经股票交易数据

前言 本文给大家分享的是如何通过Python爬虫采集网易财经易数据 开发工具 Python版本: 3.8 相关模块: requests模块 parsel模块 环境搭建 安装Python并添加到环境变量,pip安装需要的相关模块即可。 思路分析 本文以爬虫网易财经数据…

小白学 Python 爬虫(25):爬取股票信息

人生苦短,我用 Python 前文传送门: 小白学 Python 爬虫(1):开篇 小白学 Python 爬虫(2):前置准备(一)基本类库的安装 小白学 Python 爬虫(3&am…

python3爬虫基本操作——抓取股票信息

目录 1. requests库发送请求,获取响应内容的字符串格式 2.Beautifulsoup解析并获取指定的内容 3.selenium库 没想到我的第一次 — — 写博客就这样毫无预兆地发生了。其实一直对博客非常感兴趣,博客是很好的交流平台,非常 感谢各路博客大神…

用 Python 爬取股票实时数据

今天我们一起来学习一个 Python 爬虫实战案例,我们的目标网站就是东方财富网,废话不多说,开搞 网站分析 东方财富网地址如下 http://quote.eastmoney.com/center/gridlist.html#hs_a_board 我们通过点击该网站的下一页发现,网页内…

爬取股票信息

爬取网站 网易财经 创建的文件 List_url.py from finance.code_list import CodeListdef Shanghai_Stock_Index():"""上证指数"""code int(input("证券代号&#xff1a;"))if code > 201000 and code < 900957:year int(input…

实战干货!用 Python 爬取股票实时数据!

今天我们一起来学习一个 Python 爬虫实战案例&#xff0c;我们的目标网站就是东方财富网&#xff0c;废话不多说&#xff0c;开搞 网站分析 东方财富网地址如下 http://quote.eastmoney.com/center/gridlist.html#hs_a_board 我们通过点击该网站的下一页发现&#xff0c;网页…

基于Python爬虫的股票成交量数据抓取分析系统

目录 数据获取 2 1.1. 实验环境搭建 2 1.2. 抓取数据 2 1.2.1. 新浪财经 3 1.2.2. 网易财经 6 1.2.3. 东方财富 12 1.2.4. TuShare (挖地兔) 19 1.2.5. 其他平台 21 1.3. 数据获取总结 22 1.3.1. 股票代码抓取的总结 22 1.3.2. 日线数据抓取总结 22 1.3.3. 反爬虫策略及解决的总…

朋友股票亏惨了,我一怒用Python爬取了证券最新数据

大家好&#xff0c;我是辣条。 抓取目标: url:http://webapi.cninfo.com.cn/#/marketDataDate 数据目标: 获取 证券代码 证券简称 交易日期 开盘价 最高价 最低价 收盘价 成交数量 难点: 请求头参数mcode 加密生成 使用第三方库: 1. requests 2. execjs 3. js2py 4. math …

Python爬虫实战:爬取股票信息

前言 本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理。 作者&#xff1a; PS&#xff1a;如有需要Python学习资料的小伙伴可以加点击下方链接自行获取 python免费学习资料以及群交流解答点击即可加入…

python爬虫实战-抓取同花顺股票信息

前言&#xff1a; 在之前介绍requests的基础上&#xff0c;现在开始进行实战。 目标网站&#xff1a;http://q.10jqka.com.cn//index/index/board/all/field/zdf/order/desc/page/ 一 涉及到的技术点&#xff1a; &#xff08;1&#xff09;requests: 用于网页请求 &#xff…

微信小程序登录面板切换不了账号,显示网络连接失败?

打开开发工具就会显示这个提示&#xff0c;无论我是点击确定还是取消&#xff0c;切换账号都显示网络连接失败~&#xff01;&#xff01;&#xff01;&#xff01;&#xff01;&#xff01; 我看了一些博客&#xff0c;说是选择直连代理。我试了&#xff0c;还是显示 网络连接…

wxpy 扫码登录微信报错 KeyError: pass_ticket(网页版微信登录失败)

使用wxpy开发微信聊天机器人&#xff0c;结果扫码登录后&#xff0c;提示&#xff1a; KeyError: pass_ticket解决方法&#xff1a;wxpy是根据网页版微信的接口封装的库。用wxpy&#xff0c;得去试试网页版微信&#xff08;https://wx.qq.com/&#xff09;看能否正常登录。 如…

pc端集成企业微信的扫码登录及遇到的问题

集成步骤&#xff1a; 1、在企业微信后台中添加应用 2、记录下应用的相关信息&#xff0c;在后文要用到 3、引入企业微信js 旧版&#xff1a;http://rescdn.qqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js 新版&#xff08;20210803更新&#xff09;&#xff1a;http…

uniapp微信登录报错-100,login:fail [:-1]未能完成操作。(PGWXAPI错误-1。)

报内容&#xff1a; { “errMsg”: “login:fail [:-1]未能完成操作。&#xff08;PGWXAPI错误-1。&#xff09;,”, “errCode”: -100, “code”: -100 } 原因&#xff1a; 没有在manifest.json文件里面配置appsecret(微信开放平台申请移动应用之后会有个appsecret) 为什么没…

Android微信登录页面实现

利用Android实现微信手机端的登录页面&#xff0c;对于登录的输入做了一些的条件限制诸如&#xff0c;非空&#xff0c;长度限制等&#xff1b; 效果图如下&#xff1a; xml文件代码&#xff1a; <?xml version"1.0" encoding"utf-8"?> <Line…

分享一个基于GPT-3.5 Turbo的开源项目,界面简洁大气,反应速度快

今天在github又发现一个国内的大神开源的chatGPT项目。先看看整体的效果如何吧。 这个项目是基于OpenAI GPT-3.5 Turbo API 的demo。 本地部署 环境准备 安装node 由于该项目是使用node开发&#xff0c;所以&#xff0c;在部署之前先要安装好node环境。检查您的开发环境和部…

一款反应速度完全碾压chatgpt3.5turbo的软件 curor,直接运行

1、软件简介 Build Software. Fast.是一款可以在编辑器中使用 openAI GPT-4 模型编写的软件 官网地址&#xff1a;https://www.cursor.so/ 2.安装方法 不用安装直接运行exe3.使用方法 CTRLK(生成代码)CTRLL(对话功能)

OpenAI ChatGPT3.5-turbo实际解决问题能力评测

OpenAI ChatGPT3.5-turbo实际解决问题能力评测 ​ 程序员在coding的时候会经常遇到需要查阅资料的情况&#xff0c;最好的结果是直接能拿到一份好用的demo版本code&#xff0c;本次我们来评测&#xff1a;bing搜索和chatGPT3.5&#xff0c;解决实际问题&#xff1a;“html 图片…