Flutter的线程模型

这篇具有很好参考价值的文章主要介绍了Flutter的线程模型。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

      Flutter的线程模型,Flutter技术笔记,flutter,isolate,线程模型

        在Flutter框架中,Embedder层负责把Flutter嵌入到各个平台上去,其所做的主要工作包括线程设置、渲染Surface设置,以及插件等。因此, Embedder负责线程的创建和管理,并且提供Task RunnerEngine使用。Engine则是负责提供IsolateFramework和应用层进行多线程创建。

        Embeder主要包含四个Task RunnerPlatform RunnerUI RunnerGPU RunnerIO Runner。 其中,每个Flutter Engine都会有独立的UI RunnerGPU RunnerIO Runner,而Platform Runner在Engine间是共享的。

    Platform Runner之所以在多个Engine中之存在一份,主要由于Platform Runner运行在平台的Main Thread,负责执行Flutter Engine的代码和Native Plugin任务。如果在Platform Runner中运行耗时任务,会影响原生平台任务的正常执行。但是Platform Runner被阻塞后并不会导致页面卡顿。因为Platform Runner不负责Flutter的页面渲染。

        我们所写的Dart代码默认是运行在 Root Isolate中,而Root Isolate是运行在UI Runner上的。UI Runner负责创建管理Layer Tree最终绘制到屏幕上的内容,因此这个线程被阻塞会直接导致界面卡顿掉帧。

         IsolateDart平台对线程的实现方案。和普通Thread不同,Isolate 拥有独立的内存,由线程和独立内存构成。Isolate通过事件循环和消息队列来实现单线程异步并发,这比多线程要轻便的多,由于Dart基于单线程模型,所以开发过程中不需要关心线程安全问题。

        GPU Task Runner则被用于执行与设备GPU相关的调用。虽然GPU线程是一个独立线程,但由于UI的布局、绘制、渲染、上屏由CPU和GPU共同完成,因此,如果GPU Task Runner耗时太久,同样会造成Flutter应用的卡顿。所以在GPU Task Runner中,不能执行耗时操作。

        IO Runner主要功能是网络、文件等IO操作(比如从后台请求网络数据,或者从磁盘中读取压缩的图片格式,将图片数据进行处理为GPU Runner的渲染做好准备)。之所以将IO操作设计为在独立线程中运行,主要是就是为了避免对UI刷新造成不利影响。        

        问题:如果我们在Dart代码中执行网络请求、文件读取等使用Future来进行异步,会不会导致UI卡顿?

        答案是否定的。原因是网络请求、文件读取等耗时操作当运行到系统IO接口时,会将IO任务交给系统线程处理,并将异步任务加入到事件队列,然后Root Isolate回到事件循环,获取事件队列中的下一个任务进行处理。

        而执行大量高CPU的运算类耗时任务,如耗时计算,编解码等,即便代码是异步执行,由于所有代码都运行在Root Isolate中,所以仍然会导致Root Isolate没法及时处理其他异步任务,从而导致UI卡顿。所以对于高CPU耗时任务,应该使用新的Isolate去执行。

        总结:平时我们做UI卡顿相关优化, 主要关注UI Runner和GPU Runner即可。

        在UI Runner主要是要注意避免不必要的UI的更新和重建,比如通过使用Consumer实现Widget局部重建,善用Key实现组件的复用,以及将复杂的CPU操作如计算、编解码另起一个新的线程处理;

        而对于GPU Runner,主要是要尽可能降低页面布局层级、尽量避免使用需要SaveLayer离屏渲染的API,如Opacity、ShaderMask、ColorFilter,以及用RepaintBoundary包裹需要频繁刷新的控件,创建单独的Layer渲染。


 文章来源地址https://www.toymoban.com/news/detail-837322.html

