Changeset 251706 in webkit

Timestamp:

Oct 29, 2019 9:14:58 AM (4 years ago)

Author:

graouts@webkit.org

Message:

[Web Animations] Optimize blending for CSS Transitions
​https://bugs.webkit.org/show_bug.cgi?id=203561

Reviewed by Simon Fraser.

The work performed in KeyframeEffect::setAnimatedPropertiesInStyle() has a level of complexity warranted by the
flexibility of how keyframes can be specified via the Web Animations JS API. However, in the case of CSS Transitions,
we already know that there are only two keyframes, one where offset=0 and one where offset=1, and that only a single
CSS property is specified so we can simplify the process greatly.

To ensure we only perform this quicker blending operation for keyframes computed for a CSS Transition and that no
modification to the keyframes have been applied via the Web Animations JS API after the fact, we now keep track
of whether the blending keyframes (KeyframeList) were generated for a CSS Transition or a CSS Animation and only
use this information to decide whether we're blending for declarative animations.

• animation/KeyframeEffect.cpp:

(WebCore::KeyframeEffect::processKeyframes):
(WebCore::KeyframeEffect::clearBlendingKeyframes):
(WebCore::KeyframeEffect::computeCSSAnimationBlendingKeyframes):
(WebCore::KeyframeEffect::computeCSSTransitionBlendingKeyframes):
(WebCore::KeyframeEffect::setTarget):
(WebCore::KeyframeEffect::setAnimatedPropertiesInStyle):

• animation/KeyframeEffect.h:

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• animation/KeyframeEffect.cpp (modified) (9 diffs)
• animation/KeyframeEffect.h (modified) (3 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2019-10-29  Antoine Quint  <graouts@apple.com>
+
+        [Web Animations] Optimize blending for CSS Transitions
+        https://bugs.webkit.org/show_bug.cgi?id=203561
+
+        Reviewed by Simon Fraser.
+
+        The work performed in KeyframeEffect::setAnimatedPropertiesInStyle() has a level of complexity warranted by the
+        flexibility of how keyframes can be specified via the Web Animations JS API. However, in the case of CSS Transitions,
+        we already know that there are only two keyframes, one where offset=0 and one where offset=1, and that only a single
+        CSS property is specified so we can simplify the process greatly.
+
+        To ensure we only perform this quicker blending operation for keyframes computed for a CSS Transition and that no
+        modification to the keyframes have been applied via the Web Animations JS API after the fact, we now keep track
+        of whether the blending keyframes (KeyframeList) were generated for a CSS Transition or a CSS Animation and only
+        use this information to decide whether we're blending for declarative animations.
+
+        * animation/KeyframeEffect.cpp:
+        (WebCore::KeyframeEffect::processKeyframes):
+        (WebCore::KeyframeEffect::clearBlendingKeyframes):
+        (WebCore::KeyframeEffect::computeCSSAnimationBlendingKeyframes):
+        (WebCore::KeyframeEffect::computeCSSTransitionBlendingKeyframes):
+        (WebCore::KeyframeEffect::setTarget):
+        (WebCore::KeyframeEffect::setAnimatedPropertiesInStyle):
+        * animation/KeyframeEffect.h:
+
 2019-10-29  Adrian Perez de Castro  <aperez@igalia.com>
 

trunk/Source/WebCore/animation/KeyframeEffect.cpp

@@ -727 +727 @@
     m_parsedKeyframes = WTFMove(parsedKeyframes);
 
-    m_blendingKeyframes.clear();
+    clearBlendingKeyframes();
 
     return { };
@@ -771 +771 @@
     frameView->forceLayout();
     return true;
+}
+
+
+void KeyframeEffect::clearBlendingKeyframes()
+{
+    m_blendingKeyframesSource = BlendingKeyframesSource::WebAnimation;
+    m_blendingKeyframes.clear();
 }
 
@@ -910 +917 @@
     }
 
