add Impeller path stroke tessellation benchmark (#166939)

We currently benchmark path tessellation on Android and iOS, but only
for filled paths. We will now run those same benchmarks also with
stroking in a new set of benchmarks.

.ci.yaml

@@ -2375,6 +2375,29 @@ targets:
         ["devicelab", "android", "linux", "pixel", "7pro"]
       task_name: static_path_tessellation_perf__timeline_summary
 
+
+  # Uses Impeller.
+  - name: Linux_pixel_7pro dynamic_path_stroke_tessellation_perf__timeline_summary
+    recipe: devicelab/devicelab_drone
+    presubmit: false
+    bringup: true
+    timeout: 60
+    properties:
+      tags: >
+        ["devicelab", "android", "linux", "pixel", "7pro"]
+      task_name: dynamic_path_stroke_tessellation_perf__timeline_summary
+
+  # Uses Impeller.
+  - name: Linux_pixel_7pro static_path_stroke_tessellation_perf__timeline_summary
+    recipe: devicelab/devicelab_drone
+    presubmit: false
+    bringup: true
+    timeout: 60
+    properties:
+      tags: >
+        ["devicelab", "android", "linux", "pixel", "7pro"]
+      task_name: static_path_stroke_tessellation_perf__timeline_summary
+
   # Uses Impeller.
   - name: Linux_pixel_7pro hello_world_impeller
     recipe: devicelab/devicelab_drone
@@ -3600,6 +3623,26 @@ targets:
         ["devicelab", "ios", "mac"]
       task_name: dynamic_path_tessellation_perf_ios__timeline_summary
 
+  - name: Mac_ios static_path_stroke_tessellation_perf_ios__timeline_summary
+    recipe: devicelab/devicelab_drone
+    presubmit: false
+    bringup: true
+    timeout: 60
+    properties:
+      tags: >
+        ["devicelab", "ios", "mac"]
+      task_name: static_path_stroke_tessellation_perf_ios__timeline_summary
+
+  - name: Mac_ios dynamic_path_stroke_tessellation_perf_ios__timeline_summary
+    recipe: devicelab/devicelab_drone
+    presubmit: false
+    bringup: true
+    timeout: 60
+    properties:
+      tags: >
+        ["devicelab", "ios", "mac"]
+      task_name: dynamic_path_stroke_tessellation_perf_ios__timeline_summary
+
   - name: Staging_build_linux analyze
     presubmit: false
     bringup: true

TESTOWNERS

@@ -105,6 +105,8 @@
 /dev/devicelab/bin/tasks/draw_atlas_perf__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/static_path_tessellation_perf__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/dynamic_path_tessellation_perf__timeline_summary.dart @jonahwilliams @flutter/engine
+/dev/devicelab/bin/tasks/static_path_stroke_tessellation_perf__timeline_summary.dart @flar @flutter/engine
+/dev/devicelab/bin/tasks/dynamic_path_stroke_tessellation_perf__timeline_summary.dart @flar @flutter/engine
 /dev/devicelab/bin/tasks/complex_layout_scroll_perf_impeller__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/complex_layout_scroll_perf_impeller_gles__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/rrect_blur_perf__timeline_summary.dart @gaaclarke @flutter/engine
@@ -229,6 +231,8 @@
 /dev/devicelab/bin/tasks/draw_atlas_perf_ios__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/static_path_tessellation_perf_ios__timeline_summary.dart @jonahwilliams @flutter/engine
 /dev/devicelab/bin/tasks/dynamic_path_tessellation_perf_ios__timeline_summary.dart @jonahwilliams @flutter/engine
+/dev/devicelab/bin/tasks/static_path_stroke_tessellation_perf_ios__timeline_summary.dart @flar @flutter/engine
+/dev/devicelab/bin/tasks/dynamic_path_stroke_tessellation_perf_ios__timeline_summary.dart @flar @flutter/engine
 /dev/devicelab/bin/tasks/rrect_blur_perf_ios__timeline_summary.dart @gaaclarke @flutter/engine
 
 ## Host only DeviceLab tests

dev/benchmarks/macrobenchmarks/lib/common.dart

@@ -12,6 +12,7 @@ const String kPictureCacheComplexityScoringRouteName = '/picture_cache_complexit
 const String kLargeImageChangerRouteName = '/large_image_changer';
 const String kLargeImagesRouteName = '/large_images';
 const String kPathTessellationRouteName = '/path_tessellation';
+const String kPathStrokeTessellationRouteName = '/path_stroke_tessellation';
 const String kTextRouteName = '/text';
 const String kVeryLongPictureScrollingRouteName = '/very_long_picture_scrolling';
 const String kFullscreenTextRouteName = '/fullscreen_text';

dev/benchmarks/macrobenchmarks/lib/main.dart

@@ -69,7 +69,10 @@ class MacrobenchmarksApp extends StatelessWidget {
         kLargeImageChangerRouteName: (BuildContext context) => const LargeImageChangerPage(),
         kLargeImagesRouteName: (BuildContext context) => const LargeImagesPage(),
         kTextRouteName: (BuildContext context) => const TextPage(),
-        kPathTessellationRouteName: (BuildContext context) => const PathTessellationPage(),
+        kPathTessellationRouteName:
+            (BuildContext context) => const PathTessellationPage(paintStyle: PaintingStyle.fill),
+        kPathStrokeTessellationRouteName:
+            (BuildContext context) => const PathTessellationPage(paintStyle: PaintingStyle.stroke),
         kFullscreenTextRouteName: (BuildContext context) => const TextFieldPage(),
         kAnimatedPlaceholderRouteName: (BuildContext context) => const AnimatedPlaceholderPage(),
         kClipperCacheRouteName: (BuildContext context) => const ClipperCachePage(),
@@ -188,6 +191,13 @@ class HomePage extends StatelessWidget {
               Navigator.pushNamed(context, kPathTessellationRouteName);
             },
           ),
+          ElevatedButton(
+            key: const Key(kPathStrokeTessellationRouteName),
+            child: const Text('Path Stroke Tessellation'),
+            onPressed: () {
+              Navigator.pushNamed(context, kPathStrokeTessellationRouteName);
+            },
+          ),
           ElevatedButton(
             key: const Key(kTextRouteName),
             child: const Text('Text'),

dev/benchmarks/macrobenchmarks/lib/src/path_tessellation.dart

@@ -5,7 +5,9 @@
 import 'package:flutter/material.dart';
 
 class PathTessellationPage extends StatefulWidget {
-  const PathTessellationPage({super.key});
+  const PathTessellationPage({super.key, required this.paintStyle});
+
+  final PaintingStyle paintStyle;
 
   @override
   State<PathTessellationPage> createState() => _PathTessellationPageState();
@@ -39,7 +41,10 @@ class _PathTessellationPageState extends State<PathTessellationPage>
                 return Container(
                   margin: const EdgeInsets.all(1.0),
                   decoration: BoxDecoration(color: Colors.white.withOpacity(0.2)),
-                  child: IconRow(iconSize: (30 + 0.5 * (index % 10)) * scale),
+                  child: IconRow(
+                    iconSize: (30 + 0.5 * (index % 10)) * scale,
+                    paintStyle: widget.paintStyle,
+                  ),
                 );
               },
               itemCount: 200,
@@ -52,7 +57,7 @@ class _PathTessellationPageState extends State<PathTessellationPage>
               child: Container(
                 color: Colors.black.withOpacity(0.7),
                 height: 100,
-                child: IconRow(iconSize: 50.0 * scale),
+                child: IconRow(iconSize: 50.0 * scale, paintStyle: widget.paintStyle),
               ),
             ),
             Positioned(
@@ -64,7 +69,10 @@ class _PathTessellationPageState extends State<PathTessellationPage>
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.stretch,
                   children: <Widget>[
-                    SizedBox(height: 100, child: IconRow(iconSize: 55.0 * scale)),
+                    SizedBox(
+                      height: 100,
+                      child: IconRow(iconSize: 55.0 * scale, paintStyle: widget.paintStyle),
+                    ),
                     MaterialButton(
                       textColor: Colors.white,
                       key: const Key('animate_button'), // this key is used by the driver test
@@ -89,9 +97,10 @@ class _PathTessellationPageState extends State<PathTessellationPage>
 }
 
 class IconRow extends StatelessWidget {
-  const IconRow({super.key, required this.iconSize});
+  const IconRow({super.key, required this.iconSize, required this.paintStyle});
 
   final double iconSize;
+  final PaintingStyle paintStyle;
 
   @override
   Widget build(BuildContext context) {
@@ -100,23 +109,23 @@ class IconRow extends StatelessWidget {
       children: <Widget>[
         SizedBox.square(
           dimension: iconSize,
-          child: CustomPaint(painter: _SettingsIconPainter(), willChange: true),
+          child: CustomPaint(painter: _SettingsIconPainter(paintStyle), willChange: true),
         ),
         SizedBox.square(
           dimension: iconSize,
-          child: CustomPaint(painter: _CameraIconPainter(), willChange: true),
+          child: CustomPaint(painter: _CameraIconPainter(paintStyle), willChange: true),
         ),
         SizedBox.square(
           dimension: iconSize,
-          child: CustomPaint(painter: _CalendarIconPainter(), willChange: true),
+          child: CustomPaint(painter: _CalendarIconPainter(paintStyle), willChange: true),
         ),
         SizedBox.square(
           dimension: iconSize,
-          child: CustomPaint(painter: _ConversationIconPainter(), willChange: true),
+          child: CustomPaint(painter: _ConversationIconPainter(paintStyle), willChange: true),
         ),
         SizedBox.square(
           dimension: iconSize,
-          child: CustomPaint(painter: _GeometryIconPainter(), willChange: true),
+          child: CustomPaint(painter: _GeometryIconPainter(paintStyle), willChange: true),
         ),
       ],
     );
@@ -181,19 +190,47 @@ Path _pathFromString(String pathString) {
 }
 
 class _SettingsIconPainter extends CustomPainter {
+  _SettingsIconPainter(this.paintStyle);
+
+  final PaintingStyle paintStyle;
+
   @override
   void paint(Canvas canvas, Size size) {
     final Matrix4 scale = Matrix4.diagonal3Values(size.width / 20, size.height / 20, 1.0);
 
     Path path;
     path = _path1.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0x60F84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0x60F84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
 
     path = _path2.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0xFFF84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0xFFF84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
 
     path = _path3.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0xFFF84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0xFFF84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
   }
 
   static final Path _path1 = _pathFromString(
@@ -213,16 +250,36 @@ class _SettingsIconPainter extends CustomPainter {
 }
 
 class _CameraIconPainter extends CustomPainter {
+  _CameraIconPainter(this.paintStyle);
+
+  final PaintingStyle paintStyle;
+
   @override
   void paint(Canvas canvas, Size size) {
     final Matrix4 scale = Matrix4.diagonal3Values(size.width / 20, size.height / 20, 1.0);
 
     Path path;
     path = _path1.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0xFFF84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0xFFF84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
 
     path = _path2.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0x60F84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0x60F84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
   }
 
   static final Path _path1 = _pathFromString(
@@ -239,16 +296,36 @@ class _CameraIconPainter extends CustomPainter {
 }
 
 class _CalendarIconPainter extends CustomPainter {
+  _CalendarIconPainter(this.paintStyle);
+
+  final PaintingStyle paintStyle;
+
   @override
   void paint(Canvas canvas, Size size) {
     final Matrix4 scale = Matrix4.diagonal3Values(size.width / 20, size.height / 20, 1.0);
 
     Path path;
     path = _path1.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0x60F84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0x60F84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
 
     path = _path2.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0xFFF84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0xFFF84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
   }
 
   static final Path _path1 = _pathFromString(
@@ -265,16 +342,36 @@ class _CalendarIconPainter extends CustomPainter {
 }
 
 class _ConversationIconPainter extends CustomPainter {
+  _ConversationIconPainter(this.paintStyle);
+
+  final PaintingStyle paintStyle;
+
   @override
   void paint(Canvas canvas, Size size) {
     final Matrix4 scale = Matrix4.diagonal3Values(size.width / 20, size.height / 20, 1.0);
 
     Path path;
     path = _path1.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0x60F84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0x60F84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
 
     path = _path2.transform(scale.storage)..fillType = PathFillType.evenOdd;
-    canvas.drawPath(path, Paint()..color = const Color(0xFFF84F39));
+    canvas.drawPath(
+      path,
+      Paint()
+        ..color = const Color(0xFFF84F39)
+        ..style = paintStyle
+        ..strokeJoin = StrokeJoin.round
+        ..strokeCap = StrokeCap.round
+        ..strokeWidth = 2.0,
+    );
   }
 
   static final Path _path1 = _pathFromString(
@@ -291,12 +388,22 @@ class _ConversationIconPainter extends CustomPainter {
 }
 
 class _GeometryIconPainter extends CustomPainter {
+  _GeometryIconPainter(this.paintStyle);
+
+  final PaintingStyle paintStyle;
+
   @override
   void paint(Canvas canvas, Size canvasSize) {
     const Size size = Size(20, 20);
     canvas.scale(canvasSize.width / size.width, canvasSize.height / size.height);
 
-    final Paint paint = Paint()..color = const Color(0xFFF84F39);
+    final Paint paint =
+        Paint()
+          ..color = const Color(0xFFF84F39)
+          ..style = paintStyle
+          ..strokeJoin = StrokeJoin.round
+          ..strokeCap = StrokeCap.round
+          ..strokeWidth = 2.0;
     final Rect frame = Offset.zero & size;
     canvas.drawDRRect(
       RRect.fromRectAndRadius(frame, const Radius.elliptical(5, 4)),

dev/benchmarks/macrobenchmarks/test_driver/path_stroke_tessellation_dynamic_perf_test.dart

@@ -0,0 +1,22 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter_driver/flutter_driver.dart';
+import 'package:macrobenchmarks/common.dart';
+
+import 'util.dart';
+
+void main() {
+  macroPerfTest(
+    'stroke_tessellation_perf_dynamic',
+    kPathStrokeTessellationRouteName,
+    pageDelay: const Duration(seconds: 1),
+    duration: const Duration(seconds: 10),
+    setupOps: (FlutterDriver driver) async {
+      final SerializableFinder animateButton = find.byValueKey('animate_button');
+      await driver.tap(animateButton);
+      await Future<void>.delayed(const Duration(seconds: 1));
+    },
+  );
+}

dev/benchmarks/macrobenchmarks/test_driver/path_stroke_tessellation_static_perf_test.dart

@@ -0,0 +1,30 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter_driver/flutter_driver.dart';
+import 'package:macrobenchmarks/common.dart';
+
+import 'util.dart';
+
+void main() {
+  macroPerfTest(
+    'stroke_tessellation_perf_static',
+    kPathStrokeTessellationRouteName,
+    pageDelay: const Duration(seconds: 1),
+    driverOps: (FlutterDriver driver) async {
+      final SerializableFinder listView = find.byValueKey('list_view');
+      Future<void> scrollOnce(double offset) async {
+        await driver.scroll(listView, 0.0, offset, const Duration(milliseconds: 450));
+        await Future<void>.delayed(const Duration(milliseconds: 500));
+      }
+
+      for (int i = 0; i < 3; i += 1) {
+        await scrollOnce(-600.0);
+        await scrollOnce(-600.0);
+        await scrollOnce(600.0);
+        await scrollOnce(600.0);
+      }
+    },
+  );
+}

dev/devicelab/bin/tasks/dynamic_path_stroke_tessellation_perf__timeline_summary.dart

@@ -0,0 +1,14 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:async';
+
+import 'package:flutter_devicelab/framework/devices.dart';
+import 'package:flutter_devicelab/framework/framework.dart';
+import 'package:flutter_devicelab/tasks/perf_tests.dart';
+
+Future<void> main() async {
+  deviceOperatingSystem = DeviceOperatingSystem.android;
+  await task(createPathStrokeTessellationDynamicPerfTest());
+}

dev/devicelab/bin/tasks/dynamic_path_stroke_tessellation_perf_ios__timeline_summary.dart

@@ -0,0 +1,14 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:async';
+
+import 'package:flutter_devicelab/framework/devices.dart';
+import 'package:flutter_devicelab/framework/framework.dart';
+import 'package:flutter_devicelab/tasks/perf_tests.dart';
+
+Future<void> main() async {
+  deviceOperatingSystem = DeviceOperatingSystem.ios;
+  await task(createPathStrokeTessellationDynamicPerfTest());
+}

dev/devicelab/bin/tasks/static_path_stroke_tessellation_perf__timeline_summary.dart

@@ -0,0 +1,14 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:async';
+
+import 'package:flutter_devicelab/framework/devices.dart';
+import 'package:flutter_devicelab/framework/framework.dart';
+import 'package:flutter_devicelab/tasks/perf_tests.dart';
+
+Future<void> main() async {
+  deviceOperatingSystem = DeviceOperatingSystem.android;
+  await task(createPathStrokeTessellationStaticPerfTest());
+}

dev/devicelab/bin/tasks/static_path_stroke_tessellation_perf_ios__timeline_summary.dart

@@ -0,0 +1,14 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:async';
+
+import 'package:flutter_devicelab/framework/devices.dart';
+import 'package:flutter_devicelab/framework/framework.dart';
+import 'package:flutter_devicelab/tasks/perf_tests.dart';
+
+Future<void> main() async {
+  deviceOperatingSystem = DeviceOperatingSystem.ios;
+  await task(createPathStrokeTessellationStaticPerfTest());
+}

dev/devicelab/lib/tasks/perf_tests.dart

@@ -701,6 +701,28 @@ TaskFunction createPathTessellationDynamicPerfTest() {
   ).run;
 }
 
+TaskFunction createPathStrokeTessellationStaticPerfTest() {
+  return PerfTest(
+    '${flutterDirectory.path}/dev/benchmarks/macrobenchmarks',
+    'test_driver/run_app.dart',
+    'stroke_tessellation_perf_static',
+    enableImpeller: true,
+    testDriver: 'test_driver/path_stroke_tessellation_static_perf_test.dart',
+    saveTraceFile: true,
+  ).run;
+}
+
+TaskFunction createPathStrokeTessellationDynamicPerfTest() {
+  return PerfTest(
+    '${flutterDirectory.path}/dev/benchmarks/macrobenchmarks',
+    'test_driver/run_app.dart',
+    'stroke_tessellation_perf_dynamic',
+    enableImpeller: true,
+    testDriver: 'test_driver/path_stroke_tessellation_dynamic_perf_test.dart',
+    saveTraceFile: true,
+  ).run;
+}
+
 TaskFunction createAnimatedComplexOpacityPerfE2ETest({bool? enableImpeller}) {
   return PerfTest.e2e(
     '${flutterDirectory.path}/dev/benchmarks/macrobenchmarks',