IOS Off-screen rendering

Source: Internet
Author: User

GPU Rendering Mechanism:

The CPU calculates the display content submitted to the GPU,GPU render results into the frame buffer after the rendering is complete, then the video controller reads the data of the framebuffer in line with the VSync signal, passing through the possible digital-to-analog conversions to the display.

GPU screen rendering is available in the following two ways:

  • On-Screen Rendering
    means the current screen rendering, which refers to the rendering operation of the GPU in the screen buffer currently used for display.

  • Off-screen Rendering
    Off-screen rendering means that the GPU creates a new buffer outside the current screen buffer for rendering operations.

    Special off-screen rendering:
    If rendering in the current screen buffer that is not in the GPU is called off-screen rendering, there is another special "off-screen Rendering" method: CPU Rendering.
    If we rewrite the DrawRect method and draw using any of the core graphics techniques, CPU rendering is involved. The entire rendering process is synchronized by the CPU within the app
    Finished, the rendered bitmap is finally passed on to the GPU for display.
    Note: coregraphic is usually thread-safe, so it can be drawn asynchronously, and then put back to the main thread when displayed, a simple asynchronous drawing process is roughly the following

    - (void)display {   dispatch_async(backgroundQueue, ^{       CGContextRef ctx = CGBitmapContextCreate(...);       // draw in context... CGImageRef img = CGBitmapContextCreateImage(ctx); CFRelease(ctx); dispatch_async(mainQueue, ^{ layer.contents = img; }); });}

How off-screen rendering is triggered

When the following properties are set, off-screen drawing is triggered:

    • Shouldrasterize (rasterization)
    • Masks (matte)
    • Shadows (Shadow)
    • Edge antialiasing (anti-aliasing)
    • Group Opacity (opaque)
    • Complex shapes set rounded corners, etc.
    • Gradient

where Shouldrasterize (rasterization) is the more special One:
Rasterization concept: Transforms a diagram into a raster of images.
Rasterization feature: Each element corresponds to one pixel in the frame buffer.

Shouldrasterize = yes when other properties trigger off-screen rendering, the rasterized content is cached, and if the corresponding layer and its sublayers do not change, the next frame can be reused directly. Shouldrasterize = YES, this implicitly creates a bitmap, and the effects of various shadow masks are also saved in the map and cached, thus reducing the frequency of rendering (not vector graphics).

The equivalent of rasterization is the operation of the GPU to the CPU, generate bitmap cache, direct read multiplexing.

When you use Rasterization, you can turn on "Color Hits Green and Misses Red" to check if Rasterization is a good choice for this scenario. Green indicates that the cache is reused, and red indicates that the cache is created repeatedly.

Rasterization can be of little use to optimizations if the rasterized layers become too red. Bitmap caches are removed from memory and re-created too frequently, and red indicates that the cache is rebuilt too late. You can selectively rasterize a smaller, deeper layer structure to try to reduce the rendering time.

For frequently changing content, do not open this time, otherwise it will cause a waste of performance

For example, we often deal with the Tableviewcell, because the Tableviewcell redraw is very frequent (because of cell multiplexing), if the cell content is constantly changing, then the cell needs to be continuously redrawn, if the Cell.layer is set at this time can be rasterized. will result in a lot of off-screen rendering, reducing graphics performance.

Why use off-screen rendering

When using fillets, shadows, and masks, the blend of layer properties is specified to not be drawn directly to the screen before being pre-synthesized, so an off-screen rendering is required.

Out-of-screen rendering does not imply software drawing, but it means that the layer must be rendered in an out-of-screen context (whether CPU or GPU) before it is displayed.

Therefore, when using off-screen rendering, it is very easy to cause performance consumption, because in OpenGL, off-screen rendering will create an out-of-screen buffer in memory and render, while the off-screen buffer and the current screen buffer context switch is very performance.

Instruments monitoring off-screen rendering

Instruments's core animation tool has several check options related to off-screen rendering:

    • Color offscreen-rendered Yellow
      When turned on, the layers that need to be rendered off-screen are highlighted in yellow, which means there may be a performance problem with the yellow layer.

    • Color Hits Green and Misses Red
      If Shouldrasterize is set to Yes, the corresponding render result is cached, if the layer is green, the cache is reused, and if it is red, the cache is created repeatedly, indicating that there is a performance problem.

Optimizations on the iOS version

Uiimageview and UIButton setting fillets before IOS 9.0 triggers off-screen rendering

IOS 9.0 UIButton Setting the fillet will trigger off-screen rendering, while the PNG picture in Uiimageview does not trigger off-screen rendering, and if you set other shadow effects, it will trigger off-screen rendering.

It may be that Apple also realizes that off-screen rendering can produce performance problems, so it doesn't have to be rendered off-screen when Apple doesn't produce off-screen rendering.

IOS Off-screen rendering

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.