2024 Flutter面试题二

笔试部分

1. 介绍一下Flutter中Widget是如何工作的？

https://cloud.tencent.com/developer/article/1634618
Widget是用来描述Element配置信息的，Widget是不可变的，因此状态改变时，需要重新构建UI。

2. 什么是StatelessWidget和StatefullWidget？他们之间的区别是什么？

• StatelessWidget是一旦构建后状态就不能改变的Widget，无生命周期的回调。
• StatefulWidget是一旦构建Widget的状态还会发生改变的Widget。
• StatefulWidget有一个状态类State，维护了可变状态。当状态发生变化时，StatefulWidget 将会重建其对应的 State 对象。
• 生命周期不同，调用build()方法次数和时机不同。

3. 请解释InheritedWidget是什么，并说明它在状态管理中的作用。

• InheritedWidget 类是一个特殊的无界面（stateless）Widget，它主要用于在整个Widget树中｀自顶向下｀地高效传递和共享数据（｀Notifation｀用于｀自下而上｀传递数据）。
• InheritedWidget能够提供数据在widget树中从上到下进行传递。保证数据在不同子widget中进行共享。
• 作用
  1、数据共享
  2、数据监听与重建
  3、性能优化：只重绘受影响的部分子树

4. Provider与其他状态管理解决方案有什么不同？

• provider是基于InheritedWidget的包装，可以实现页面和其子页面间的数据共享。
• Provider具有缓存功能，调用setState()方法，那些没有依赖状态的子节点都不会被重新build。
  https://blog.51cto.com/u_16175630/7445520

5. 简述下Bloc模式是什么，以及它的工作原理。

• BLoC全称（Business Logic Component)是谷歌提出的一种设计模式，利用流的方式实现界面的异步渲染和重绘，我们可以非常快速的通过BLoC实现业务与界面的分离。
  BLoC 管理着事件 events 和状态 state，比如，它接受一系列事件流，并将它们转化为状态流作为输出。
• 在Flutter中实现BLoC设计模式需要借助 flutter_bloc 这个库来完成
• 原理：BLoC基于流（Stream）的概念，使用RxDart库中的StreamController和Stream来实现。BLoC将UI层（如widget）中的用户操作通过事件（Event）发送给业务逻辑层，并根据这些事件处理数据并生成新的状态（State），再将新状态传递回UI层以更新视图。

6. 什么是Flutter中的异步编程？有哪些常用的异步编程模式？

• Flutter中的异步是向事件队列中插入任务。
• Future、Stream
• Future一次只支持一个任务，Stream可以支持多个任务。
• async和await、await for是异步的语法糖。

7. Flutter中的渲染对象模型（Render Object Model）是什么？他与Widget树有何区别？

• RenderObject就是渲染树中的一个对象，负责布局及绘制。
• widget负责描述UI，存储配置信息。

8. 在Flutter中如何进行单元测试和集成测试。

• 单元测试（https://flutter.cn/docs/cookbook/testing/unit/introduction）
  单元测试可轻松地验证单个函数、方法或类的行为。
  test这个 package 提供了写单测的核心框架。
  flutter_test package 则提供了额外的功能来测试 widget。
  1、将 test 或者 flutter_test 加入依赖；
  2、创建测试文件；
  3、创建一个要测试的类；
  4、为创建的类写一个测试；
  5、整合多个测试到一个 group；
  6、执行测试。
