189299 2018-09-04 23:40:34 -0700 [Web Animations] Implement composite operations 2023-05-10 10:48:27 -0700 1 1 1 Unclassified WebKit Animations Safari Technology Preview Unspecified Unspecified RESOLVED CONFIGURATION CHANGED InRadar P2 Normal --- 232081 232082 232085 232087 230404 232084 232086 235596 236447 242185 218910 220848 1 graouts webkit-unassigned augus.dupin bfulgham contact dino graouts nmouchtaris vincentriemer webkit-bug-importer oldest_to_newest 1456644 0 graouts 2018-09-04 23:40:34 -0700 The Web Animations spec supports composite operations on keyframes, we should support this feature for complete spec support. 1456646 1 webkit-bug-importer 2018-09-04 23:41:46 -0700 <rdar://problem/44128785> 1713481 2 contact 2020-12-10 04:02:29 -0800 Any update on this? End of 2020 and broad support everywhere but WebKit/Safari: https://caniuse.com/?search=Web%20Animations 1713498 3 graouts 2020-12-10 05:20:49 -0800 Hi Ben. No update at the moment. I've got a prototype implementation in a development branch, but I have to invest more time to actually make it something that could be considered for landing into WebKit. 1713529 4 contact 2020-12-10 06:53:20 -0800 Thanks for the update Antoine, hoping you get to it shortly. I've recently recorded a course on WAAPI and a shame when I have to add WebKit caveats like it is a 'red-headed stepchild'! 1794422 5 graouts 2021-09-17 07:01:41 -0700 The first step towards supporting this feature is covered by bug 230404 so that we support composite operations for software animations. 1877799 6 bfulgham 2022-06-23 13:32:43 -0700 This is now: rdar://87213273 1880650 7 graouts 2022-07-05 01:39:54 -0700 Composite operations are now generally supported in WebKit and are enabled in Safari Technology Preview and Safari in macOS 13 and iOS 16 betas. The remaining blocking bugs paint a picture of outstanding compatibility issues that we are still working on but will be pretty specific to a given CSS property. The most important thing to be aware of is that properties that can be typically accelerated, such as "opacity", "filter", "transform", "translate", "scale" and "rotate" will not be fully accelerated if composite operations are used. Instead, the animation resolution will operate on the main thread, while the application of the property will operate on a GraphicsLayer. We are continuing to look into how to address this in the future. 1917530 8 contact 2022-12-08 01:51:55 -0800 Simple operations like a composite add do not work as expected in Safari. Is it best to open a separate issue for that? This simple example: https://codepen.io/benfrain/pen/JjXQqVO Click 'Move Me' to start the box moving, and then click the 'Scale Me' button to add a scale (using composite: add) — in now way renders as expected in Safari. Fine in Firefox/Chrome. 1917559 9 graouts 2022-12-08 05:55:16 -0800 (In reply to Ben Frain from comment #8) > Simple operations like a composite add do not work as expected in Safari. Is > it best to open a separate issue for that? > > This simple example: https://codepen.io/benfrain/pen/JjXQqVO > > Click 'Move Me' to start the box moving, and then click the 'Scale Me' > button to add a scale (using composite: add) — in now way renders as > expected in Safari. Fine in Firefox/Chrome. Yes, this is a specific issue. Could you file a dedicated bug report? I'll look into it. 1917575 10 contact 2022-12-08 07:12:42 -0800 Done https://bugs.webkit.org/show_bug.cgi?id=248944 1954380 11 graouts 2023-05-10 10:48:27 -0700 This feature has been implemented for quite some time now.