Flutter app to demonstrate performance value of ImageFiltered over BackdropFilter. On a Moto G4 the app runs at about 29ms/frame with the BackdropFilter and around 6ms/frame with the ImageFiltered widget.

main.dart

import 'dart:ui';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'ImageFiltered Performance Demo',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {
  bool _useImageFiltered = false;
  AnimationController _controller;

  @override
  initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: Duration(seconds: 2),
    );
    _controller.repeat();
  }

  @override
  dispose() {
    _controller.dispose();
    super.dispose();
  }

  Widget buildWithBlurredBackground({Widget bg, Widget fg}) {
    return _useImageFiltered
        ? buildWithImageFiltered(bg, fg)
        : buildWithBackdropFilter(bg, fg)
    ;
  }

  Widget buildWithImageFiltered(Widget bg, Widget fg) {
    return Stack(
      children: <Widget>[
        ImageFiltered(
          imageFilter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
          child: bg,
        ),
        fg,
      ],
    );
  }

  Widget buildWithBackdropFilter(Widget bg, Widget fg) {
    return Stack(
      children: <Widget>[
        bg,
        BackdropFilter(
          filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
          child: fg,
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: buildWithBlurredBackground(
        bg: Text('background' * 100,
          style: TextStyle(
            fontSize: 32,
            color: Colors.blue,
          ),
        ),
        fg: AnimatedBuilder(
          animation: _controller,
          builder: (BuildContext c, Widget w) {
            final int val = (_controller.value * 255).round();
            return Center(
              child: RepaintBoundary(
                child: Container(
                  width: 100,
                  height: 100,
                  color: Color.fromARGB(0xff, val, val, val),
                ),
              ),
            );
          },
        ),
      ),
      bottomNavigationBar: BottomAppBar(
        child: Row(
          children: <Widget>[
            Text('Use Imagefiltered: '),
            Checkbox(
              onChanged: (b) => setState(() { _useImageFiltered = b; }),
              value: _useImageFiltered,
            ),
          ],
        ),
      ),
    );
  }
}