Commit Graph

72 Commits

Author SHA1 Message Date
Aliaksandr Kalenik
44d90af3d6 LibGfx+LibWeb: Cache SkTextBlob in GlyphRun
Previously, SkTextBlob was built on every paint in
DisplayListPlayerSkia::draw_glyph_run(), which meant:
- Repeated work when the same display list is painted multiple times
- Glyph arrays were allocated and populated on each paint

Now the blob is built once during display list recording and cached in
GlyphRun.
2026-01-24 15:22:03 +01:00
Aliaksandr Kalenik
0f18e6e348 LibWeb: Move gradient color stops expansion to recording phase
Expand color stops during display list recording rather than playback.
Recording happens once but the display list may be executed many times,
so doing this work at record time is more efficient.
2026-01-23 19:11:14 +01:00
Aliaksandr Kalenik
fcd155b257 LibWeb: Remove ApplyTransform display list command
ApplyTransform is no longer recorded to the display list. Transforms are
now applied inline during display list execution when switching between
accumulated visual contexts.

Change apply_transform to accept parameters directly instead of the
ApplyTransform struct.
2026-01-23 18:56:24 +01:00
Aliaksandr Kalenik
cb8ecb3c11 LibGfx+LibWeb: Move SVG mask/clip composition from CPU to GPU
Previously, both mask and clip-path were rendered to separate mutable
Gfx::Bitmap objects which forced CPU rasterization. They were then
combined using a CPU pixel-by-pixel operation before being returned
as an ImmutableBitmap.

Instead of including mask in the final bitmap as already rasterized
images, we now use display lists which opens opportunity to utilize
GPU if available.

Bitmap::apply_mask() and ApplyMaskBitmap display list command are no
longer used and have been removed.
2026-01-23 16:23:06 +01:00
Aliaksandr Kalenik
e41e893f02 LibWeb: Skip creating mask surface for empty rects 2026-01-23 16:23:06 +01:00
Zaggy1024
e6dbcccb99 LibGfx+LibMedia: Send video frames to Skia as subsampled YUV
This saves us from having our own color conversion code, which was
taking up a fair amount of time in VideoDataProvider. With this change,
we should be able to play high resolution videos without interruptions
on machines where the CPU can keep up with decoding.

In order to make this change, ImmutableBitmap is now able to be
constructed with YUV data instead of an RBG bitmap. It holds onto a
YUVData instance that stores the buffers of image data, since Skia
itself doesn't take ownership of them.

In order to support greater than 8 bits of color depth, we normalize
the 10- or 12-bit color values into a 16-bit range.
2026-01-22 19:44:36 +01:00
Aliaksandr Kalenik
98afd82491 LibWeb: Integrate clip-path into AccumulatedVisualContext
Previously, clip-path was applied only during painting in
StackingContext::paint(), which meant hit testing did not respect
clip-path boundaries. Clicks outside the visible clipped region but
inside the element's bounding box would incorrectly register as hits.

By moving clip-path into AccumulatedVisualContext, it becomes part of
the same system that handles transforms, clips, and scroll offsets for
both painting and hit testing, ensuring consistent behavior.
2026-01-16 13:39:02 +01:00
Aliaksandr Kalenik
932c2999e4 LibWeb: Delete unused Push{Pop}StackingContext commands
Remove the PushStackingContext and PopStackingContext display list
commands that are no longer used after the AccumulatedVisualContext
integration.

Previously, PushStackingContext was responsible for:
- Applying CSS transforms via its StackingContextTransform field
- Managing opacity layers
- Handling clip paths
- Tracking blend modes

All of this functionality has been replaced by:
- Transform/perspective tracking via AccumulatedVisualContext nodes
- The ApplyEffects command for opacity, blend modes, and filters
- The AddClipPath command for clip paths
2026-01-15 19:50:53 +01:00
Aliaksandr Kalenik
009ddd4823 LibWeb: Integrate AccumulatedVisualContext with display list
Integrate AccumulatedVisualContext with display list recording and
playback. This is the main commit of the refactoring that delivers the
architectural improvements enabled by AccumulatedVisualContext.

