Description
Details
I’m observing significant jank on nearly every animation in an app I’m building when run on a physical iPhone 13 Pro Max on iOS 15.4.1 in profile mode. Jank is present throughout the lifetime of the app, including during built-in animations such as scrolling. Oddly, while DevTools does report a handful of slow frames, for the most part it reports frame times under 8ms for animations that clearly display jank. Since I’m observing the issue on iOS, I also built the app using SkSL warm up to rule out shader compilation as a cause — indeed, I still observe jank after running the app using cached shader data.
While the app is not open source, I'm also observing this issue in a skeleton Flutter app, ruling out non-performant dart code as the issue. Similarly, the janking persists when this mini app is built using SkSL warm up. Below is the minimal 37-line dart script I'm using that is reproducing the issue when run in profile mode on the same iPhone 13 Pro Max. Here's a screen recording from that physical device showing janking in basic animations.
iphone_jank_recording.MP4
Note that the jank I’m observing in the real app visually seems to be more severe with most animations than the janking observed with this minimal script.
While I don’t own a physical Android device to test on, I discussed the issue with another engineer who tested the same 37-line script on a Pixel 5 in profile mode and also noticed an unusual amount of raster jank.
Target Platforms: iOS 15.4.1 and possibly Android (unknown version)
Devices: iPhone 13 Pro Max and Google Pixel 5
Minimal Dart Script
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const MaterialApp(home: Home());
}
}
class Home extends StatelessWidget {
const Home({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: ListView.builder(
itemBuilder: (_, ndx) => Padding(
padding: const EdgeInsets.all(15),
child: Text("Item $ndx", style: const TextStyle(fontSize: 32)),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () => Navigator.push(
context,
MaterialPageRoute(builder: (_) => const Home()),
),
),
);
}
}
Logs
Flutter Doctor (click to expand)
[✓] Flutter (Channel stable, 3.0.0, on macOS 12.3.1 21E258 darwin-x64, locale en-US)
• Flutter version 3.0.0 at /Users/benjaminweschler/SVDevelopment/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision ee4e09cce0 (5 days ago), 2022-05-09 16:45:18 -0700
• Engine revision d1b9a6938a
• Dart version 2.17.0
• DevTools version 2.12.2
[✓] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
• Android SDK at /Users/benjaminweschler/Library/Android/sdk
• Platform android-Tiramisu, build-tools 32.0.0
• Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7590822)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 13.3.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• CocoaPods version 1.11.2
[✓] Android Studio (version 2021.1)
• Android Studio at /Applications/Android Studio.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.11+0-b60-7590822)
[✓] IntelliJ IDEA Community Edition (version 2021.3.2)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin version 67.1.3
• Dart plugin version 213.7371
[✓] Connected device (2 available)
• Ben’s iPhone (mobile) • 00008110-00140C112E79801E • ios • iOS 15.4.1 19E258
• macOS (desktop) • macos • darwin-x64 • macOS 12.3.1 21E258 darwin-x64
[✓] HTTP Host Availability
• All required HTTP hosts are available
• No issues found!
iphone_devtools_output.json: the DevTools output captured during the attached iPhone screen recording.
iphone_devtools_output.json.zip
pixel_devtools_output.json: the DevTools output from the Pixel 5 sent by the other engineer mentioned earlier.
pixel_devtools-output.json.zip