结论先行:

受限于机型、Flutter版本,之后的测试结果可能不同(如Flutter团队优化了width、height,进行内存处理)

  • cacheWidth,cacheHeight

    • 直接resize,内存ok
  • width、height 会先加载原图,再resize
    • 会产生高峰,一张4.2MB的图,会猛增164.1MB

报错

E/flutter: [ERROR:flutter/lib/ui/painting/image_descriptor.cc(174)] Failed to allocate memory for bitmap of size 127844352B
E/flutter: [ERROR:flutter/lib/ui/painting/image_decoder.cc(289)] Could not decompress image.

测试项目

主页,3个按钮。分别跳转 仅含如下内容 页面

  1. Image.file 设置 width、height页面
  2. Image.file 设置 cacheWidth、cacheHeight页面
  3. 没有image的页面

内存抓取

测试具体数据

波峰的为使用width、height,较为平稳的是使用cacheWidth、cacheHeight。


原图数据

4.2MB, 4896 × 6528,按RGB8888解析后 4896 × 6528x4/1024/1024 = 121.921875 MB

解析到200x200

应为 200 * 200 * 4 / 1024/1024 = 0.15MB

跳转到如下页面

均为杀进程后,GC首页后 跳转页面

Image设置width、height为200时的页面:

异常时og提示,图片解析为127844352byte,121.921875 MB (与计算相符)

进入页面实际峰值差 306.4 - 142.3 = 164.1MB

(多出预计164.1 - 121.9 = 42.2MB, 因为是新页面 可能是别的内存)

进入页面平稳后 142.8 - 142.3 = 0.5MB

Image设为cacheWidth cacheHeight为200的页面

进入页面实际峰值差 155.4 - 144.6 = 10.8M

进入页面平稳后:145.2-144.3 = 0.9M

确保GC后测试:

峰值:

142.5 - 132.8 = 9.7MB

平稳后增加

136.5 - 132.8 = 3.7MB

没有Image的页面

进入页面实际峰值差 148.2 - 143.3 = 4.9M

确保GC后测试,

峰值

139 - 134.7 = 4.3MB

平稳后内存增加

137.8 - 134.7 = 3.1MB

数据总结

  • 从width、height的数据可以明确看出,波峰时期直接将内存 解码到了native,增加了164MB,(高于纯图片解析121MB,应该是别的对象占用,具体有机会分析堆吧)

    • 从Android 8 开始,bitmap数据被移到了native,这也是为啥后来不用recycle,或主动GC了,因为GC清理不了native 内存区域
  • 从cache的数据可以看出,确实生效了,波峰才上升4.3MB。当然也高于期望的200x200图片解析的 0.15MB。 不过确实降了
  • width、height会产生波峰,增加大小 > 图片解码内存+其他

本实验解决图片内存问题,详见 Flutter加载大图内存问题处理

Flutter图片加载数据相关推荐

  1. flutter 图片加载

    ///网络图片组件(带占位图) // ignore: must_be_immutable class MNetWorkImageWidget extends StatelessWidget {fina ...

  2. Flutter 异步加载数据并渲染列表

    这里踩了一脚坑,写flutter的时候还是与js有差异的,这里主要涉及到几个知识点,看官需要对几部分内容先理解才容易处理,PS:其实现在我也还有点懵~ 1. 网络请求,这里我分别使用了dio和http ...

  3. 【Flutter】Image 组件 ( 加载网络图片 | 加载静态图片 | 加载本地图片 | path_provider 插件 )

    文章目录 一.加载网络图片 二.加载静态图片 三.加载本地图片 四.完整代码示例 五.相关资源 一.加载网络图片 参考 [Flutter]Image 组件 ( Image 组件简介 | Image 构 ...

  4. Flutter Image 图片加载

    题记 -- 执剑天涯,从你的点滴积累开始,所及之处,必精益求精. 目前在西瓜视频上免费刊登 Flutter 系列教程,每日更新,欢迎关注接收提醒 [x1]微信公众号的每日提醒 随时随记 每日积累 随心 ...

  5. Flutter工具类 (二) 图片加载框架

    导入依赖 # 图片加载库cached_network_image: ^3.2.1 工具类 import 'dart:math';import 'package:cached_network_image ...

  6. Flutter开发之图片加载(九)

    移动开发少不了显示图片,今天就介绍 fluter中如何加载图片,图片加载一般分为本地加载和网络加载. 本地加载 在工程下建一个New Floder 文件夹名:images 将准备好的图片拖到 imag ...

  7. Fresco图片加载+EventBus+Butterknife+Retrofit+RxJava+RxAndroid

    使用MVP框架搭建,分包明确,V层和M层解耦,通过接口完成V层和P层以及P层和M层通信,解决内存泄漏问题 Retrofit做网络请求,封装网络请求工具类,使用单例模式,添加日志拦截器打印网络请求内容 ...

  8. 小程序一次性上传多个本地图片,上拉加载照片以及图片加载延迟解决之道

    一:小程序之一次性上传多个本地相片 最近由于项目需要所以学了下小程序,也做了一些东西,随后便有了以下的一些总结了,现在说说如何使用小程序一次性上传多个本地相片. 问题描述 最近做项目的时候要实现一个上 ...

  9. Swift - 表格图片加载优化(拖动表格时不加载,停止时只加载当前页图片)

    列表的单元格中包含有图片在开发中很常见.通常我们可以直接在tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIn ...

最新文章

  1. init.rc的disabled含义
  2. Pytorch张量tensor的使用
  3. 【Android游戏开发之六】在SurfaceView中添加组件!!!!并且相互交互数据!!!!...
  4. 一篇来自前端同学对后端接口的吐槽:痛!
  5. python程序后台运行的实现
  6. 激光与红外线的区别?激光雷达与毫米波雷达区别?毫米波雷达无法感知行人吗?关于Intel Realsense D435有源红外技术猜想
  7. 思科模拟器。计算机网络实验之四:RIPv2配置
  8. 蓦然回首,我是如何走上数据库开发这条路的?(一)
  9. iBatis 2.x 和 MyBatis 3.0.x 的区别
  10. leetcode976. 三角形的最大周长(又是你得不到的简单题)
  11. python 3.9 发布_Python 3.9.0 稳定版发布
  12. could not start avd怎么解决_双十一又到了,你的购物车塞满了吗?「购物车」用英语该怎么说?...
  13. Head First Design Pattern: 策略模式
  14. 2021十大 Python 机器学习库
  15. MLCDForest:用深度森林对长链非编码RNA进行疾病预测的多标签分类模型
  16. Three.js地球开发—1.经纬度转球面坐标
  17. 微软梁念坚谈新平台 企业跨界办公随需而变
  18. 请为横线处选择合适的程序使得程序的运行结果是123 ( )
  19. 关于AIDL接口定义中oneway的修饰符源码解析.
  20. Java字节码角度分析:Synchronized ——提升硬实力11

热门文章

  1. 斐讯K2刷固件(支持v22.4.2.15以上)
  2. 服务器UDIMM、LRDIMM、RDIMM三种内存的区别
  3. 各种字符串Hash函数比较
  4. 随笔--初到青岛,爱意油然而生
  5. 微软新版edge浏览器如何开启画中画模式 (微软新版edge)
  6. bellman - ford算法c++
  7. JAVA多态的理解及应用
  8. 小米连续点击Android,屏幕自动点击
  9. python读取中文txt乱码问题
  10. MTK: LSK,RSK的标签与响应