35 | Hot Reload是怎么做到的？
陈航
该思维导图由 AI 生成，仅供参考
你好，我是陈航。
在上一篇文章中，我与你分享了 Flutter 的 Debug 与 Release 编译模式，以及如何通过断言与编译常数来精准识别当前代码所运行的编译模式，从而写出只在 Debug 或 Release 模式下生效的代码。
另外，对于在开发期与发布期分别使用不同的配置环境，Flutter 也提供了支持。我们可以将应用中可配置的部分进行封装抽象，使用配置多入口的方式，通过 InheritedWidget 来为应用的启动注入环境配置。
如果你有过原生应用的开发经历，那你一定知道在原生应用开发时，如果我们想要在硬件设备上看到调整后的运行效果，在完成了代码修改后，必须要经过漫长的重新编译，才能同步到设备上。
而 Flutter 则不然，由于 Debug 模式支持 JIT，并且为开发期的运行和调试提供了大量优化，因此代码修改后，我们可以通过亚秒级的热重载（Hot Reload）进行增量代码的快速刷新，而无需经过全量的代码编译，从而大大缩短了从代码修改到看到修改产生的变化之间所需要的时间。
比如，在开发页面的过程中，当我们点击按钮出现一个弹窗的时候，发现弹窗标题没有对齐，这时候只要修改标题的对齐样式，然后保存，在代码并没有重新编译的情况下，标题样式就发生了改变，感觉就像是在 UI 编辑面板中直接修改元素样式一样，非常方便。
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线笔记
复制
AI
- 深入了解
- 翻译
- 解释
- 总结
Flutter的热重载技术是一种基于JIT编译模式的动态代码同步方法，能够在不中断应用程序正常运行的情况下，实现代码的实时更新。通过扫描工程改动、增量编译、推送更新、代码合并和Widget重建等步骤，开发者可以快速修改UI、修复Bug，无需重启应用即可看到改动效果，大大提升了UI调试效率。然而，热重载也有一定的局限性，例如对枚举和泛型类型的更改不支持热重载，需要重启应用才能查看到更改效果。热重载提高了调试UI的效率，非常适合写界面样式这样需要反复查看修改效果的场景，但由于其状态保存的机制所限，热重载本身也有一些无法支持的边界。除了Flutter，读者还可以思考其他框架（比如React Native、Webpack）的热重载机制，以及它们与Flutter的区别。
仅可试看部分内容，如需阅读全部内容，请付费购买文章所属专栏
《Flutter 核心技术与实战》，新⼈⾸单¥59
《Flutter 核心技术与实战》，新⼈⾸单¥59
立即购买
© 版权归极客邦科技所有，未经许可不得传播售卖。 页面已增加防盗追踪，如有侵权极客邦将依法追究其法律责任。
登录 后留言
全部留言(12)
- 最新
- 精选
GLReact Native 采用脚本语言编写，脚本语言即读即运行，不需要编译，在读之前替换成新版本的脚本，运行时执行的便是新的逻辑；RN打包时会将RN源代码、第三方库及自己编写的js代码都打包成一个bundle文件(Android是index.android.bundle，ios是index.ios.bundle),App启动时会加载bundle文件，所以替换掉这个bundle文件就能实现热重载了，RN中提供了修改读取bundle路径的方法，可以将最新的bundle更新到读取bundle的指定路径进而实现热重载。作者回复: 赞👍
2019-09-1728
许童童Webpack的热重载原理大致是：初始化注入一段js脚本，里面与webpack开发服务器建立一个WebSocket连接，当文件有改动的时间，通过WebSocket将文件下发，随后浏览器重新执行新的代码。状态管理则是在内存中，依赖Redux之类的库，所以UI和状态是分离的，可以比较容易的实现热重载。作者回复: 赞
2019-09-174
菜头Flutter 支持热更吗作者回复: 官方不支持；Android的纯Flutter应用可以通过产物替换实现，iOS不行
2019-11-20
zzz对于现有 iOS 工程集成的 flutter_module 类型，支持 hot reload 的原理是什么呢？可以理解为代码改变后，重新生成了app.framework，之后flutter.framework中的Dart VM 和 Kernel 来实现 app.framework的重新加载，以及对应的Widget重建么？作者回复: 和纯Flutter App一样的呀，他俩运行机制没有区别
2019-10-032
神佑小鹿记录： React Native 采用脚本语言编写，脚本语言即读即运行，不需要编译，在读之前替换成新版本的脚本，运行时执行的便是新的逻辑；RN 打包时会将 RN 源代码、第三方库及自己编写的 js 代码都打包成一个 bundle 文件 (Android 是 index.android.bundle，ios 是 index.ios.bundle),App 启动时会加载 bundle 文件，所以替换掉这个 bundle 文件就能实现热重载了，RN 中提供了修改读取 bundle 路径的方法，可以将最新的 bundle 更新到读取 bundle 的指定路径进而实现热重载。2023-04-08归属地：广东1- 张训博-forrestRelease模式是AOT模式，android编译成so文件，那么运行时是不是不需要Dart VM。图2的Dart VM是不是不需要？2021-01-1311
...Android原生也是支持JIT和AOT的 所以是不是按道理原生也可以Hotreload2020-03-2431
Lotharios不支持运行时写内存和执行内存，那从这个角度hot reload是如何实现的呢？2021-12-11
szWest这里编译模式Script Snapshot是不是错了（太旧了？），实际上现在是Kernel Snapshot模式吧2021-03-301- 张训博-forrest@作者 确认下release模式在运行时是不是不需要dart VM 看源码都是so文件了2021-01-192
收起评论