packages icon indicating copy to clipboard operation
packages copied to clipboard

[vector_graphics] Moved color and colorFilter effects into the raster cache to reduce rendering overhead.

Open gaodi-sec opened this issue 7 months ago • 0 comments

This PR addresses a performance issue in the VectorGraphic widget when using the raster rendering strategy. Specifically, it moves the color and colorFilter effects into the raster cache stage, avoiding the need to apply them via saveLayer during every frame of rendering.

This issue was highlighted in flutter/flutter#166184, where rendering multiple SVGs in raster mode led to excessive overhead due to the use of saveLayer. Rather than being applied during drawing time, these effects can be baked into the cached image once, resulting in faster and more efficient rendering.

Note: This PR is proposed separately from flutter/packages#8932, which introduced a new auto strategy. Although related in purpose (performance improvements), this fix is independent and directly targets the saveLayer overhead problem.

Before this PR

With the current behavior, SVGs using raster mode with color or colorFilter incur significant rendering costs. For example, rendering 20 SVGs may trigger many sub render passes caused by saveLayer:

before The small blocks at the bottom of EntityPass::OnRender represent additional GPU passes (e.g., vkCmdBeginRenderPass, vkQueueSubmit): saveLayer render passes

After this PR

The effects are applied once at caching time. As a result, runtime rendering becomes a simple drawImage call, with no subpasses introduced:

after

Pre-Review Checklist

gaodi-sec avatar Jun 06 '25 08:06 gaodi-sec