Gif image markNeedsLayout every frame. #138610
Description
Steps to reproduce
- Use
Imageload gif with only width or height.
When frame update with set image(ui.Image? value) in RenderImage, markNeedsLayout is called if missing one of width or height(or both).
If last _frame and current frame has same size, relayout is redundant.
We have to handle gif image so carefully in case a huge tree would be relayout.
Code:
Code sample
Code sample
import 'dart:math';
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(home: MyApp()));
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
var testKey = UniqueKey();
var num = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('example app'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
RepaintBoundary(
child: Image.network(
'https://img.zcool.cn/community/01584659ccc891a801218e18e4097e.gif',
width: 200,
// height: 200, // only supply width or height
),
),
CustomPaint(
painter: MyPainter(),
size: Size(50, 50),
),
],
),
CustomPaint(
painter: MyPainter(),
size: Size(50, 50),
),
],
),
);
}
}
class MyPainter extends CustomPainter {
final Paint _paint = Paint();
@override
void paint(Canvas canvas, Size size) {
var randomColor = Colors.primaries[Random().nextInt(Colors.primaries.length)];
_paint.color = randomColor;
canvas.drawCircle(Offset(size.width / 2, size.height / 2), size.width / 2, _paint);
}
@override
bool shouldRepaint(covariant CustomPainter oldDelegate) {
return false;
}
}
Performance profiling on master channel
- The issue still persists on the master channel
Timeline Traces
Timeline Traces JSON
{
}Video demonstration
Video demonstration
What target platforms are you seeing this bug on?
Android, iOS
OS/Browser name and version | Device information
Any
Does the problem occur on emulator/simulator as well as on physical devices?
Yes
Is the problem only reproducible with Impeller?
No
Logs
Logs
emptyFlutter Doctor output
Doctor output
┌─────────────────────────────────────────────────────────┐
│ A new version of Flutter is available! │
│ │
│ To update to the latest version, run "flutter upgrade". │
└─────────────────────────────────────────────────────────┘
[✓] Flutter (Channel stable, 3.7.7, on macOS 14.0 23A344 darwin-arm64, locale zh-Hans-US)
• Flutter version 3.7.7 on channel stable at /Users/seven/ws/sdk/fvm/3.7.7
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 2ad6cd72c0 (9 months ago), 2023-03-08 09:41:59 -0800
• Engine revision 1837b5be5f
• Dart version 2.19.4
• DevTools version 2.20.1
• Pub download mirror https://pub.flutter-io.cn
• Flutter download mirror https://storage.flutter-io.cn
⣽sevenn LocalProcessManager run: pod --version, in null, env={LANG: en_US.UTF-8}
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
• Android SDK at /Users/seven/Library/Android/sdk
• Platform android-33, build-tools 33.0.0
• ANDROID_SDK_ROOT = /Users/seven/Library/Android/sdk
• Java binary at: /Applications/Android Studio 2.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Build 15A507
• CocoaPods version 1.11.2
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2022.1)
• Android Studio at /Applications/Android Studio 2.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 11.0.15+0-b2043.56-8887301)
[✓] IntelliJ IDEA Community Edition (version 2022.1.3)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
[✓] VS Code (version 1.84.2)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.76.0
⡿sevenn LocalProcessManager run: /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --version, in null, env=null
⣯sevenn LocalProcessManager run: /Users/seven/Library/Android/sdk/platform-tools/adb devices -l, in null, env=null
[✓] Connected device (2 available)
• macOS (desktop) • macos • darwin-arm64 • macOS 14.0 23A344 darwin-arm64
• Chrome (web) • chrome • web-javascript • Google Chrome 115.0.5790.102
[✓] HTTP Host Availability
• All required HTTP hosts are available
• No issues found!Metadata
Metadata
Assignees
Labels
Important issues not at the top of the work listLoading, displaying, rendering imagesFound to occur in 3.16Found to occur in 3.18flutter/packages/flutter repository. See also f: labels.The issue has been confirmed reproducible and is ready to work onIssue is closed as already fixed in a newer versionOwned by Framework teamTriaged by Framework team