首页 › Python秒杀 › android的ui优化 (androidui优化全解析)

android的ui优化 (androidui优化全解析)

🏷️ Python秒杀 ✍️ 在职Python程序员～ 📅 2022-10-13 09:22:16

前言

汇总了一下众多大佬的性能优化文章，本期汇总一下安卓性能优化部分的知识点，主要包含：

UI优化/启动优化/崩溃优化/卡顿优化/安全性优化/弱网优化/APP深度优化等等等~

本篇是第一篇：UI优化！ [非商业用途,如有侵权,请告知我,我会删除]

强调一下： 性能优化的开发文档跟之前的面试文档一样，想要的跟作者直接要。

一、UI优化

UI优化知识点主要分为 三部分 ：

  • 第一部分 ，系统为我们做的优化。由于前端中UI展示的特殊性和重要性，Android团队也是在不断想办法提高UI方面的渲染速度，所以也是更新了很多系统优化方案，比如：

硬件加速、黄油计划、RenderThread。

  • 第二部分 ，我们可以具体实施的优化方案。主要包括：

java代码布局、View重用、异步创建View、xml布局优化、异步布局框架Litho、屏幕适配、Flutter、Jetpack Compose

  • 第三部分 ，工具使用，主要包括：

Choreographer、monitor、Systrace

1.1系统做的优化

1.1.1硬件加速

之前我们说过，一个图形的绘制是 CPU，GPU和屏幕 三方合作的结果。

在 Android3.0 之前，还没有硬件加速，都是通过CPU进行数据计算，然后通过Skia库进行软件绘制，但是CPU对于图形处理并不高效。

于是从3.0开始， Android 支持了硬件加速，到 Android4.0 默认开启硬件加速。

开启硬件加速后，就是由CPU进行图形缓存数据的绘制。这样 CPU和GPU 就能比较好的分工，各司其职了。 CPU 用于控制复杂绘制逻辑、构建或更新 DisplayList（基础元素） ； GPU 用于完成图形计算、渲染 DisplayList（基础元素） 。

这里也找了一张各种场景下，硬件加速前后的流程与加速效果(Android6.0背景)：

androidui性能优化渲染,android开发性能优化总结

但是硬件加速也是有缺点的：

  • 启用硬件加速需要更多资源，因此应用会占用更多内存。
  • 比较低的版本，由于有些 Canvas API 还没有支持，所以使用硬件加速可能会有问题。那么我们就可以手动关闭某个view的硬件加速：
myView.setLayerType(View.LAYER_TYPE_SOFTWARE, null)

Project Butter

黄油计划，你有可能没怎么听说，但是其实之前两章内容都提到过， Android4.1 之后，Google提出了黄油计划，主要包括两个内容：

  • VSYNC
  • Triple Buffering(三重缓存)

这些都熟悉了吧，上两节都说过的，这里再简单提一下：

  • VSYNC

垂直同步信号，每当收到这个信号后，CPU就开始准备Buffer数据，并在16ms之内和GPU把屏幕需要的缓存数据准备好。

  • Triple Buffering(三重缓存)

在 Android4.1 之前，是双缓存机制，大部分是没问题的。但是当 CPU/GPU 绘制过程较长，超过一个vsync信号周期，一般是16ms，就会导致丢帧，CPU无法使用被GPU或者屏幕占用的缓存区。如果下一帧绘制如果又超时，那么又会丢帧。

所以再加上一个缓存区，这样， CPU、GPU、Display 三者都有各自的缓存区，互不影响，就能保证时间的最大化利用，也就能减少上述的情况了。

RenderThread

RenderThread 是在 Android5.0 提出的，从这个名字就能知道，它是一个线程，一个专门执行 GL命令 的线程，也就是一部分的绘制工作。

有了它之后，当 CPU 处理数据给 GPU 后，就不需要等 GPU 渲染完毕了，而是将一些绘制任务交给 RenderThread ，这样就能减少主线程的工作，保证画面的流畅。同时还提供了 RenderNode ，用来做view的属性封装，渲染帧的信息等等。

1.2优化方案

1.2.1java代码布局

我们一般都是用 XML文件 进行布局，但是XML解析也是很耗时的，并在这个解析过程在主线程进行。

所以我们有的时候也许可以通过 Java 代码或者 kotlin 进行 View 的创建？

理论中，这样确实能减少布局加载的消耗时间，但是 Java代码 创建 View 太麻烦了，而且无法可视化。

当然，也有一些库可以帮助我们将 xml 代码转换成 java 代码，比如X2C（https://github.com/iReaderAndroid/X2C ），但是它并不支持所有的情况，比如 merge 标签， appCompat 兼容控件等等。

所以我们需要在这之中找到 平衡点 ，有的时候，UI简单并且要求高性能的前提下，我们可以试试用这样的方法，即用java代码代替XmL代码。

1.2.2View重用