+    m_blendingKeyframesSource = BlendingKeyframesSource::CSSAnimation;
     setBlendingKeyframes(keyframeList);
 }
@@ -937 +945 @@
     keyframeList.insert(WTFMove(toKeyframeValue));
 
+    m_blendingKeyframesSource = BlendingKeyframesSource::CSSTransition;
     setBlendingKeyframes(keyframeList);
 }
@@ -989 +998 @@
         effectAnimation->effectTargetDidChange(previousTarget.get(), m_target.get());
 
-    m_blendingKeyframes.clear();
+    clearBlendingKeyframes();
 
     // We need to invalidate the effect now that the target has changed
@@ -1055 +1064 @@
 void KeyframeEffect::setAnimatedPropertiesInStyle(RenderStyle& targetStyle, double iterationProgress)
 {
+    // In the case of CSS Transitions we already know that there are only two keyframes, one where offset=0 and one where offset=1,
+    // and only a single CSS property so we can simply blend based on the style available on those keyframes with the provided iteration
+    // progress which already accounts for the transition's timing function.
+    if (m_blendingKeyframesSource == BlendingKeyframesSource::CSSTransition) {
+        ASSERT(is<CSSTransition>(animation()));
+        CSSPropertyAnimation::blendProperties(this, downcast<CSSTransition>(animation())->property(), &targetStyle, m_blendingKeyframes[0].style(), m_blendingKeyframes[1].style(), iterationProgress);
+        return;
+    }
+
     // 4.4.3. The effect value of a keyframe effect
     // https://drafts.csswg.org/web-animations-1/#the-effect-value-of-a-keyframe-animation-effect
@@ -1064 +1082 @@
     if (m_blendingKeyframes.isEmpty())
         return;
-
-    bool isCSSAnimation = is<CSSAnimation>(animation());
-    bool isCSSTransition = is<CSSTransition>(animation());
 
     for (auto cssPropertyId : m_blendingKeyframes.properties()) {
@@ -1086 +1101 @@
                 // If we're dealing with a CSS animation, we consider the first and last keyframes to always have the property listed
                 // since the underlying style was provided and should be captured.
-                if (!isCSSAnimation || (offset && offset < 1))
+                if (m_blendingKeyframesSource == BlendingKeyframesSource::WebAnimation || (offset && offset < 1))
                     continue;
             }
@@ -1185 +1200 @@
         // 17. Let transformed distance be the result of evaluating the timing function associated with the first keyframe in interval endpoints
         //     passing interval distance as the input progress.
-        // We do not need to do this for CSS Transitions since the timing function is applied to the AnimationEffect as a whole and thus
-        // iterationProgress is already transformed.
         auto transformedDistance = intervalDistance;
-        if (!isCSSTransition && startKeyframeIndex) {
+        if (startKeyframeIndex) {
             if (auto duration = iterationDuration()) {
                 auto rangeDuration = (endOffset - startOffset) * duration.seconds();

trunk/Source/WebCore/animation/KeyframeEffect.h

@@ -142 +142 @@
 
     enum class AcceleratedAction : uint8_t { Play, Pause, Seek, Stop };
+    enum class BlendingKeyframesSource : uint8_t { CSSAnimation, CSSTransition, WebAnimation };
 
     void copyPropertiesFromSource(Ref<KeyframeEffect>&&);
@@ -152 +153 @@
     void computedNeedsForcedLayout();
     void computeStackingContextImpact();
+    void clearBlendingKeyframes();
     void updateBlendingKeyframes(RenderStyle&);
     void computeCSSAnimationBlendingKeyframes();
@@ -171 +173 @@
 
     AcceleratedAction m_lastRecordedAcceleratedAction { AcceleratedAction::Stop };
+    BlendingKeyframesSource m_blendingKeyframesSource { BlendingKeyframesSource::WebAnimation };
     IterationCompositeOperation m_iterationCompositeOperation { IterationCompositeOperation::Replace };
     CompositeOperation m_compositeOperation { CompositeOperation::Replace };