Recording changes:

Each display list command now stores a single
RefPtr<AccumulatedVisualContext> instead of separate scroll_frame_id
and ClipFrame. The recorder simply captures the current accumulated
context when appending commands.

The before_paint()/after_paint() hooks that pushed/popped scroll frame
IDs are replaced by directly setting accumulated_visual_context on the
recorder before painting each element.

Playback changes:

The display list player now uses LCA (Lowest Common Ancestor) based
traversal to switch between visual contexts efficiently. When
transitioning from context A to context B:

1. Find the LCA of A and B in the context tree
2. Pop (restore) states back to the LCA depth
3. Push (save + apply) states from LCA down to B

This approach minimizes redundant save/restore operations. For example,
when rendering siblings that share a common scroll container, the
player keeps that scroll state applied and only switches the divergent
parts of their context chains.

Key deletions:

- Remove translate_by() from all 45 display list commands - commands
  are now immutable
- Remove transform/perspective fields from PushStackingContext -
  transforms are tracked via AccumulatedVisualContext
- Remove push_scroll_frame_id()/pop_scroll_frame_id() from
  DisplayListRecorder
- Remove before_paint()/after_paint() hooks from Paintable
- Merge ApplyOpacity, ApplyCompositeAndBlendingOperator, ApplyFilter
  into single ApplyEffects command

Stacking context painting changes:

The StackingContext::paint() method is significantly simplified.
Instead of building a PushStackingContextParams struct with transform
matrices and pushing/popping stacking contexts, it now:

1. Sets the accumulated visual context (which already contains
   transforms)
2. Applies effects (opacity, blend mode, filters) if needed
3. Applies clip path if needed
4. Paints the content
5. Restores state

The visual state management that was interleaved throughout the
painting code is now handled uniformly by the context tree.
2026-01-15 19:50:53 +01:00
Aliaksandr Kalenik
98660ad2b7 LibWeb: Introduce AddClipPath display list item
Introduce a new AddClipPath display list command that applies a
path-based clip region. This command is needed for the upcoming removal
of PushStackingContext, which currently handles clip paths as part of
its functionality. By extracting clip path handling into a dedicated
command, we can eliminate PushStackingContext entirely in favor of the
more granular AccumulatedVisualContext approach.
2026-01-15 19:50:53 +01:00
ayeteadoe
ee3aa865af Meta+LibGfx+LibWeb: Update skia to 144 and remove overlay port
Skia deprecated some non-span versions of their API, but they provided
SK_SUPPORT_UNSPANNED_APIS to expose the legacy versions.

SkFontMgr_New_FontConfig now requires a font scanner to be passed in.

There were a few screenshot tests that visibily looked the same but skia
must've changed some rendering infrastructure as the PNGs were not
matching anymore so I rebaselined those and adjusted the fuzzy matching
config to allow them to pass on both macOS and Linux.

The empty-radial-gradient-crash Ref test started to fail as we were
setting the horizontal scale factor to inf in when the height = 0. It
looks like something changed to make doing that not valid anymore.

The overlay port is removed as the issues, mainly skcms symbol import
and export were resolved upstream in skia and utilized in the new port
version.
2025-12-17 12:00:33 +01:00
Andreas Kling
2577c5ce67 Revert "Meta+LibGfx+LibWeb: Update skia to 144 and remove overlay port"
This reverts commit ac9688ea1e.

Broke the build on arm64 Linux.
2025-12-15 14:12:34 -06:00
ayeteadoe
ac9688ea1e Meta+LibGfx+LibWeb: Update skia to 144 and remove overlay port
Skia deprecated some non-span versions of their API, but they provided
SK_SUPPORT_UNSPANNED_APIS to expose the legacy versions.

SkFontMgr_New_FontConfig now requires a font scanner to be passed in.

There were a few screenshot tests that visibily looked the same but skia
must've changed some rendering infrastructure as the PNGs were not
matching anymore so I rebaselined those and adjusted the fuzzy matching
config to allow them to pass on both macOS and Linux.

