Animations on the GPU compositor, and text that stays in its box
An animation and rendering release: 19 of 20 animation test pages now run on the GPU compositor with no engine work per frame (7 before this release), filter and 3D flip frames are drawn by GPU passes, text inside rotated, clipped, masked or blended boxes is finally right, and a button's label sits in the middle of the button. 22 changes, each checked against the reference browser or the software renderer. The GPU row moves 54 to 62 on the measured animation test; the overall score holds at 74.
Animations that actually run
We built a test of 20 ordinary animation pages: spinners, pulses, cards that fade and slide, progress bars, flips. Only 7 of them ran properly on the GPU compositor. The rest failed for reasons that had little to do with the GPU: a list of animations ran only the first, a spinner written with just an end keyframe stood still, an animation added after load had already finished by the time it started, paused did nothing, and easing set on a keyframe was ignored. All of that is fixed, and 19 of the 20 pages now run on the compositor with no engine work per frame, each frame checked byte for byte against what the engine itself would draw. The 20th, an animated frosted panel, needs a layer of the page behind it and comes next.
Text that stays in its box
This one was hiding in plain sight, and an old note in the code called it known and not fixed. A block's bare text is held in a small piece of its own that carries the block's identity, so each effect on the block reached that text twice. Rotate a box 45 degrees and its words turned 90 and left the box. Clip-path cut the words again against their own outline, a mask faded them twice, and a blend mode could erase them. The earlier attempts broke inline badges, so this time a test pins it down: 15 effects across 4 kinds of box, each compared with the same text wrapped in its own element. 8 of those 60 matched before, and all 60 match now. Rotated text is still a little softer than the reference, because the box is drawn and then turned, which is the next thing to improve.
Cards that turn in 3D, on the GPU
The same fault broke 3D: words on a tilted card were transformed twice and scattered, as the before side shows. With that fixed, a card flip could run on the compositor. A new GPU pass projects the layer for every frame, sampling each pixel four times, with hidden backs and a parent's perspective handled. Projection needs a real division, so it cannot be promised byte for byte the way the other passes are. A law bounds it instead: at most 0.1% of pixels may differ, and on DirectX 12 just 2 of 448,696 do, by one colour level.
Filters on the GPU, in whole numbers
A filter animation has to refilter the layer for every frame, which is exactly the job a GPU is for, but only if its answer matches. So we rewrote the sums first. Every colour filter is now one matrix in whole-number arithmetic, rounded the way the reference rounds, and the same sum runs in software and in a GPU compute shader. That made our filters more accurate than before and makes a filtered frame byte for byte the software result on Apple Silicon and DirectX 12 alike.
A label in the middle of its button
Give a button a height and its label stayed at the top. That is how nearly every button on the web is sized, so it was odd to find it only now, by accident, while testing something else. A button's label, and an input's or a select's text, now sits in the middle of the box, however the height came about: set directly, a percentage, a minimum height, or stretched by a flex row or grid cell.