Add errorBuilder

This PR improves some fill performance issues I found with various Lottie animations.
I think the real issue comes down to the render performance of Path.addPath(). The performance issue happens in the Render thread and seems directly related to how large the animation is on-screen. Flutter might be caching pre-rendered textures and running out of memory.

I've changed how Path.addPath() is called and how the path is rendered for fill_content.dart and gradient_fill_content.dart.

Just as an example, the example/assets/Tests/bm.json animation gets ~60 fps with this fix, compared to 34-52 fps with the lottie-flutter 0.6.0 release. (This is on a Pixel 3 XL)

There are a couple of other changes:

- I fixed a bug with the casing of "weather" in pubspec.yaml. Without this fix, the examples don't build on Ubuntu Linux.
The debugging class MeanCalculator wasn't initializing its fields, causing a null pointer exception when debugging.
- I added antiAliasingSuggested to LottieDrawable to allow fill paints to be anti-aliased. It is off by default. It also provides some minor performance improvements without any noticeable loss in quality. It is only applied to fills right now.
- I added PathFactory to create Paths rather than just new-ing them. path_factory.dart allows you to switch out the normal Path creation with a debug logging implementation so you can see all of the Path calls that are performed during a frame. Just create a DebugPath in the factory rather than Path.

CHANGELOG.md

@@ -1,3 +1,14 @@
+## [0.6.0]
+- Runs the animation at the frame rate specified in the json file (ie. An animation encoded with a 20 FPS will only
+  be paint 20 times per seconds even though the AnimationController will invalidate the widget 60 times per seconds).  
+  A new property `frameRate` allows to opt-out this behavior and have the widget to repaint at the device frame rate 
+   (`FrameRate.max`).
+- Automatically add a `RepaintBoundary` around the widget. Since `Lottie` animations are generally complex to paint, a
+   `RepaintBoundary` will separate the animation with the rest of the app and improve performance. A new property `addRepaintBoundary`
+   allows to opt-out this behavior.
+- Fix a bug where we would call `markNeedPaint` when the animation was not changing. This removes unnecessary paints in
+  animations with static periods.
+
 ## [0.5.1]
 - Remove direct dependencies on dart:io to support Flutter Web
 

README.template.md

@@ -17,7 +17,7 @@ This example shows how to display a Lottie animation in the simplest way.
 The `Lottie` widget will load the json file and run the animation indefinitely.
 
 ```dart
-import 'example/lib/examples/main.dart';
+import 'example/lib/main.dart';
 ```
 
 ### Specify a custom `AnimationController`

example/lib/examples/main.dart

@@ -1,27 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:lottie/lottie.dart';
-
-void main() => runApp(MyApp());
-
-class MyApp extends StatelessWidget {
-  @override
-  Widget build(BuildContext context) {
-    return MaterialApp(
-      home: Scaffold(
-        body: ListView(
-          children: [
-            // Load a Lottie file from your assets
-            Lottie.asset('assets/LottieLogo1.json'),
-
-            // Load a Lottie file from a remote url
-            Lottie.network(
-                'https://raw.githubusercontent.com/xvrh/lottie-flutter/master/example/assets/Mobilo/A.json'),
-
-            // Load an animation and its images from a zip file
-            Lottie.asset('assets/lottiefiles/angel.zip'),
-          ],
-        ),
-      ),
-    );
-  }
-}

example/lib/main.dart

@@ -1,157 +1,24 @@
-import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:logging/logging.dart';
 import 'package:lottie/lottie.dart';
-import 'src/all_files.g.dart';
 
-void main() {
+void main() => runApp(MyApp());
-  Logger.root
-    ..level = Level.ALL
-    ..onRecord.listen(print);
-  Lottie.traceEnabled = true;
-  runApp(App());
-}
 