The empty-radial-gradient-crash Ref test started to fail as we were
setting the horizontal scale factor to inf in when the height = 0. It
looks like something changed to make doing that not valid anymore.

The overlay port is removed as the issues, mainly skcms symbol import
and export were resolved upstream in skia and utilized in the new port
version.
2025-12-15 10:56:27 +01:00
InvalidUsernameException
28ba610f32 Everywhere: Avoid large rebuilds when editing (Immutable)Bitmap headers
This reduces the number of recompiled files as follow:
- Bitmap.h: 1309 -> 101
- ImmutableBitmap.h: 1218 -> 75
2025-11-28 18:32:48 +01:00
Psychpsyo
2db3796fd3 LibWeb: Implement CSS perspective-origin 2025-11-21 11:14:28 +00:00
Jelle Raaijmakers
740629a3a8 LibWeb: Pass reference to bounding rect for Skia paint style 2025-11-18 15:10:58 +01:00
Jelle Raaijmakers
ba40da5e5f LibWeb: Rename DisplayList's apply_filters to apply_filter 2025-11-18 15:10:58 +01:00
Jelle Raaijmakers
2811c75031 LibWeb: Use anti-aliasing to draw images and painting surfaces
Fixes the jagged edges on the transformed badge on
https://aaronfrancis.com/backstage.
2025-11-12 17:43:02 +01:00
Jelle Raaijmakers
489dea58ba LibWeb: Make all clip rects anti-aliased
This fixes aliased edges when e.g. applying rotation transforms to
certain shapes or SVGs. Although the clip rects themselves are
rectangular, a non-identity matrix transform can be active for the
canvas.

Fixes #5909.
2025-11-12 17:43:02 +01:00
Psychpsyo
e44a97e508 LibWeb: Pass 3D transforms to Skia 2025-11-12 00:41:14 +01:00
Jelle Raaijmakers
f8c4043460 LibWeb: Repeat shader for repeating linear gradient
We implemented repeating linear gradients by expanding a vector of color
stops until the entire range was covered. This is both a bit wasteful
and caused Skia to draw corrupted gradients to screen whenever the total
amount of color stops and positions exceeded 127.

Instead of doing that, use the original color stops for the shader and
repeat it instead of clamping it. We need to do a bit of math to project
positions correctly, but after that the shader repeats itself nicely.

While we're here, calculate the gradient's length and the center point
as floats instead of ints, yielding a slight but noticeable improvement
in gradient rendering (see the diff on the zig zag pattern in
css-gradients.html for an example of this).
2025-10-22 10:45:18 +02:00
Jelle Raaijmakers
868c29545a LibWeb: Skip one single positive linear gradient color stop repeat
We prime `color_stop_list_with_expanded_repeat` with the input
`color_stop_list`, so we don't actually need to copy the stops for the
first iteration. This didn't result in graphical glitches, but these
entries were unnecessary irregardless.
2025-10-22 10:45:18 +02:00
Tim Ledbetter
34857ba554 LibWeb: Apply dithering when painting gradients 2025-10-19 16:53:00 +02:00
Aliaksandr Kalenik
90432f35d5 LibWeb: Call saveLayer() after applying matrix in PushStackingContext
This is required because bounding rect used in `saveLayer()` is computed
in stacking context's coordinate space.

Fixes regression introduced in ba2926f
2025-09-25 04:39:26 +02:00
Aliaksandr Kalenik
ba2926f8b3 LibWeb: Calculate and use bounds for "simple" stacking contexts
Teach the display list executor to derive a bounding rectangle for
stacking contexts whose inner commands can all report bounds, that is,
most contexts without nested stacking contexts.

This yields a large performance improvement on https://tc39.es/ecma262/
where the display list contains thousands of groups like:
```
PushStackingContext blending=Multiply
    DrawGlyphRun
PopStackingContext
```
Previously, `PushStackingContext` triggered an unbounded `saveLayer()`
even when the glyph run lies wholly outside the viewport. With this
change, we (1) cull stacking contexts that fall outside the viewport and
(2) provide bounds to `saveLayer()` when they are visible.

