Web Inspector: Timeline: Differentiate between CPU and GPU paint

• Component: Web Inspector
• Status: NEW ---

[Tobias Reiss]

As a user I want to debug the frames of an animation (e.g. CSS Animations) and see if the frame was rendered mostly on the CPU (bad) or on the GPU (good). A user could immediately see if a CSS Property can be rendered efficiently.

## I'd expect a well prepared CSS Animation of a scaling Ball that only uses Transform to mostly be processed on the GPU. Considering the animation contains of 4 frames: 

Frame 1:
[ ] Layout x ms
[ ] Paint (CPU) 10 ms (=> Paint the ball into a Bitmap, send Bitmap and Animation instructions to the Compositor Thread)
[ ] Paint (GPU) 10 ms (=> Upload the Bitmap to GPU and draw to Screen)

Frame 2:
[ ] Paint (GPU) 03 ms (=> Draw Bitmap from GPU memory to screen with scaling 0.5)

Frame 3:
[ ] Paint (GPU) 03 ms (=> Draw Bitmap from GPU memory to screen with scaling 0.6)

Frame 4:
[ ] Paint (GPU) 03 ms (=> Draw Bitmap from GPU memory to screen with scaling 0.7)

## Now I prepare an CSS Animation of a Ball where I change the color from green to blue. The Frames are mostly expected to be processed on the CPU.

Frame 1:
[ ] Layout x ms
[ ] Paint (CPU) 10 ms (=> Paint the ball with 100% green into a Bitmap, send Bitmap to the Compositor Thread)
[ ] Paint (GPU) 10 ms (=> Upload the Bitmap to GPU and draw to Screen)

Frame 2:
[ ] Paint (CPU) 10 ms (=> Paint the ball with 65% green and 35% blue into a Bitmap, send Bitmap to the Compositor Thread)
[ ] Paint (GPU) 10 ms (=> Upload the Bitmap to GPU and draw to Screen)

Frame 3:
[ ] Paint (CPU) 10 ms (=> Paint the ball with 35% green and 65% blue into a Bitmap, send Bitmap to the Compositor Thread)
[ ] Paint (GPU) 10 ms (=> Upload the Bitmap to GPU and draw to Screen)

Frame 4:
[ ] Paint (CPU) 10 ms (=> Paint the ball with 100% blue into a Bitmap, send Bitmap to the Compositor Thread)
[ ] Paint (GPU) 10 ms (=> Upload the Bitmap to GPU and draw to Screen)

[Radar WebKit Bug Importer]

<rdar://problem/20785757>

[Brian Burg]

+smfr and dino

I'm not sure how much of this data is possible to gather, and how much of it is already sitting around somewhere and not plumbed through to the inspector.

[Simon Fraser (smfr)]

We know total commit time, and webkit painting time. The delta is GPU painting plus a bunch of other stuff.