美文网首页
图像撕裂问题及解决办法

图像撕裂问题及解决办法

作者: 顺7zi燃 | 来源:发表于2020-07-20 12:29 被阅读0次

一、撕裂

图像撕裂.png

发生原因: CPU 和 GPU 的计算能力跟不上现在的帧率,此时才会有可能发生撕裂。


撕裂产生的原因.png

当第一帧图像扫描到某个位置时,GPU拿到新的数据并存储到帧缓冲区,这时候视频控制器从帧缓冲区扫描新拿到的一帧的图像。即撕裂是两张图片组合而来,原因就是视频控制器显示速度小于GPU处理图形的速度。

注:一般出现在低端设备 加载一个高FPS的视频/游戏场景,在iOS设备上并不常见。或者非常低端的iOS设备上,加载一个APP界面上出现非常高频的动画效果以及图层复杂度高且涵盖了动画效果。

二、解决撕裂

苹果采用:双缓存区 DoubleBuffering +垂直同步信号 Vsync

双缓存: GPU 开辟AB两个帧缓冲区
垂直同步信号: 帧缓存区加锁 防止出现撕裂情况(当前帧缓存区的数据显示到屏幕后,再显示下一缓存区数据)

执行流程就是当A帧缓冲区拿到第一帧数据,给A缓冲区加上一把锁,屏幕控制器从A拿到数据并逐行扫描完成,A帧缓冲区解锁,并且屏幕控制器指向B帧缓冲区,B帧缓冲区加锁并逐行扫描显示,在屏幕控制器扫描B帧缓冲区的时候,A帧缓冲区拿到GPU传过来的新一帧数据,以此类推,解决撕裂问题

注:双缓存+垂直同步信号并没有真正的撕裂解决问题,制标不制本。真正是问题是CPU和GPU计算能力达不到帧率(所以用再多的缓存区也只是打补丁。但可以解决很少见的撕裂问题)

三、掉帧

启用:双缓存+垂直同步信号后解决了撕裂 ,会引起新问题掉帧

掉帧产生的原因.png

掉帧是重复渲染同一帧数据
注:我们在解决撕裂问题时,只是让别人看不到撕裂,会等待,重复显示一桢

为了减少掉帧(注意不是解决,掉帧问题只能尽量的减少,而不是解决,三级缓冲区也有可能出现掉帧),引入三级缓存区,三级缓冲区是为了充分利用CPU/GPU的空余时间,开辟ABC三个帧缓冲区,A显示屏幕, B也渲染好,C再从GPU拿取渲染数据,当屏幕缓冲区和帧缓冲区都弄好了,然后视频控制器再指向帧缓冲区的另外一个,再显示,这样交替,达到减少掉帧的情况,这样做就比二级缓冲区多了一个确认的操作

总结屏幕卡顿的原因:

1.CPU 和 GPU 渲染流水线耗时过长 导致 -> 图像撕裂
2.垂直同步信号 Vsync + 双缓存区 DoubleBuffering 以掉帧为代价-> 解决图像撕裂
3.三缓存区:合理使用CPU和GPU 减少掉帧次数

相关文章

  • 图像撕裂问题及解决办法

    一、撕裂 发生原因: CPU 和 GPU 的计算能力跟不上现在的帧率,此时才会有可能发生撕裂。 当第一帧图像扫描到...

  • 图像撕裂问题及处理方法

    什么是图像撕裂? 即一张图出现了错位的现象,如下图: 那图像撕裂是如何形成的? 1. 图像的显示过程 图像 -> ...

  • 2、图像撕裂问题及解决方法

    什么是图像撕裂 就是一张图片在显示的时候分成了两半,即出现断层。如下图: 图像撕裂是如何形成的呢 我们先从图像的显...

  • 02-图像撕裂,掉帧及解决方法

    图像撕裂原因及解决方法 先说说图片显示的过程,CPU将图片解码,交给GPU -> GPU进行图像的渲染 -> 存储...

  • 图像撕裂、掉帧

    1 图像撕裂 图像撕裂就是一张图片显示的时候,出现了上下断层,如下图: 1.1 出现撕裂的原因 首先我们来看图像显...

  • 图像撕裂的原因及解决方法

    1、什么是图像撕裂?图像撕裂是指我们肉眼看见一张图片上下两层发生了错位,如下图所示: 2、为什么会发生图像撕裂? ...

  • iOS图像撕裂及解决方法

    一、什么是图像撕裂? 就是一张图片在显示的时候出现断层情况,如图所示 二、为什么会出现图像撕裂? 屏幕成像过程 G...

  • iOS 图像撕裂及解决方法

    1.图像撕裂 1.1 图像显示过程 图像 -> CPU将图片解码,交给GPU -> GPU进行图像的渲染 -> 存...

  • 浅谈图像撕裂与掉帧产生的原因及解决办法

    1. 撕裂 1.1 产生原因 图像撕裂就是一张图片在显示的时候发生错位,产生断层,如下图所示:断层.png 图像的...

  • iOS 性能优化之界面优化

    1.卡顿原理 图像撕裂及解决方法[https://www.jianshu.com/p/486b8a119ffc]和...

网友评论

      本文标题:图像撕裂问题及解决办法

      本文链接:https://www.haomeiwen.com/subject/tztgqktx.html