With this change rendering thread goes from 70% to 1% in profiles of
https://tc39.es/ecma262/. Also makes a huge performance difference on
Discord.
2025-09-24 22:11:24 +02:00
Aliaksandr Kalenik
2cf10981af LibGfx+LibWeb: Implement GlyphRun::bounding_rect()
Allows us to skip painting of glyph runs lying outside of viewport.
2025-09-23 17:55:32 +02:00
mikiubo
43978ba459 LibWeb: Enable anti-aliasing in DisplayListPlayerSkia::fill_rect
Set SkPaint anti-aliasing to true when filling rectangles
This improves rendering quality by smoothing jagged edges

update clip-path-transformed.html and ref image with anti-aliasing

Partially fixes #5909
2025-09-22 16:22:48 +02:00
Tim Ledbetter
cfc6439c12 LibWeb: Use shape-rendering to control anti aliasing for SVG paths
Anti-aliasing is disabled if `shape-rendering` is set to
`optimizeSpeed` or `crispEdges`.
2025-08-19 09:47:28 +01:00
Kenneth Myhra
f7442ae907 LibWeb: Remove unnecessary as_if<SVGGradientPaintStyle>() on paint_style
This causes a compiler error on GCC 15.0.1 and should be unnecessary
since paint_style already is of type SVGGradientPaintStyle.
2025-08-17 21:18:28 +01:00
Tim Ledbetter
ad06ac0d58 LibWeb: Implement the color-interpolation property for SVG gradients
This changes the operating color space for gradient `<linearGradient>`
and `<radialGradient>` elements.
2025-08-17 10:51:05 +02:00
Aliaksandr Kalenik
41e3ddb7fa LibGfx+LibWeb: Remove aa_translation from StrokePath and FillPath
`aa_translation` is something we inherited from times when
AntiAliasingPainter was a thing. This change replaces it by applying
offset directly to path.
2025-08-03 10:42:33 +02:00
Aliaksandr Kalenik
a41d586117 LibWeb: Merge FillPathUsingPaintStyle and FillPathUsingColor
Use `Variant<PaintStyle, Gfx::Color>` in new `FillPath` instead of
duplicating two almost identical display list items.
2025-08-03 10:42:33 +02:00
Aliaksandr Kalenik
5c11a541d3 LibWeb: Merge StrokePathUsingPaintStyle and StrokePathUsingColor
Use `Variant<PaintStyle, Gfx::Color>` in new `StrokePath` instead of
duplicating two almost identical display list items.
2025-08-03 10:42:33 +02:00
Aliaksandr Kalenik
e41c85ec47 LibWeb: Replace DrawTriangleWave with StrokePathUsingColor
There's no need to have separate display list item for drawing triangle
wave when we could simply use StrokePathUsingColor. By switching to
StrokePathUsingColor we could also reduce painting because it supports
filtering out by bounding box.
2025-08-03 10:42:33 +02:00
Aliaksandr Kalenik
0a97de85c9 LibWeb: Move item no-op check from display list player to recorder
If item doesn't produce any output then let's skip appending it to the
display list.
2025-08-01 05:25:56 -04:00
Aliaksandr Kalenik
8569124b87 LibWeb: Fix scroll state refresh in cached display list for iframes
6507d23 introduced a bug when snapshot for iframe is saved in
`PaintNestedDisplayList` and, since display lists are immutable, it's
not possible to update before the next repaint.

This change fixes the issue by moving `ScrollStateSnapshot` for
nested display lists from `PaintNestedDisplayList` to
`HashMap<NonnullRefPtr<DisplayList>, ScrollStateSnapshot>` that is
placed into pending rendering task, making it possible to update
snapshots for all display lists before the next repaint.

