fix: cache anmation keyframes

Author: devjiangzhou

webf/lib/src/css/css_animation.dart

@@ -115,28 +115,7 @@ mixin CSSAnimationMixin on RenderStyle {
 
   List<Keyframe>? _getKeyFrames(String animationName) {
     CSSKeyframesRule? cssKeyframesRule = target.ownerDocument.ruleSet.keyframesRules[animationName];
-    if (cssKeyframesRule != null) {
-      List<Keyframe> keyframes = [];
-
-      cssKeyframesRule.blocks.forEach((rule) {
-        double? offset;
-        final keyText = rule.blockSelectors[0];
-        if (keyText == 'from') {
-          offset = 0;
-        } else if (keyText == 'to') {
-          offset = 1;
-        } else {
-          offset = CSSPercentage.parsePercentage(keyText);
-        }
-        for (MapEntry<String, String> entry in rule.declarations) {
-          final property = camelize(entry.key);
-          keyframes.add(Keyframe(property, entry.value, offset ?? 0, LINEAR));
-        }
-        return;
-      });
-      return keyframes;
-    }
-    return null;
+    return cssKeyframesRule?.keyframes;
   }
 
   void beforeRunningAnimation() {

webf/lib/src/css/css_rule.dart

@@ -38,15 +38,30 @@ class KeyFrameBlock {
 class CSSKeyframesRule extends CSSRule {
   final int _keyframeName;
   final String name;
-  final List<KeyFrameBlock> blocks = [];
+  final List<KeyFrameBlock> _blocks = [];
+
+  final List<Keyframe> keyframes = [];
 
   @override
   int get type => CSSRule.KEYFRAMES_RULE;
 
   CSSKeyframesRule(this._keyframeName, this.name) : super();
 
   void add(KeyFrameBlock block) {
-    blocks.add(block);
+    _blocks.add(block);
+    double? offset;
+    final keyText = block.blockSelectors[0];
+    if (keyText == 'from') {
+      offset = 0;
+    } else if (keyText == 'to') {
+      offset = 1;
+    } else {
+      offset = CSSPercentage.parsePercentage(keyText);
+    }
+    for (MapEntry<String, String> entry in block.declarations) {
+      final property = camelize(entry.key);
+      keyframes.add(Keyframe(property, entry.value, offset ?? 0, LINEAR));
+    }
   }
 
   String? get keyFrameName {

webf/test/src/css/style_animations_parser.dart

@@ -15,7 +15,7 @@ void main() {
     test('0', () {
       CSSRule? style = parseSingleRule('@keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } }');
       expect(style is CSSKeyframesRule, true);
-      expect((style as CSSKeyframesRule).blocks.first.blockSelectors, ['75%', '100%']);
+      expect((style as CSSKeyframesRule).keyframes[0].offset, 0.75);
     });
   });
 }