参照Recyclerview的做法，我们也可以将一些常用的view保存到 缓存池 中，这样在不同的界面中就能复用缓存池里面的view。

1.2.3异步创建view

这是Google提出的一个方案—— AsyncLayoutInflater 。它可以异步加载布局文件，并且回调给主线程，从而减少主线程耗时。简单贴下主要代码：

new AsyncLayoutInflater(MainActivity.this).inflate(R.layout.activity_main, null, new AsyncLayoutInflater.OnInflateFinishedListener() {
        @Override
        public void onInflateFinished(@NonNull View view, int i, @Nullable ViewGroup viewGroup) {
        //回调给主线程
            setContentView(view);
    }
});

1.2.4xml布局优化

在写xml布局文件的时候，我们要做的也有很多，比如：

  • 减少布局嵌套 。多使用ViewStub、Merge、ConstraintLayout来代替。
  • 优化开销 。RelativeLayout和 使用weight的LinearLayout 开销比较大，建议使用ConstraintLayout，LinearLayout代替。

1.2.5异步布局框架Litho

Litho是Facebook开源的一款在Android上高效建立UI的声明式框架。

主要有以下特点：

1） 声明式 ：它使用了声明式的API来定义UI组件。

2） 异步布局 ：它把 measure 和 layout 都放到了后台线程，只留下了必须要在主线程完成的 draw，这大大降低了 UI 线程的负载

3） 视图扁平化 ：由于 Litho 使用了自有的布局引擎（Yoga)，在布局阶段就可以检测不必要的层级、减少 ViewGroups，来实现 UI 扁平化。

4） 优化 RecyclerView ：Litho 还优化了 RecyclerView 中 UI 组件的缓存和回收方法。

1.2.6屏幕适配

关于屏幕适配问题，也是老生常谈了。主要有以下几种方案：

  • dp适配方案。

这是系统自带的适配单位，dp是基于屏幕物理分辨率一个抽象的单位，用于说明与密度无关的尺寸和位置。所以它能在不同分辨率的手机上有相对大小的适配性。计算公式是： px=dp * (dpi/160) 。但是dpi有可能会被人为调整（比如几部相同分辨率不同尺寸的手机的ppi可能分别是是 430,440,450 ,那么在Android系统中，可能dpi会全部指定为 480 ），所以还是有可能在一些设备上出现适配问题。

  • 宽高限定符适配方案。

简单地说，这个方案就是 穷举 市面上所有的Android手机的宽高像素值。然后找到对应的文件夹使用下面的资源文件所对应的px值。

但是这方案有个缺陷，就是必须精确命中才行。比如 1920x1080 的手机就一定要找到 1920x1080 的限定符，否则就只能用统一的默认的 dimens 文件了。

所以容错性太低，不推荐。

  • smallestWidth适配方案。

这个方案就是通过手机的宽度值来找到对应限定符文件夹下的资源文件，可以看做宽高限定符屏幕适配方案的升级版。

假如我们的设计图宽为 360dp ，那么就创建 values-sw360dp 文件夹，并添加资源文件：

<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <dimen name="dp_1">1dp</dimen>
    <dimen name="dp_2">2dp</dimen>
    <dimen name="dp_3">3dp</dimen>
    ...
    <dimen name="dp_359">359dp</dimen>
    <dimen name="dp_360">360dp</dimen>
</resources>

很简单，分为 360份 ，然后我们实际写布局文件的时候，直接引用对应的dimen值即可。

然后新建其他设备宽度的文件夹，并在每个文件夹里添加对应的资源文件，这里以400dp为例：

├── src/main
│   ├── res
│   ├── ├──values
│   ├── ├──values-sw320dp
│   ├── ├──values-sw400dp
│   ├── ├──...
│   ├── ├──values-sw640dp


<?xml version="1.0" encoding="UTF-8"?>
<resources>
    <dimen name="dp_1">1.1111dp</dimen>
    <dimen name="dp_2">2.2222dp</dimen>
    <dimen name="dp_3">3.3333dp</dimen>
    <dimen name="dp_4">4.4444dp</dimen>
    ...
    <dimen name="dp_359">398.8889dp</dimen>
    <dimen name="dp_360">400.0000dp</dimen>
</resources>

也就是说，所有的设备都分为 360份 了，这样就能保证在不同宽度设备上都能有差不多的效果。

如果我们的设备宽度为 400dp ，那么就会调用 values-sw400dp 对应的资源文件，如果找不到，就会向下查找。比如我们宽度是 402dp ，找不到对应的，就会向上找到 400dp 对应的资源文件，所以也有比较好的容错性。也是一个比较好的适配方案。

当然这种重复性工作肯定不需要我们自己手动去实现，有专门的插件可以生成相应的文件和文件夹，这里也推荐一个：https://github.com/ladingwu/dimens_sw

  • *今条头日**适配方案。