到了这里,关于Flutter的线程模型的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Flutter笔记:完全基于Flutter绘图技术绘制一个精美的Dash图标(上)

    Flutter笔记 完全基于Flutter绘图技术绘制一个精美的Dart语言吉祥物Dash(上) 作者 : 李俊才 (jcLee95):https://blog.csdn.net/qq_28550263 邮箱 : 291148484@163.com 本文地址 :https://blog.csdn.net/qq_28550263/article/details/134098877 【介绍】:本文完全基于Flutter绘图技术绘制一个精美的Dash图标(上

    2024年02月07日
    浏览(112)
  • Flutter笔记:完全基于Flutter绘图技术绘制一个精美的Dash图标(中)

    Flutter笔记 完全基于Flutter绘图技术绘制一个精美的Dart语言吉祥物Dash(中) 作者 : 李俊才 (jcLee95):https://blog.csdn.net/qq_28550263 邮箱 : 291148484@163.com 本文地址 :https://blog.csdn.net/qq_28550263/article/details/134098877 【介绍】:本文完全基于Flutter绘图技术绘制一个精美的Dash图标(中

    2024年02月06日
    浏览(81)
  • Flutter笔记:完全基于Flutter绘图技术绘制一个精美的Dash图标(下)

    Flutter笔记 完全基于Flutter绘图技术绘制一个精美的Dart吉祥物Dash 作者 : 李俊才 (jcLee95):https://blog.csdn.net/qq_28550263 邮箱 : 291148484@163.com 本文地址 :https://blog.csdn.net/qq_28550263/article/details/134098955 另见: 上上篇文章:《完全基于Flutter绘图技术绘制一个精美的Dart语言吉祥物

    2024年02月07日
    浏览(35)
  • 一文读懂flutter线程: 深入了解Flutter中的多线程编程

    在移动应用开发领域,Flutter已经成为了一个备受欢迎的框架,用于创建高性能、跨平台的应用程序。Flutter的一个关键特性是其能够轻松处理多线程编程,以改进应用程序的性能和响应性。本文将深入探讨Flutter中的多线程编程,包括为什么需要多线程、如何在Flutter中创建和管

    2024年01月20日
    浏览(60)
  • 【Flutter】多线程

    Flutter 作为一个跨平台的UI库,前面的Flutter 架构有涉及到,Flutter 架构中的运行的多个线程。那么最为一个Flutter开发者,我们如何创建线程呢 上述我们提及到了,架构层涉及的多线程问题。比如说 主线程 , 平台线程 , GPU线程 。本文讨论的及主线程, dart 运行在虚拟中的多

    2024年01月17日
    浏览(28)
  • Flutter30(2),java线程面试题

    ); } //条目跳转 _navPush(BuildContext context, Widget page) { //路由跳转 Navigator.push(context, MaterialPageRoute(builder: (context) = page)); } } navigation_icon_view.dart底部导航栏的对象,包含title以及icon的路径,使用构造函数来实现 import ‘package:flutter/material.dart’; /// 自定义底部导航栏的四个View class

    2024年03月28日
    浏览(25)
  • Flutter 笔记 | Flutter 动画

    为了方便开发者创建动画,不同的UI系统对动画都进行了一些抽象, Flutter中也对动画进行了抽象,主要涉及 Animation、Curve、Controller、Tween 这四个角色,它们一起配合来完成一个完整动画,下面我们一一来介绍它们。 1. Animation Animation 是一个抽象类,它本身和UI渲染没有任何关

    2024年02月07日
    浏览(33)
  • Flutter 笔记 | Flutter 布局组件

    布局类组件都会包含一个或多个子组件,布局类组件都是直接或间接继承 SingleChildRenderObjectWidget 和 MultiChildRenderObjectWidget 的Widget,它们一般都会有一个 child 或 children 属性用于接收子 Widget。 不同的布局类组件对子组件排列(layout)方式不同,如下表所示: Widget 说明 用途

    2024年02月06日
    浏览(37)
  • Flutter 笔记 | Flutter 可滚动组件

    我们介绍过 Flutter 有两种布局模型: 基于 RenderBox 的盒模型布局。 基于 Sliver ( RenderSliver ) 按需加载列表布局。 之前我们主要了解了盒模型布局组件,下面学习基于 Sliver 的布局组件。 通常可滚动组件的子组件可能会非常多、占用的总高度也会非常大;如果要一次性将子组件

    2024年02月06日
    浏览(37)
  • Flutter开发笔记:Flutter 布局相关组件

    Flutter开发笔记 Flutter 布局与布局组件 - 文章信息 - Author: Jack Lee (jcLee95) Visit me at: https://jclee95.blog.csdn.net Email: 291148484@163.com. Shenzhen China Address of this article: https://blog.csdn.net/qq_28550263/article/details/131419782 【介绍】:本文介绍Flutter 布局相关组件。 Flutter 中提供了丰富的原生布局组

    2024年02月11日
    浏览(40)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包