-class App extends StatelessWidget {
+class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-      //showPerformanceOverlay: true,
       home: Scaffold(
-        appBar: AppBar(
+        body: ListView(
-          title: Text('Lottie Flutter'),
-        ),
-        body: GridView.builder(
-          itemCount: files.length,
-          gridDelegate:
-              SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
-          itemBuilder: (context, index) {
-            var assetName = files[index];
-            return GestureDetector(
-              child: _Item(
-                child: Lottie.asset(
-                  assetName,
-                  frameBuilder: (context, child, composition) {
-                    return AnimatedOpacity(
-                      child: child,
-                      opacity: composition == null ? 0 : 1,
-                      duration: const Duration(seconds: 1),
-                      curve: Curves.easeOut,
-                    );
-                  },
-                ),
-              ),
-              onTap: () {
-                Navigator.of(context).push(MaterialPageRoute<void>(
-                    builder: (context) => Detail(assetName)));
-              },
-            );
-          },
-        ),
-      ),
-    );
-  }
-}
-
-class _Item extends StatelessWidget {
-  final Widget child;
-
-  const _Item({Key key, this.child}) : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.all(8.0),
-      child: Container(
-        decoration: BoxDecoration(
-            color: Colors.white,
-            borderRadius: BorderRadius.all(Radius.circular(10)),
-            boxShadow: [
-              BoxShadow(
-                  color: Colors.black.withOpacity(0.1),
-                  offset: Offset(2, 2),
-                  blurRadius: 5)
-            ]),
-        child: child,
-      ),
-    );
-  }
-}
-
-class Detail extends StatefulWidget {
-  final String assetName;
-
-  const Detail(this.assetName, {Key key}) : super(key: key);
-
-  @override
-  _DetailState createState() => _DetailState();
-}
-
-class _DetailState extends State<Detail> with TickerProviderStateMixin {
-  AnimationController _controller;
-
-  @override
-  void initState() {
-    super.initState();
-
-    _controller = AnimationController(vsync: this);
-  }
-
-  @override
-  void dispose() {
-    _controller.dispose();
-
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: AppBar(
-        title: Text('${widget.assetName}'),
-      ),
-      body: SingleChildScrollView(
-        child: Column(
           children: [
-            Center(
+            // Load a Lottie file from your assets
-              child: Lottie.asset(
+            Lottie.asset('assets/LottieLogo1.json'),
-                widget.assetName,
+
-                controller: _controller,
+            // Load a Lottie file from a remote url
-                onLoaded: (composition) {
+            Lottie.network(
-                  _controller.duration = composition.duration;
+                'https://raw.githubusercontent.com/xvrh/lottie-flutter/master/example/assets/Mobilo/A.json'),
-                  _controller.repeat();
+
-                },
+            // Load an animation and its images from a zip file
-              ),
+            Lottie.asset('assets/lottiefiles/angel.zip'),
-            ),
-            AnimatedBuilder(
-              animation: _controller,
-              builder: (context, _) => Row(
-                children: <Widget>[
-                  Expanded(
-                    child: Slider(
-                      value: _controller.value,
-                      onChanged: (newValue) {
-                        _controller.value = newValue;
-                      },
-                    ),
-                  ),
-                  IconButton(
-                    icon: Icon(_controller.isAnimating
-                        ? Icons.stop
-                        : Icons.play_arrow),
-                    onPressed: () {
-                      setState(() {
-                        if (_controller.isAnimating) {
-                          _controller.stop();
-                        } else {
-                          _controller.repeat();
-                        }
-                      });
-                    },
-                  ),
-                ],
-              ),
-            ),
           ],
         ),
       ),

example/lib/main_app.dart

@@ -0,0 +1,160 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:logging/logging.dart';
+import 'package:lottie/lottie.dart';
+import 'src/all_files.g.dart';
+
+void main() {
+  Logger.root
+    ..level = Level.ALL
+    ..onRecord.listen(print);
+  Lottie.traceEnabled = true;
+  runApp(App());
+}
+
+class App extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      //showPerformanceOverlay: true,
+      home: Scaffold(
+        appBar: AppBar(
+          title: Text('Lottie Flutter'),
+        ),
+        body: GridView.builder(
+          itemCount: files.length,
+          gridDelegate:
+              SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
+          itemBuilder: (context, index) {
+            var assetName = files[index];
+            return GestureDetector(
+              child: _Item(
+                child: Lottie.asset(
+                  assetName,
+                  frameBuilder: (context, child, composition) {
+                    return AnimatedOpacity(
+                      child: child,
+                      opacity: composition == null ? 0 : 1,
+                      duration: const Duration(seconds: 1),
+                      curve: Curves.easeOut,
+                    );
+                  },
+                ),
+              ),
+              onTap: () {
+                Navigator.of(context).push(MaterialPageRoute<void>(
+                    builder: (context) => Detail(assetName)));
+              },
+            );
+          },
+        ),
+      ),
+    );
+  }
+}
+
+class _Item extends StatelessWidget {
+  final Widget child;
+
+  const _Item({Key key, this.child}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(8.0),
+      child: Container(
+        decoration: BoxDecoration(
+            color: Colors.white,
+            borderRadius: BorderRadius.all(Radius.circular(10)),
+            boxShadow: [
+              BoxShadow(
+                  color: Colors.black.withOpacity(0.1),
+                  offset: Offset(2, 2),
+                  blurRadius: 5)
+            ]),
+        child: child,
+      ),
+    );
+  }
+}
+
+class Detail extends StatefulWidget {
+  final String assetName;
+
+  const Detail(this.assetName, {Key key}) : super(key: key);
+
+  @override
+  _DetailState createState() => _DetailState();
+}
+
+class _DetailState extends State<Detail> with TickerProviderStateMixin {
+  AnimationController _controller;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _controller = AnimationController(vsync: this);
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: Text('${widget.assetName}'),
+      ),
+      body: SingleChildScrollView(
+        child: Column(
+          children: [
+            Center(
+              child: Lottie.asset(
+                widget.assetName,
+                controller: _controller,
+                onLoaded: (composition) {
+                  _controller.duration = composition.duration;
+                  _controller.repeat();
+                },
+              ),
+            ),
+            AnimatedBuilder(
+              animation: _controller,
+              builder: (context, _) => Row(
+                children: <Widget>[
+                  Expanded(
+                    child: Slider(
+                      value: _controller.value,
+                      onChanged: (newValue) {
+                        _controller.value = newValue;
+                      },
+                    ),
+                  ),
+                  IconButton(
+                    icon: Icon(_controller.isAnimating
+                        ? Icons.stop
+                        : Icons.play_arrow),
+                    onPressed: () {
+                      setState(() {
+                        if (_controller.isAnimating) {
+                          _controller.stop();
+                        } else {
+                          _controller.repeat();
+                        }
+                      });
+                    },
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

example/macos/Podfile.lock

@@ -5,13 +5,13 @@ PODS:
     - FlutterMacOS
 
 DEPENDENCIES:
-  - FlutterMacOS (from `Flutter/ephemeral/.symlinks/flutter/darwin-x64`)
+  - FlutterMacOS (from `Flutter/ephemeral/.symlinks/flutter/darwin-x64-profile`)
   - path_provider (from `Flutter/ephemeral/.symlinks/plugins/path_provider/macos`)
   - path_provider_macos (from `Flutter/ephemeral/.symlinks/plugins/path_provider_macos/macos`)
 
 EXTERNAL SOURCES:
   FlutterMacOS:
-    :path: Flutter/ephemeral/.symlinks/flutter/darwin-x64
+    :path: Flutter/ephemeral/.symlinks/flutter/darwin-x64-profile
   path_provider:
     :path: Flutter/ephemeral/.symlinks/plugins/path_provider/macos
   path_provider_macos:

example/pubspec.lock

@@ -21,7 +21,7 @@ packages:
       name: async
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.4.1"
+    version: "2.4.2"
   boolean_selector:
     dependency: transitive
     description:
@@ -56,7 +56,7 @@ packages:
       name: collection
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.14.12"
+    version: "1.14.13"
   convert:
     dependency: transitive
     description:
@@ -143,14 +143,14 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "0.4.1"
+    version: "0.6.0"
   matcher:
     dependency: transitive
     description:
       name: matcher
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.12.6"
+    version: "0.12.8"
   meta:
     dependency: transitive
     description:
@@ -171,7 +171,7 @@ packages:
       name: path_provider
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.6.11"
+    version: "1.6.14"
   path_provider_linux:
     dependency: transitive
     description:
@@ -192,7 +192,7 @@ packages:
       name: path_provider_platform_interface
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.0.2"
+    version: "1.0.3"
   pedantic:
     dependency: transitive
     description:
@@ -239,7 +239,7 @@ packages:
       name: stack_trace
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.9.3"
+    version: "1.9.5"
   stream_channel:
     dependency: transitive
     description:
@@ -267,14 +267,14 @@ packages:
       name: test_api
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.2.16"
+    version: "0.2.17"
   typed_data:
     dependency: transitive
     description:
       name: typed_data
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.1.6"
+    version: "1.2.0"
   vector_math:
     dependency: transitive
     description:
@@ -290,5 +290,5 @@ packages:
     source: hosted
     version: "0.1.0"
 sdks:
-  dart: ">=2.7.0 <3.0.0"
+  dart: ">=2.9.0-14.0.dev <3.0.0"
   flutter: ">=1.12.13+hotfix.5 <2.0.0"

example/pubspec.yaml

@@ -34,7 +34,7 @@ flutter:
     - assets/Logo/
     - assets/Images/
     - assets/Images/WeAccept/
-    - assets/Weather/
+    - assets/weather/
     - assets/example_with_images/
     - assets/example_with_images/images/
 

example/test/dynamic_properties_test.dart

@@ -33,6 +33,7 @@ void main() {
           composition: composition,
           controller: animation,
           delegates: LottieDelegates(values: [delegate]),
+          addRepaintBoundary: false,
         ),
       );
       await tester.pump();
@@ -45,6 +46,7 @@ void main() {
             composition: composition,
             controller: animation,
             delegates: LottieDelegates(values: []),
+            addRepaintBoundary: false,
           ),
         );
         await tester.pump();

example/test/utils.dart

@@ -42,7 +42,7 @@ class _CustomerPainter extends CustomPainter {
           thumbSize;
 
       drawable
-        ..setProgress(progress)
+        ..setProgress(progress, frameRate: FrameRate.max)
         ..draw(canvas, rect);
 
       ++index;

example/test/widget_test.dart

@@ -1,5 +1,5 @@
 import 'package:flutter_test/flutter_test.dart';
-import 'package:lottie_example/main.dart';
+import 'package:lottie_example/main_app.dart';
 
 void main() {
   testWidgets('Main sample', (tester) async {

lib/lottie.dart

@@ -1,4 +1,5 @@
 export 'src/composition.dart' show LottieComposition;
+export 'src/frame_rate.dart' show FrameRate;
 export 'src/lottie.dart' show Lottie;
 export 'src/lottie_builder.dart' show LottieBuilder;
 export 'src/lottie_delegates.dart' show LottieDelegates;

lib/src/animation/content/base_stroke_content.dart

@@ -13,6 +13,7 @@ import '../../model/layer/base_layer.dart';
 import '../../utils.dart';
 import '../../utils/dash_path.dart';
 import '../../utils/misc.dart';
+import '../../utils/path_factory.dart';
 import '../../utils/utils.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/base_keyframe_animation.dart';
@@ -25,8 +26,8 @@ import 'trim_path_content.dart';
 
 abstract class BaseStrokeContent
     implements KeyPathElementContent, DrawingContent {
-  final Path _path = Path();
+  final Path _path = PathFactory.create();
-  final Path _trimPathPath = Path();
+  final Path _trimPathPath = PathFactory.create();
   final LottieDrawable lottieDrawable;
   final BaseLayer layer;
   final List<_PathGroup> _pathGroups = <_PathGroup>[];

lib/src/animation/content/content_group.dart

@@ -9,6 +9,7 @@ import '../../model/key_path.dart';
 import '../../model/key_path_element.dart';
 import '../../model/layer/base_layer.dart';
 import '../../utils.dart';
+import '../../utils/path_factory.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/transform_keyframe_animation.dart';
 import 'content.dart';
@@ -43,7 +44,7 @@ class ContentGroup implements DrawingContent, PathContent, KeyPathElement {
   }
 
   final Matrix4 _matrix = Matrix4.identity();
-  final Path _path = Path();
+  final Path _path = PathFactory.create();
 
   @override
   final String name;

lib/src/animation/content/ellipse_content.dart

@@ -7,6 +7,7 @@ import '../../model/key_path.dart';
 import '../../model/layer/base_layer.dart';
 import '../../utils.dart';
 import '../../utils/misc.dart';
+import '../../utils/path_factory.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/base_keyframe_animation.dart';
 import 'compound_trim_path_content.dart';
@@ -18,7 +19,7 @@ import 'trim_path_content.dart';
 class EllipseContent implements PathContent, KeyPathElementContent {
   static final double _ellipseControlPointPercentage = 0.55228;
 
-  final Path _path = Path();
+  final Path _path = PathFactory.create();
 
   @override
   final String name;

lib/src/animation/content/fill_content.dart

@@ -8,6 +8,7 @@ import '../../model/key_path.dart';
 import '../../model/layer/base_layer.dart';
 import '../../utils.dart';
 import '../../utils/misc.dart';
+import '../../utils/path_factory.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/base_keyframe_animation.dart';
 import '../keyframe/value_callback_keyframe_animation.dart';
@@ -17,7 +18,7 @@ import 'key_path_element_content.dart';
 import 'path_content.dart';
 
 class FillContent implements DrawingContent, KeyPathElementContent {
-  final Path _path = Path();
+  final Path _path = PathFactory.create();
   final Paint _paint = Paint();
   final BaseLayer layer;
   @override
@@ -70,6 +71,9 @@ class FillContent implements DrawingContent, KeyPathElementContent {
     var alpha =
         ((parentAlpha / 255.0 * _opacityAnimation.value / 100.0) * 255).round();
     _paint.setAlpha(alpha.clamp(0, 255).toInt());
+    if (lottieDrawable.antiAliasingSuggested) {
+      _paint.isAntiAlias = true;
+    }
 
     if (_colorFilterAnimation != null) {
       _paint.colorFilter = _colorFilterAnimation.value;
@@ -77,11 +81,13 @@ class FillContent implements DrawingContent, KeyPathElementContent {
 
     _path.reset();
     for (var i = 0; i < _paths.length; i++) {
-      _path.addPath(_paths[i].getPath(), Offset.zero,
+      _path.addPath(_paths[i].getPath(), Offset.zero);
-          matrix4: parentMatrix.storage);
     }
 
+    canvas.save();
+    canvas.transform(parentMatrix.storage);
     canvas.drawPath(_path, _paint);
+    canvas.restore();
 
     L.endSection('FillContent#draw');
   }

lib/src/animation/content/gradient_fill_content.dart

@@ -10,6 +10,7 @@ import '../../model/key_path.dart';
 import '../../model/layer/base_layer.dart';
 import '../../utils.dart';
 import '../../utils/misc.dart';
+import '../../utils/path_factory.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/base_keyframe_animation.dart';
 import '../keyframe/value_callback_keyframe_animation.dart';
@@ -25,7 +26,7 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
   final GradientFill _fill;
   final _linearGradientCache = <int, Gradient>{};
   final _radialGradientCache = <int, Gradient>{};
-  final _path = Path();
+  final _path = PathFactory.create();
   final _paint = Paint();
   final _paths = <PathContent>[];
   final BaseKeyframeAnimation<GradientColor, GradientColor> _colorAnimation;
@@ -85,15 +86,14 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
     L.beginSection('GradientFillContent#draw');
     _path.reset();
     for (var i = 0; i < _paths.length; i++) {
-      _path.addPath(_paths[i].getPath(), Offset.zero,
+      _path.addPath(_paths[i].getPath(), Offset.zero);
-          matrix4: parentMatrix.storage);
     }
 
     Gradient gradient;
     if (_fill.gradientType == GradientType.linear) {
-      gradient = _getLinearGradient(parentMatrix);
+      gradient = _getLinearGradient();
     } else {
-      gradient = _getRadialGradient(parentMatrix);
+      gradient = _getRadialGradient();
     }
 
     _paint.shader = gradient;
@@ -105,8 +105,14 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
     var alpha =
         ((parentAlpha / 255.0 * _opacityAnimation.value / 100.0) * 255).round();
     _paint.setAlpha(alpha.clamp(0, 255).toInt());
+    if (lottieDrawable.antiAliasingSuggested) {
+      _paint.isAntiAlias = true;
+    }
 
+    canvas.save();
+    canvas.transform(parentMatrix.storage);
     canvas.drawPath(_path, _paint);
+    canvas.restore();
     L.endSection('GradientFillContent#draw');
   }
 
@@ -124,8 +130,8 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
         outBounds.right + 1, outBounds.bottom + 1);
   }
 
-  Gradient _getLinearGradient(Matrix4 parentMatrix) {
+  Gradient _getLinearGradient() {
-    var gradientHash = _getGradientHash(parentMatrix);
+    var gradientHash = _getGradientHash();
     var gradient = _linearGradientCache[gradientHash];
     if (gradient != null) {
       return gradient;
@@ -135,14 +141,14 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
     var gradientColor = _colorAnimation.value;
     var colors = _applyDynamicColorsIfNeeded(gradientColor.colors);
     var positions = gradientColor.positions;
-    gradient = Gradient.linear(startPoint, endPoint, colors, positions,
+    gradient = Gradient.linear(
-        TileMode.clamp, parentMatrix.storage);
+        startPoint, endPoint, colors, positions, TileMode.clamp);
     _linearGradientCache[gradientHash] = gradient;
     return gradient;
   }
 
-  Gradient _getRadialGradient(Matrix4 parentMatrix) {
+  Gradient _getRadialGradient() {
-    var gradientHash = _getGradientHash(parentMatrix);
+    var gradientHash = _getGradientHash();
     var gradient = _radialGradientCache[gradientHash];
     if (gradient != null) {
       return gradient;
@@ -160,13 +166,13 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
     if (radius <= 0) {
       radius = 0.001;
     }
-    gradient = Gradient.radial(startPoint, radius, colors, positions,
+    gradient =
-        TileMode.clamp, parentMatrix.storage);
+        Gradient.radial(startPoint, radius, colors, positions, TileMode.clamp);
     _radialGradientCache[gradientHash] = gradient;
     return gradient;
   }
 
-  int _getGradientHash(Matrix4 parentMatrix) {
+  int _getGradientHash() {
     var startPointProgress =
         (_startPointAnimation.progress * _cacheSteps).round();
     var endPointProgress = (_endPointAnimation.progress * _cacheSteps).round();
@@ -181,7 +187,6 @@ class GradientFillContent implements DrawingContent, KeyPathElementContent {
     if (colorProgress != 0) {
       hash = hash * 31 * colorProgress;
     }
-    hash *= 31 * parentMatrix.hashCode;
     return hash;
   }
 

lib/src/animation/content/merge_paths_content.dart

@@ -1,15 +1,16 @@
 import 'dart:ui';
 import '../../model/content/merge_paths.dart';
 import '../../utils.dart';
+import '../../utils/path_factory.dart';
 import 'content.dart';
 import 'content_group.dart';
 import 'greedy_content.dart';
 import 'path_content.dart';
 
 class MergePathsContent implements PathContent, GreedyContent {
-  final Path _firstPath = Path();
+  final Path _firstPath = PathFactory.create();
-  final Path _remainderPath = Path();
+  final Path _remainderPath = PathFactory.create();
-  final Path _path = Path();
+  final Path _path = PathFactory.create();
 
   final List<PathContent> _pathContents = <PathContent>[];
   final MergePaths _mergePaths;

lib/src/animation/content/polystar_content.dart

@@ -8,6 +8,7 @@ import '../../model/content/shape_trim_path.dart';
 import '../../model/key_path.dart';
 import '../../model/layer/base_layer.dart';
 import '../../utils/misc.dart';
+import '../../utils/path_factory.dart';
 import '../../value/lottie_value_callback.dart';
 import '../keyframe/base_keyframe_animation.dart';
 import 'compound_trim_path_content.dart';
@@ -23,7 +24,7 @@ class PolystarContent implements PathContent, KeyPathElementContent {
   /// work otherwise.
   static final _polystarMagicNumber = .47829;
   static final _polygonMagicNumber = .25;
-  final _path = Path();
+  final _path = PathFactory.create();
 
   final LottieDrawable lottieDrawable;
   final PolystarShape _polystarShape;