[Impeller] Reduce render-pass overhead when using wide gamut (iOS)

[knopp]

Consider the following example:

code

import 'dart:ui';
import 'package:flutter/material.dart';

void main() {
  runApp(const MainApp());
}

const kSigma = 1.0;
const kNumberOfBlurs = 6;

class _Blur extends StatelessWidget {
  const _Blur();

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      child: BackdropFilter(
        blendMode: BlendMode.srcIn,
        filter: ImageFilter.blur(
          sigmaX: kSigma,
          sigmaY: kSigma,
        ),
        child: Container(
          color: Colors.red.withAlpha(30),
          child: const Text('Blur'),
        ),
      ),
    );
  }
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Stack(
          children: [
            ListView.builder(
                itemBuilder: (context, index) {
                  return Container(
                    padding: const EdgeInsets.all(10),
                    child: Text('Item $index'),
                  );
                },
                itemCount: 1000),
            for (var i = 0; i < kNumberOfBlurs; ++i) ...[
              Positioned(
                left: 0,
                right: 0,
                top: i * 150,
                height: 60,
                child: const _Blur(),
              ),
            ]
          ],
        ),
      ),
    );
  }
}

screenshot

It has 6 blur backdrops with sigma=1 (to focus on render pass overhead and not blur filter performance).

This is the performance on A15 (iPhone 13 Pro) with wide gamut disabled:

and wide gamut enabled:

I tried couple of things to figure out why the regression is so large:

I noticed that there is quite a lot of texture allocation per frame. Caching textures improved the frame time by around 1-1.5ms.

Biggest bottleneck by far seems to be the blits for MSAA backdrop. They take around 80% of frame time.

Disabling MSAA backdrop (reverting back to LoadAction::kLoad + StoreAction::kStoreAndMultisampleResolve/kMultisampleResolve) seems to improve the performance considerably:

cc @gaaclarke, @bdero, @jonahwilliams

[gaaclarke]

It has 6 blur backdrops with sigma=1 (to focus on render pass overhead and not blur filter performance).

The amount of work required to calculate the blurs doesn't depend on the sigma value. Check out IPGaussian in gaussian.glsl.

edit: Maybe the dart sigma value is used to calculate the blur radius?

[knopp]

It has 6 blur backdrops with sigma=1 (to focus on render pass overhead and not blur filter performance).

The amount of work required to calculate the blurs doesn't depend on the sigma value. Check out IPGaussian in gaussian.glsl.

The sigma (as specified in ImageFilter.blur) is used to calculate blur radius, which affects the number of texture samples inside gaussian_blur.glsl. The number of of image samples seems to be the biggest bottleneck currently (see #131573). What am I missing here?

[gaaclarke]

Thanks, that makes more sense. I didn't know we don't have a separate knob for radius at the dart level.

[chinmaygarde]

This is related to making all blurs faster and just happens to show up more urgently when wide-gamut is enabled. That work is tracked in #131580. Closing as duplicate.

[knopp]

@chinmaygarde, the MSAA backdrop blit being significantly slower than LoadAction::kLoad + StoreAction::kStoreAndMultisampleResolve is an issue regardless of blur. MSAA blackdrop was introduced as an optimisation, but that's not always the case, shouldn't this be tracked?

[chinmaygarde]

Ah, my bad. That makes sense. Can we reword this to describe the action-item instead of the symptom?

[jonahwilliams]

@knopp I'm not getting similar numbers to you, can you post your full trace for this application?

[knopp]

Attached are traces for current main with wide gamut enabled and disabled. Tomorrow I'll try to publish a branch with MSAA backdrop disabled and appropriate. This is on iPhone 13 Pro.

Traces.zip

[knopp]

@jonahwilliams, I was playing with this and it seems initially I missed that for MSAA backdrop removal to perform better, it is also necessary to reuse textures. Without reusing textures removing MSAA backdrop performs much worse.

no-msaa-backdrop-reuse-textures dart_devtools_2023-08-15_01_11_41.977.json.zip

Here is my branch I tested this with: https://github.com/knopp/engine/commits/remove_msaa_backdrop
It's very hacky, but it can render the example sub 8ms on iPhone 13 pro, compared to ~12ms on main.

[jonahwilliams]

FWIW we've started recylcing render target textures after flutter/engine#44527

Very simple herustics, but seem to get a good hit rate locally.

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.