做设计的人很少能知道GPU过度绘制是个什么鬼?跟设计有什么关系?今天就让大家了解了解,首先来普及一下Android开发者选项中的Debug GPU overdraw。
GPU过度绘制定义
如果你粉刷过一个房间或一所房子,就会知道给墙壁涂上颜色需要做大量的工作。假如你还要重新粉刷一次的话,第二次粉刷的颜色会覆盖住第一次的颜色,第一次的颜色就永远不可见了,等于你第一次粉刷做的大量工作就完全被浪费掉。这太可怕了。
同样的道理,如果在你的应用程序中浪费精力去绘制一些东西同样会产生性能问题。过度绘制这个名词就是用来描述屏幕上一个像素在单个帧中被重绘了多少次。
GPU过度绘制就指的是在屏幕一个像素上绘制多次(超过一次),GPU过度绘制或多或少对性能有些影响。
GPU过度绘制分析
过度绘制其实是一个性能和设计的交叉点。我们在设计上追求很华丽的视觉效果,但一般来说这种视觉效果会采用非常多的层叠组件来实现,这时候就会带来过度绘制的问题。我们再来看看具体显示在Android界面层级关系:
当我们来绘制一个界面时,会有一个windows,然后是建立Activity,在Activity里可以建立多个view,或view group,view也可以嵌套view。这些组件从上到下分布,上面的组件是可以被用户看见的,而在下面的组件是不可见的,但是我们依然要花很多时间去绘制那些不可见的组件,因为在某些时候,它也可能会显示出来。
检测过度绘制
如何查看是否过度绘制:
设置-开发者选项-调试GPU过度绘制-显示过度绘制区域(过度渲染等,不同机器可能不同)
然后就可以看看你的应用是否存在过度绘制的情况了。
那么如何判断界面是否存在过度绘制呢?
开启后,点击我们的应用,可以看到各种颜色的区域,其中:
最理想的是蓝色,一个像素只绘制一次,合格的页面绘制是白色、蓝色为主,绿色以上区域不能超过整个的三分之一,颜色越浅越好。
那么从设计的角度来看你的应用是否GPU绘制过度,看一下以下几个界面:
从上图我们可以看出:
Google now页面GPU绘制比较正常基本都是在1x-2x范围内,QQ的绘制情况也还可以,2345手机助手和2345影视大全过度绘制是很严重的,基本都是超过3x,4x。
可能有些人觉得不以为然,觉得没什么影响。话又说回来,GPU绘制过渡对应用造成什么影响。
实际上,GPU绘制影响的是界面的流畅度和用户体验,对于好的手机可能体验不到差距,对于差的手机,流畅度却起着关键的作用。
可以大部分设计师关注的都是开发是否有100%还原你的设计稿,应用的交互体验是否良好,没有几个设计师会去关注GPU过度绘制问题。
本人接触到这方面知识也是优化我们开发人员指导,当时我们正在做界面层级简化,而应用界面出现了2种背景颜色,如图(左边的背景为白色,右边的背景为浅灰)。
开发让我们梳理一下页面层级,得出右边的管理页面要再多绘制一层;
开发人员建议我们以后在设计中,梳理一下页面之前层级关系,尽量保持整个界面的架构统一,大背景色一致性。而且开发人员在开发过程中,尽量用简化的结构来布局,保持界面还原度的同时也要考虑界面的流畅度。
列举一下我们2345王牌助手首页界面前后优化对比,看了以后,感觉整个人的心情都好了有木有啊,感觉更高大上了很多。
经过优化后的页面一次绘制时间能提升3ms-5ms,可以看下面这张图来进行对比,绿色色块部分为提升空间。
这次优化工作对我来说,是一次宝贵的经验,我们一直在努力让设计变得更好,但有时候设计不只是表面的美化工作,还是深度的改善用户体验。在这里我想感慨一下,一个项目的成功上线,里面不知道有多少酸甜苦辣,不知道有多少人在为之努力,感谢所有工作人员的不懈努力,辛苦你们啦!
总结原因:
1.太多重叠的背景
重叠着的背景有时候是有必要的,有时候是没必要的。这要视你的项目具体情况而定。
2.太多叠加的View
或者本来这个UI布局就很复杂或者你是为了追求一个炫丽的视觉效果,这都有可能使得很多view叠加在一起。这个情况非常普遍,下面的建议中会谈谈怎么减少这种情况带来的影响。
3.复杂的Layout层级
复杂的层级关系,这个在布局中也很常见,下面也会说这种情况怎么做可以尽可能的减少过度绘制。
建议:
1.太多重叠的背景
这个问题其实最容易解决,建议前期在设计时尽量保持整体背景统一,另外开发可以检查你在布局和代码中设置的背景,有些背景是被隐藏在底下的,它永远不可能显示出来,这种没必要的背景一定要移除,因为它很可能会严重影响到app的性能。
2.太多重叠的view
第一个建议是:使用ViewStub来加载一些不常用的布局,它是一个轻量级且默认不可见的视图,可以动态的加载一个布局,只有你用到这个重叠着的view的时候才加载,推迟加载的时间。第二个建议是:如果使用了类似viewpager+Fragment这样的组合或者有多个Fragment在一个界面上,需要控制Fragment的显示和隐藏,尽量使用动态地Inflation view,它的性能要比SetVisiblity好。
3.复杂的Layout层级
这里的建议比较多一些,首先推荐用Android提供的布局工具Hierarchy Viewer来检查和优化布局。第一个建议是:如果嵌套的线性布局加深了布局层次,可以使用相对布局来取代。第二个建议是:用标签来合并布局,这可以减少布局层次。第三个建议是:用标签来重用布局,抽取通用的布局可以让布局的逻辑更清晰明了。记住,这些建议的最终目的都是使得你的Layout在Hierarchy Viewer里变得宽而浅,而不是窄而深。
文/布滟布羽(简书作者)
原文链接:http://www.jianshu.com/p/ab0cf2697236
著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。
Android开发者选项之GPU过度绘制相关推荐
- 【Android 性能优化】布局渲染优化 ( GPU 过度绘制优化总结 | CPU 渲染过程 | Layout Inspector 工具 | View Tree 分析 | 布局组件层级分析 )
文章目录 一. GPU 过度绘制优化总结 二. CPU 渲染过程 三. CPU 渲染性能调试工具 Layout Inspector 四. Layout Inspector 组件树 DecorView ...
- Android之GPU过度绘制与图形渲染优化
原址 前言 本文主要对过度绘制和图形渲染做一个概念性的描述. 同时以案例方式列出一些简单适用的优化措施. 如果你已对过度绘制有过一些了解,那么你应该明白,仅是简单的层级优化对过度绘制的改善是很小的.所 ...
- Android开发者选项 介绍
15个必知的Android开发者选项 https://www.jianshu.com/p/07b551ee260b 1.Stay awake 充电时保持屏幕唤醒,开发的时候,时不时的锁屏真是够了,开 ...
- 反编译实战之给锤子ROM加上显示GPU过度绘制
什么叫"显示GPU过度绘制"呢? 当使用GPU绘图时,在屏幕上绘制不同的颜色来表明过度绘制的情况.过度绘制情况的好坏通过颜色来表示,从蓝色.绿色.淡红色到红色 ,分别代表从好到坏的 ...
- 常用 Android 开发者选项与卡顿原因
应用UI卡顿 常见原因主要在以下几个方面: 1.人为在UI线程中做轻微耗时操作,导致UI线程卡顿: 2.布局Layout过于复杂,无法在16ms内完成渲染: 3.同一时间动画执行的次数过多,导致CPU ...
- APP性能优化之工具使用- 调试GPU过度绘制
一.概述 今天,介绍两个比较简单的性能优化工具: 调试 GPU过度绘制 GPU呈现模式分析 其实这两个工具所解决的问题并不相同,之所以把它们放在一起,是因为它们都是Android手机自带的分析工具, ...
- Android开发者选项中,这29个功能你忽略了吗?
前言 1.Android的开发者选项对于每个开发人员来说,肯定再熟悉不过了. 一个设备,如果你不打开开发者选项中的USB调试,那么连接到电脑上是不显示该设备的,也无法直接把程序运行到设备上,没法调试, ...
- Android开发者选项——GPU呈现模式分析
1玄学曲线各部分到底代表了什么 对于Android用户来说,无论你用的什么品牌的手机,在开发者选项中都能发现"玄学曲线"的开关,之所以称其为玄学曲线,还是因为它被很多网友用于测试一 ...
- Android - 开发者选项中的一些必知必懂必会
唠叨 开发者选项中有很多功能,到作为一个开发者,常用常见的就是 USB 调试了.但熟不知,里面还有很几个有意思的东西. 1. 不锁定屏幕 在开发中进行 USB 调试,开启后,不会熄灭屏幕,但屏幕亮度会 ...
最新文章
- python invalid type promotion_17个新手常见Python运行时错误
- 输入的命令集锦(补充)
- 基于ssm的个人博客_基于 CentOS7 搭建 WordPress 个人博客
- linux 压缩命令
- ssm框架整合_框架整合战斗压缩粮篇SpringCloud+SpringBoot+SSM
- android 关闭上下文菜单,【Android笔记】ContextMenu上下文菜单
- matlab光伏最大功率,光伏系统最大功率点跟踪技术的比较
- jQuery 1.3 API 参考文档中文版
- 2020 macbook pro 16寸 前端开发 我的装机软件整理
- CDHD驱动器——ServoStudio配置高创伺服速度模式不转
- 无聊开始玩路由器,入门Tomato固件
- Java枚举类 (详细解析java中的枚举类深入浅出)
- CSDN-markdown(文字加色加字号、背景色等)
- Javascript禁止鼠标和键盘
- 数据挖掘 NO.2 模型效果评估
- 迅捷画图中套用流程图模板编辑方法介绍
- 【阅读笔记】《ParseNet: Looking Wider to See Better》
- 函数指针的作用:*visit函数
- 阿姨说女婿只要程序员,IT男在婚恋市场真吃香吗?妹子有话要说
- #(二)、(三)规律用于预测是有前提要求条件的
热门文章
- 湖南大学python头歌实训-循环语句
- Android Studio 运行HyperLPR开源项目安卓APP
- jquery.lazyload-1.9.3中文文档 -- 延迟加载图片的jQuery插件
- U盘出现无法访问,文件或目录损坏且无法读取的情况的解决办法。
- 软件工程考研复试速成 - 知识点精炼 - 背诵版
- 释放被系统保留的内存容量
- DB-RANK国内数据库权威排行出炉:OMS三足鼎立,达梦数据库排第七
- hp激光打印出来字淡的处理方法
- maya putenv 命令_linux下getenv putenv setenv和unsetenv
- TD-SCDMA理论试题