[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?