This change doesn't have a test because it's really hard to make a ref
test that will specifically check scenario when scroll offset of an
iframe is advanced after display list is cached. We already have
`Tests/LibWeb/Ref/input/scroll-iframe.html` but unfortunately it did
not catch this bug.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/5486
2025-07-26 11:53:21 -04:00
Andreas Kling
b4435bd50c LibWeb: Don't clip descendants outside stacking context root rect
Skia allows you to pass a bounding rect to its saveLayer() function as
an optimization when you know that you won't paint outside those bounds.
Unfortunately, we were passing a too-small rectangle that didn't take
into account transformed descendants, etc.

For now, simply pass null instead of a bounding rect. This way, Skia
figures it out internally. It may allocate larger temporary bitmaps than
needed this way, but at least we get more correct results. I've left
re-enabling the optimization as a FIXME in the code.

This fixes unwanted clipping in various parts of the Discord UI.
2025-07-24 11:15:01 -04:00
Aliaksandr Kalenik
193900d661 LibWeb: Cache compiled shaders for masks in DisplayListPlayerSkia
By avoiding recompilation every time `apply_mask_bitmap()` is called, we
save ~5 ms (20ms -> 15ms) in rendering of browser channel on Discord on
my machine.
2025-07-09 19:21:31 +02:00
Tim Ledbetter
e2d0d8e2b9 LibWeb/CSS: Implement the scrollbar-color property
This allows the user to set the scrollbar thumb and track colors.
2025-06-02 00:17:51 +02:00
Lucien Fiorini
0fcb574041 LibGfx+LibWeb: Turn Gfx::Filter into a SkImageFilter wrapper 2025-06-01 23:22:10 +02:00
Timothy Flynn
66e422b4f1 LibWeb: Draw a scrollbar gutter when the scrollbar is enlarged 2025-04-22 11:29:06 -04:00
Timothy Flynn
126be42cfa LibWeb: Paint scrollbar outlines with anti-aliasing
This gives the scrollbar a much less jagged appearance.
2025-04-22 11:29:06 -04:00
Aliaksandr Kalenik
8e2d1559ec LibGfx: Join ScaledFont into Font
Since ScaledFont is the only class inherited from Font we could simply
merge them.
2025-04-21 09:51:16 +02:00
Mehran Kamal
6ba60188b4 LibWeb+LibGfx: Paint dash array and offset for SVG and Canvas 2025-04-14 18:00:38 +01:00
Mehran Kamal
a64902ba25 LibWeb+LibGfx: Paint miter_limit for SVG and Canvas 2025-04-14 18:00:38 +01:00
Aliaksandr Kalenik
6507d23e29 LibWeb: Save ScrollState snapshot in DisplayList to avoid race condition
With this change we save a copy of of scroll state at the time of
recording a display list, instead of actual ScrollState pointer that
could be modifed by the main thread while display list is beings
rasterized on the rendering thread, which leads to a frame painted with
inconsistent scroll state.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/4288
2025-04-12 02:55:18 +02:00
Aliaksandr Kalenik
fd147e6be0 LibWeb: Protect SkiaBackendContext with a mutex
The Skia Ganesh backend we currently use doesn't support painting from
multiple threads, which could happen before this change when the main
thread used Skia to paint on the HTML canvas while the rendering thread
was working on display list rasterization.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/4172
2025-04-01 23:39:05 +02:00
Aliaksandr Kalenik
24527b6ae3 LibWeb: Pass PaintingSurface into DisplayListPlayer::execute()
Deleteing set_surface() makes DisplayListPlayer API a bit more intuitive
because now caller doesn't have to think whether it's necessary to
restore previous surface after execution, instead DisplayListPlayer
takes care of it by maintaining a stack of surfaces.
2025-04-01 23:39:05 +02:00
Glenn Skrzypczak
6906f1722a LibWeb/Painting: Add back SaveLayer command
This reverts commit 552dd18696.
2025-04-01 13:38:00 +02:00
Aliaksandr Kalenik
1229328adc Revert "LibWeb/Painting: Add SaveLayer command"
This reverts commit 1898643ba4.
2025-03-28 16:48:03 +00:00