Repository: flutter
Issue: CanvasKit Image downscaling is poor quality compared to HTML and Native
Labels: e: device-specific,engine,platform-web,a: images,e: web_canvaskit,P1,team-web,triaged-web

### Is there an existing issue for this?

- [X] I have searched the [existing issues](https://github.com/flutter/flutter/issues)
- [X] I have read the [guide to filing a bug](https://flutter.dev/docs/resources/bug-reports)

### Steps to reproduce

In CanvasKit when downscaling an image the quality is really poor compared to the output from the HTML renderer and Native, especially on 1080p and below screen resolution. I think this is different than the other related Canvaskit renderer bugs as it clearly shows the difference in the output.

I tried a number of different things around filters and nothing appears to help. Is there a setting I'm missing?

*Second observation, the aspect ratio / spacing is somehow different compared to the iPhone emulator?

### Expected results

Smoothly downsized images that are legible

### Actual results

Very jagged and faded detail, this is on a 3440x1440p monitor. In particular it is the bottom line size that I'm having difficulty with.
As you can see on the last line, the 30 is not legible for the Canvaskit renderer.
And for the smallest zipper image the details are smoothed nicely for the Native and HTML renderers but not for the Canvaskit

### Code sample

<details><summary>Code sample</summary>

```dart
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Image.network(
              'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/72420_010002_180_PA.jpg',
              width: 450,
            ),
            Image.network(
              'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/72420_010002_180_PA.jpg',
              width: 250,
            ),
            Image.network(
              'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/72420_010002_180_PA.jpg',
              width: 150,
            ),
            Image.network(
              'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/72420_010002_180_PA.jpg',
              width: 100,
            ),
            Center(
              child: SizedBox(
                height: 64,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/B1.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/W30.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/CNO.jpg',
                    ),
                  ],
                ),
              ),
            ),
            Center(
              child: SizedBox(
                height: 48,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/B1.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/W30.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/CNO.jpg',
                    ),
                  ],
                ),
              ),
            ),
            Center(
              child: SizedBox(
                height: 24,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/B1.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/W30.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/CNO.jpg',
                    ),
                  ],
                ),
              ),
            ),
            Center(
              child: SizedBox(
                height: 16,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/B1.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/W30.jpg',
                    ),
                    Image.network(
                      'https://raw.githubusercontent.com/zambetpentru/flutter_89037_video_exit_fullscreen_black_image/82d06d5a5c5004793c2711a4445a3249b85b4fc7/CNO.jpg',
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

```

</details>


### Screenshots or Video

![image](https://github.com/flutter/flutter/assets/81489824/9e86aff1-bd14-4f78-b48c-5f8fb2e9f38c)

### Logs

<details><summary>Logs</summary>

```console
[Paste your logs here]
```

</details>


### Flutter Doctor output

<details><summary>Doctor output</summary>

```console
[!] Flutter (Channel stable, 3.13.4, on macOS 13.3.1 22E261 darwin-arm64, locale en-GB)
    ! Warning: `flutter` on your path resolves to /Users/omega/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /users/omega/flutter.
      Consider adding /users/omega/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/omega/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /users/omega/flutter. Consider
      adding /users/omega/flutter/bin to the front of your path.
[✓] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[✓] Xcode - develop for iOS and macOS (Xcode 14.3)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.2)
[✓] VS Code (version 1.82.2)
[✓] Connected device (3 available)
[✓] Network resources
```

</details>