美文网首页React Native实践
iOS 性能相关第一弹-- 圆角问题

iOS 性能相关第一弹-- 圆角问题

作者: Zax_Smile | 来源:发表于2016-11-01 11:42 被阅读78次

性能问题是开发到后期一直要做的东西。现在我在着手准备一个新的项目,由于是菜鸟,对于一些性能相关的一直没有深入的了解过,在前期的准备过程中,一点点积累,一点点探寻。我所记载的是在我在这方面的一些研读,对于文章的搬运,摘抄。我只是知识的搬运工。

是圆角设置的时候,单独使用clipsToBounds  和setCornerRadius是没有问题的,但是放在一起的时候会触发离屏渲染,耗费性能。如果你当前一个页面上有十几个头像这样设置了圆角会明显的卡顿。

名词解释

什么是离屏渲染??

OpenGL中,GPU屏幕渲染有以下两种方式: On-Screen Rendering 意为当前屏幕渲染,指的是GPU的渲染操作是在当前用于显示的屏幕缓冲区中进行。 Off-Screen Rendering 意为离屏渲染,指的是GPU在当前屏幕缓冲区以外新开辟一个缓冲区进行渲染操作。

相比于当前屏幕渲染,离屏渲染的代价是很高的,主要体现在两个方面: 创建新缓冲区 要想进行离屏渲染,首先要创建一个新的缓冲区。 上下文切换 离屏渲染的整个过程,需要多次切换上下文环境:先是从当前屏幕(On-Screen)切换到离屏(Off-Screen);等到离屏渲染结束以后,将离屏缓冲区的渲染结果显示到屏幕上有需要将上下文环境从离屏切换到当前屏幕。而上下文环境的切换是要付出很大代价的。

如何触发离屏渲染

custom drawRect: (any, even if you simply fill the background with color)

CALayer corner radius

CALayer shadow

CALayer mask

any custom drawing using CGContext

解决方法:

圆角使用UIImageView来处理。

简单来说,底层铺一个UIImageView,然后用GraphicsContext生成一张带圆角的图。

这样,就可以避免在大量cell离屏渲染的时候拖慢fps。

当然,如果只是一两个view有圆角的需求,你大可不必这么折腾。直接设置layer.cornerRadius就可以了。

这里推荐一个封装好的类:JMRoundedCorner。可以方便使用 。

其原理为:如果需要给视图的图像绘制圆角,如UIImageView.image和的UIButton的背景图片。则可以用GraphicsContext绘制一张带圆角的形象给视图来避免离屏渲染。

github地址

相关文章

  • iOS 性能相关第一弹-- 圆角问题

    性能问题是开发到后期一直要做的东西。现在我在着手准备一个新的项目,由于是菜鸟,对于一些性能相关的一直没有深入的了解...

  • iOS 圆角性能问题

    http://www.jianshu.com/p/fa509c423db1?utm_campaign=malesk...

  • iOS 圆角性能问题

    偶然的一下,看到了圆角设置性能的一些问题,自己以前使用的话就没有怎么想过这个问题,现在自己也研究了一下,也希望和大...

  • iOS 知识收集

    性能优化 iOS 保持界面流畅的技巧 UIKit性能调优实战讲解 iOS高效设置视图圆角 使用 ASDK 性能调优...

  • 图片处理

    iOS中图片的加载、圆角、阴影实现方式多种多样,我们需着重考虑性能问题 视图阴影 圆角图片 注意:这种方法能够避免...

  • iOS之界面流畅

    iOS 保持界面流畅的技巧 iOS 中关于列表滚动流畅方案的一些探讨 iOS一个简单的设置圆角不引起性能问题的分类

  • 圆角性能优化

    圆角卡顿刨根问底一行代码,圆角风雨无阻,告别离屏渲染性能损耗iOS 保持界面流畅的技巧iOS 高效添加圆角效果实战讲解

  • ios 圆角 cornerRadius 对性能的影响究竟多大?

    ios 圆角 cornerRadius 对性能的影响究竟多大? 你测试过吗? 网上对”圆角设置“ 有很多说法,没有...

  • iOS图片设置圆角性能问题

    一般我们在iOS开发的过程中设置圆角都是如下这样设置的。 这样设置会触发离屏渲染,比较消耗性能。比如当一个页面上有...

  • iOS图片设置圆角性能问题

    一般我们在iOS开发的过程中设置圆角都是如下这样设置的。 所有如果要高性能的设置圆角就需要找另外的方法了。下面是我...

网友评论

    本文标题:iOS 性能相关第一弹-- 圆角问题

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