• 集成测试(https://flutter.cn/docs/cookbook/testing/integration/introduction)
  测试单独的模块形成的整体或者获取真实设备上应用运行状态。
  集成测试由 SDK 直接提供支持，使用 integration_test 这个 package 实现。
  1、创建一个应用用于测试。
  2、添加 integration_test 依赖。
  3、创建测试文件。
  4、编写集成测试。
  4.1 初始化一个单例 IntegrationTestWidgetsFlutterBinding，这将用于在物理设备上执行测试；
  4.2 使用 WidgetTester 类测试并与 widget 发生交互；
  4.3 测试重要的应用场景。
  5、运行集成测试。

9. 在Flutter中如何进行内存管理和性能优化。

性能优化

1. 性能体现在四个方面：
   流畅度：提高渲染性能
   内存：
   应用大小：
   功耗：

2. 工具
   DevTools：性能视图，DevTool 提供诸如性能分析、堆测试以及显示代码覆盖率等功能。 DevTool 的 [Timeline] 界面可以让开发者逐帧分析应用的 UI 性能。
   performance overlay：分析模式下分析性能问题，观察 UI 和 GPU 线程
   Flutter inspector：性能图层，用于可视化和查看 widget 树。如果性能图层的 UI 图表显示红色，就要从分析 Dart VM 开始着手了。

3. 流畅度

• 动画只在首次运行时卡顿，很可能是着色器编译引起的，解决方案是 Impeller.
• 渲染和绘制都很耗时，UI线程耗时、raster线程耗时
• 用重绘边界 RepaintBoundary来缓存图片。因为光栅缓存入口的构建需要大量资源，同时增加了 GPU 存储的负载，所以只在必须时才缓存图片。
• 检视 widget 重建性能

4. 内存

• 在Flutter中，内存管理是由Dart虚拟机负责的。Dart虚拟机使用垃圾回收器来管理内存，这意味着开发者不需要手动分配和释放内存。垃圾回收器会自动识别不再使用的对象并将其回收，从而释放内存。
• Flutter应用程序中的内存分为两种类型：堆内存和栈内存。堆内存用于存储对象，栈内存用于存储临时变量。在Flutter中，大多数对象都是在堆内存中创建的，而临时变量则是在栈内存中创建的。当一个对象不再被引用时，垃圾回收器会自动回收它所占用的堆内存。
• 减少不必要的对象创建
• 优化图片加载。缓存、格式、压缩、按需加载
• 避免使用过多的动画。
• 使用适当的数据结构
• 及时释放资源。dispose、关闭文件和网络连接、及时销毁对象，避免对象长时间占用内存。
• 检测消耗多余内存的图片。Flutter Inspector：点击 “Highlight Oversizeded Images”。
  原文链接：https://blog.csdn.net/weixin_42232156/article/details/129927691

5. 应用大小
   包文件大小分析：flutter build apk --analyze-size --target-platform-android-arm64

• 当构建应用的发行版本时，考虑使用--split-debug-info标记。
• 删除无用的资源
• 尽量减少从库中引入的资源
• 压缩 PNG 和 JPEG 文件
• 延迟加载组件

6. 功耗

• 网络请求数量
• 减少不必要的重建和绘制

7. 最佳实践

• 尽量减少消耗资源的操作
• 控制 build() 方法的耗时
• 谨慎使用 saveLayer()
• 尽量减少使用不透明度和裁剪
• 谨慎使用网格列表和列表。使用懒加载，避免内部传递，尽量减少由内部操作引起的布局传递
• 在 16ms 内渲染完成每一帧。可以延长电池寿命 以及避免发热问题。
• 避免使用 Opacity widget，尤其是在动画中避免使用。可以使用 AnimatedOpacity 或 FadeInImage 代替该操作。
• 避免在动画中裁剪，尽可能的在动画开始之前预先裁剪图像。
• 并发与隔离

10. 如何加密和保护蓝牙通信？

11. 如何在iOS应用中实现低功耗的发现和连接过程？

12. OpenGL中有哪些缓冲区？分别有什么区别？

13. 怎么在地图引擎上进行100w级别的坐标点渲染，有什么方案吗？

• 通过MassMarks海量点来解决
• 通过layer加上 Loca.GeoJSONSource的方式处理

14. App网络层有哪些优化策略？

https://www.jianshu.com/p/18baeb1f42e8

• DNS优化
• 连接管理与复用
• 协议优化
• 数据压缩与缓存
• 请求优化
• 网络层错误处理与重试
• 网络状况感知与适配
• CDN(Content Delivery Network)利用
• 服务质量(QoS)管理

15. socket、websocket、http、https在tcp/ip协议层面有什么区别？

16. 如何检测链表中是否有环？删除排序链表的重复元素？

17. 如何验证两个二叉树是完全相等的？

18. flutter中widget、element和render object三者的关系？

• Widget树：描述UI的配置信息，不涉及渲染，更新代价极低。
• RenderObject树：真正的UI渲染树，负责渲染UI，处理 布局、绘制相关的事情，更新代价极大。
• Element树：Widget树和RenderObject树之间的粘合剂,负责将Widget树的变更以最低的代价映射到 RenderObject树上。将真正需要修改的部分同步到真实的 RenderObject 树中，最大程度降低 对真实渲染视图的修改，提高渲染效率，而不是销毁整个渲染视图树重建。
• widget 树和 Element 树节点是一一对应关系，每一个 Widget 都会有其对应的 Element，但是 RenderObject 树则不然，只有需要渲染的 Widget 才会有对应的节点。
• Flutter 渲染过程，可以分为这么三步：
  1、通过 Widget 树生成对应的 Element 树；
  2、创建相应的 RenderObject 并关联到 Element.renderObject 属性上；
  3、构建成 RenderObject 树，以完成最终的渲染。

面试部分

1. MVP、MVVM有什么区别？
2. Flutter响应式实现原理是什么？
   状态管理
3. 说说地图纠偏，坐标系。

• 目前常用的地理坐标系主要有国际标准坐标系WGS-84，火星坐标系GCJ-02，百度坐标系BD-09。

6. flutter、uniapp、android原生有什么不一样？说说优缺点。
7. 说说你对Flutter渲染机制的理解？
8. flutter中出现问题，你是如何解决？