这个大家应该都很熟悉了，主要是通过动态修改 density值 来保证所有设备的屏幕宽度都是固定的dp值。用到的公式就是 px = density * dp 。

比如设计图宽为 360dp ，我们只要保证所有设备的宽度都是 360dp 就能适配了。而宽度的px值我们是已知的，所以就是要修改这个 density 值来完成我们的适配目的。具体代码我就不贴了，网上很多。

这种方案侵入性低，使用方便，是个不错的适配方案。

1.2.7Flutter

Flutter是 Google 推出并开源的移动应用开发框架，开发者可以通过 Dart 语言开发 App，一套代码同时运行在 iOS 和 Android 平台。

Flutter 框架现在也是特别火，实际运用到很多的大厂项目，比如闲鱼*今条头日**。它相对于Android其实是另外一套APP架构了，它没有基于系统本身的渲染引擎，而是app中自带 Skia 引擎，虚拟机也是使用的Dart虚拟机。

主要有以下几个特点：

  • 跨平台 ：现在flutter至少可以跨5种平台，常见的平台：MacOS,Windows ,Linux ,Android ,iOS ,到目前为止，Flutter算是支持平台最多的框架了。良好的跨平台性，大大减少了开发成本。
  • 丝滑般的体验 ：使用Flutter内置的Material Design（android风格）和Cupertino（ios风格）风格组件，以及丰富的motion API,平滑而自然的滑动效果和平台感知，为用户带来全新的体验。
  • 响应式框架 ：使用一系列基础组件和响应式框架，可以轻松构建用户界面。使用功能强大且灵活的API可以实现复杂的界面效果。
  • 支持插件 ：使用插件可以访问平台本地API,如相机，蓝牙，WIFI等等。借助现有的Java，swift ,object c ， c++代码实现对原生系统的调用。
  • 60fps超高性能 ：Flutter编写的应用可以达到60fps(每秒传输帧数)。Flutter采用GPU渲染技术，所以性能很好。完全可以胜任游戏开发。

1.2.8Jetpack Compose

Jetpack Compose 是用于构建原生 Android 界面的新工具包

原来我们的布局文件都是写在 xml 文件中的，现在提供了一种新的view构建方式，也就是 Compose 。

它是一种 声明式UI ，不再使用xml，而是使用 kotlin 进行UI布局。其实就跟我们之前提到的一点，用java代码去构建view一样的效果。这样就减少了 xml解析 的时间，提高了效率。

声明式UI。指的是只需要把界面声明出来，不需要手动更新。比如我们这里的Compose只需要写一遍，后续的UI改变会随着变量自动更新。而传统的xml布局方式就无法做到这一点，属于命令式UI，需要我们手动命令纸牌屋UI的修改。

官方也是宣称有以下 几点优势 ：

更少更直观的代码，更强大的功能，能提高开发速度。

最后贴一段代码，感受下 Compose 的写法：

class MainActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContent {
      Greeting("Android")
    }
  }
}

@Composable
fun Greeting(name: String) {
    Text (text = "Hello $name!")
}

1.3工具篇

1.3.1Choreographer

Choreographer 其实也是一个监控应用帧率的工具。它主要有以下特性：

  • 能获取整体的帧率。
  • 能在线上使用。
  • 获取的帧率几乎是实时的。

主要原理就是利用 postFrameCallback 计算两次绘制的间隔时间，简单贴下代码：

private long mLastFrameTime;
Choreographer.getInstance().postFrameCallback(new Choreographer.FrameCallback() {
    @Override
    public void doFrame(long frameTimeNanos) {
        if (mLastFrameTime == 0) {
            mLastFrameTime = frameTimeNanos;
        }
        float diff = (frameTimeNanos - mLastFrameTime) / 1000000.0f;//得到毫秒，正常是 16.66 ms
        if (diff > 500) {
            double fps = (((double) (mFrameCount * 1000L)) / diff);
            mFrameCount = 0;
            mLastFrameTime = 0;
            Log.d("doFrame", "doFrame: " + fps);
        } else {
            ++mFrameCount;
        }
        Choreographer.getInstance().postFrameCallback(this);
    }
});

想细细研究的可以看看这个库（https://github.com/friendlyrobotnyc/TinyDancer ）

1.3.2LayoutInspector/Android Device Monitor

LayoutInspector 是 AndroidStudio 种的一个布局检查器，可以通过 Tools > Layout Inspector 找到，他可以检查应用中的某个界面的视图结构，但是无法查看非调式状态的应用。

如果要看其他应用的布局情况，可以使用 Android Device Monitor ，在 Android Studio 3.1 以后，需要单独从文件夹打开了：

android-sdk/tools/monitor

1.3.3Systrace

Systrace 是分析 Android 性能问题的神器，获取Systrace文件的方式有两种：

  • 一是 AndroidSDK/tools 目录下，通过 monitor.bat 用 Android Device Monitor 可视化工具得到。
  • 二是通过 python 脚本获取。