Skip to content

Back-port seals inside layers, gradient repetition and WebGPU scratch bounds to 3.1.x - #429

Merged
JimBobSquarePants merged 14 commits into
release/3.1.xfrom
js/v3-gradient-repeat-scene-fixes
Oct 28, 2026
Merged

JimBobSquarePants merged 14 commits into
release/3.1.xfrom
js/v3-gradient-repeat-scene-fixes

Conversation

@JimBobSquarePants

@JimBobSquarePants JimBobSquarePants commented Oct 26, 2026 •

Copy link
Copy Markdown
Member

Prerequisites

  • I have written a descriptive pull-request title
  • I have verified that there are no overlapping pull-requests open
  • I have verified that I am following matches the existing coding patterns and practice as demonstrated in the repository. These follow strict Stylecop rules 👮.
  • I have provided test coverage for my change (where applicable)

Description

This PR back-ports the changes of #428 to release/3.1.x. It corrects three faults in DrawingCanvas. It also changes how the WebGPU backend sets the size of its scratch buffers, and it corrects faults in aliased fills on the two backends.

Calls inside a layer

A Flush, RenderScene, CreateScene or CopyPixelsFrom call between SaveLayer and Restore broke the layer:

  • The WebGPU backend threw an exception.
  • The CPU backend drew the later content outside the layer.
  • A layer with an Apply call lost its earlier content.

Now these calls keep the layer whole on the two backends:

  • Flush does nothing while a layer is open.
  • RenderScene draws the scene into the open layer.
  • CreateScene closes the open layer at the end of the scene. Then the canvas opens the layer again.
  • CopyPixelsFrom reads the source rectangle and draws it into the open layer.

Scenes in CreateScene

CreateScene lost the scenes that RenderScene recorded before it. Now the new scene contains these scenes, in their recorded order.

Gradient repetition

With Repeat or Reflect, a position before the start point got the color of the first stop. Now the two modes repeat the gradient in the two directions. The CPU backend and the WebGPU shaders use the same rule.

WebGPU scratch buffers

The encoder calculates an upper bound for each scratch buffer. If all the bounds hold, a render submits its work and returns. It does not read back the scratch status.

A scene with ordered work, for example Apply, still reads the status. If an offscreen render overflows a buffer, the backend renders the scene again with larger buffers.

The fine stage adds pixel coverage as fixed-point values. Thus, the order of the GPU work does not change the output.

Aliased fills

Aliased fills now use one rule for a pixel centre exactly on an edge. The CPU backend and the WebGPU shaders use the same rule for all shapes, text included:

  • A centre on a sloped edge is inside the shape.
  • A centre on a vertical edge belongs to the shape left of the edge.
  • A centre on a horizontal edge belongs to the shape above the edge.

Thus, a 1 pixel pen line on whole-pixel coordinates sets one row or one column.

These faults are also corrected on the two backends:

  • A thin horizontal feature between two row centres was lost when it touched or crossed the edge of a 16-row band on the CPU, or of a tile row on WebGPU. It was also lost in a row that had no row-centre crossing.
  • A thin sloped sliver could get a hole of one pixel. The row pass and the column pass rounded each edge crossing separately, so one pass could put a centre outside the edge and the other pass could put it on the edge. Now both passes put each centre on the same side of an edge.
  • The midpoint pixel of an interval that continues past the left or right edge of a band was set.
  • The aliased start cover had the wrong sign for an edge clipped left of a band.
  • The two backends sorted crossings at the same position in different orders. Then one backend could find one interval where the other found two.
  • A thin feature across the edge of the image, a clip or a region lost its pixel, because the geometry outside the edge was dropped. Now an aliased fill also rasterizes one pixel around its interest and its clips, and WebGPU keeps the line pieces just outside the target in the edge tiles. The output inside the edge is the same as with no edge.
  • In a chunked WebGPU render, a thin feature across a chunk edge lost its pixel. Now each chunk keeps the path tiles of one tile row on each side of it.

Aliased output changes where a pixel centre is exactly on a vertical or horizontal edge. This includes aliased text.

WebGPU commits from main

This PR also contains three earlier WebGPU commits from main:

  • The fine shader composes the paint at one location. Thus, the fine pipeline compiles in less time.
  • The stroke scratch estimates use the outline geometry. Before, they used the diagonal of the bounding box.
  • The PTCL commands are smaller. An antialiased fill command uses 6 words, and before it used 9 words.
  • The scratch size for the PTCL comes from the paint command of each draw.

Other changes

  • The bounds of a LineJoin.Miter stroke now include the clipped bevel point.
  • The stroke bounds on the two backends use the outline radius of the pen.
  • An antialiased stroke on a region canvas no longer writes pixels outside the region.
  • The DrawingOptions.Transform documentation no longer says that strokes expand in local space.

The public API does not change. Some WebGPU reference images change, and the new images match the CPU reference images. The two aliased ellipse reference images change at 2 pixels. The centres of these pixels are 0.003 px outside the flattened ellipse. The region canvas reference image changes at 8 pixels outside the region.

Tests on Windows: net8.0 and net10.0 have 2843 passed, 0 failed and 9 skipped each.

compose_source evaluates the blend overlap once per call instead of inside
five switch cases. The fine pipeline compiles in 0.5 s instead of 1.7 s with
identical arithmetic per mode.

The scheduling pipelines compile in parallel when the device is probed. The
fine pipeline compiles once per target format, started when the target is
created, instead of four fixed variants started at the first render.

Stroke scratch estimates are bounded from the outline geometry (offset edges,
caps, joins) instead of the bounding-box diagonal. The PTCL seed is a
per-crossing bound plus one chunk per target tile.

(cherry picked from commit 8dd5241)
CMD_FILL and CMD_SOLID reference their raster interest rectangle by its
info-stream offset instead of copying four words into every tile. CMD_COLOR
references the packed colour in the scene stream and the draw flags in the
info stream. Fill goes from 9 words to 6, solid from 5 to 2, colour from 4
to 3. The PTCL seed bound drops from 14 to 11 words per crossing.

The fine shader stores each paint command's per-pixel colour and coverage
and composes them at one site after the command switch. One compose site
keeps the blend-mode switch from being inlined into every paint case, which
cuts the cold fine compile from 1.8 s to 1.1 s.

(cherry picked from commit 1536258)
The encoder accumulates a PTCL word bound per draw: one CMD_FILL (6 words)
plus the paint command coarse writes for that draw tag, times the draw's
tile-crossing bound. The bound flows through partitions, checkpoints,
ranges, and the scene, and replaces the fixed 11 words per crossing in the
scratch seed. A solid-colour scene now seeds 9 words per crossing.

(cherry picked from commit 620eae3)
Gradient brushes with Repeat and Reflect now repeat before the start point. Repeat subtracts the floor of the position, and Reflect uses the magnitude of the position. The WebGPU shaders use the same rules.

Flush, RenderScene, CreateScene and CopyPixelsFrom inside an open layer keep the layer whole. A retained scene renders inside a layer on both backends. The WebGPU encoder reads it in place through a scene segment table. CopyPixelsFrom inside a layer reads the source rectangle with ReadRegion and draws the image into the layer with Src.

The WebGPU encoder computes upper bounds for the scratch buffers, with row bounds for tile-row chunks and blend depth regions for the blend spill. fine adds the coverage of each pixel in fixed point, so the output does not depend on the GPU scheduling order, and it equals the CPU output.

An offscreen WebGPU render checks its scratch status before it returns, and it renders again with larger buffers after an overflow. The deferred corrective re-render is removed, so a scene releases its resources when it is disposed. After an overflow, fine writes the backdrop, so a deferred presentation frame keeps the previous pixels.

Each backend finds the retained scenes with ordered work through DrawingCommandBatch.FindOrderedScenes. The public API does not change.

Tests cover each seal inside a layer on both backends, the gradient repetition, the scratch bounds, and a 100k-line offscreen render that overflows and chunks. The WebGPU reference images that held the old output are updated: the new WebGPU output equals the CPU output.
A plain WebGPU render now submits its work and returns. It reads no scratch status when every capacity is an upper bound of the GPU use. Ordered ranges, a binning bound above the binding limit, and chunked scenes without row bounds still read the status. At 100k lines the flush call takes about 45 ms against 97 ms on the baseline, and the time per frame is the same.

The bounds are now true upper bounds:
- The row bounds keep one entry for each tile row, so a chunk shorter than one bin gets the bound of its own rows.
- The stroke style flags hold the CPU arc count, and the shader limits each round arc to it.
- A long inner join adds its own crossing bound, and the inner miter uses the shader limit.
- The PTCL bound comes from the chunk allocation in coarse.
- Each clip estimate grows by one pixel on each side.
- The outline radius of a Miter join is sqrt(m^2 + 1) half widths, which is the clipped bevel point of both strokers.
- path_count makes the y clip exact, so each line adds at most its tile count and the row index stays in the bbox.

A test renders 100k lines in chunks shorter than one bin and compares them with an unchunked render. The layer tests compare their pixels with the CPU backend.
…tation

The documentation said that the pen expands in local geometry space and that the outline is transformed after. Both backends stroke the transformed path in device space, with the pen width multiplied by the square root of the absolute determinant of the transform. The documentation now describes this behavior.
The documentation gives only the observable contract of the property: the transform that applies to vector output before rasterization.
@JimBobSquarePants JimBobSquarePants added the bug Something isn't working label Oct 27, 2026
The CopyPixelsFromSelf case composites green 128 at 50% over white. The exact green value is 191.5, which is a rounding tie. The WebGPU backend on macOS gives 191, and the reference image has 192. The difference is 0.0184% in 96 pixels.

The reference comparison of this case now uses 0.0185%, which is the measured difference plus one unit. The other cases keep 0.0003%.
@codecov

codecov Bot commented Oct 27, 2026 •

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 90.86069% with 103 lines in your changes missing coverage. Please review.
✅ Project coverage is 80%. Comparing base (1af9bb3) to head (3847cfc).

Files with missing lines Patch % Lines
.../ImageSharp.Drawing.WebGPU/WebGPUDrawingBackend.cs 61% 18 Missing and 3 partials ⚠️
.../ImageSharp.Drawing.WebGPU/WebGPUSceneResources.cs 85% 13 Missing and 8 partials ⚠️
...Drawing/Processing/DrawingCanvasBatcher{TPixel}.cs 88% 8 Missing and 9 partials ⚠️
...p.Drawing/Processing/Backends/DefaultRasterizer.cs 94% 4 Missing and 5 partials ⚠️
...ageSharp.Drawing/Processing/Backends/FlushScene.cs 89% 3 Missing and 4 partials ⚠️
...arp.Drawing/Processing/Backends/IDrawingBackend.cs 61% 5 Missing and 2 partials ⚠️
...arp.Drawing.WebGPU/WebGPUDrawingBackend.Ordered.cs 93% 3 Missing ⚠️
...eSharp.Drawing.WebGPU/WebGPUDrawingBackendScene.cs 80% 1 Missing and 2 partials ⚠️
...rocessing/Backends/DefaultRasterizer.Linearizer.cs 76% 0 Missing and 3 partials ⚠️
...Drawing/Processing/Backends/DrawingCommandBatch.cs 94% 2 Missing and 1 partial ⚠️
... and 7 more
Additional details and impacted files
@@               Coverage Diff               @@
##           release/3.1.x    #429     +/-   ##
===============================================
  Coverage             80%     80%             
===============================================
  Files                232     235      +3     
  Lines              27413   29658   +2245     
  Branches            3126    3411    +285     
===============================================
+ Hits               21945   24005   +2060     
- Misses              4578    4697    +119     
- Partials             890     956     +66     
Flag Coverage Δ
unittests 80% <90%> (+<1%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

Aliased rasterization on the CPU and WebGPU backends:

- A pixel centre exactly on a vertical edge belongs to the shape left of
  the edge. A centre exactly on a horizontal edge belongs to the shape
  above the edge. A centre on a sloped edge stays covered. A 1 pixel pen
  line on whole-pixel coordinates now sets one row or one column.
- Correct the sign of the aliased start cover for edges that are clipped
  left of the band.
- Find thin horizontal features between two row centres also in a row
  that has no row-centre crossing.
- Do not light the midpoint pixel of an interval that continues outside
  the left or right edge of the band.
- CPU: keep a horizontal edge that lies on the bottom of the interest,
  and treat a vertical edge exactly on the left of the interest as a
  line, as for contained geometry.
- WebGPU: give the row walk the crossing of a vertical edge on a tile
  edge, and keep a vertical line on the left edge of the path bbox as a
  halo-only segment. Keep the real end of a vertical segment that is
  stretched along the tile's left edge, so the row walks of the tile
  and of the tile on its left do not read crossings below that end.
  Compare y_edge in rounded 24.8.
- Inflate stroke bounds by Pen.GetOutlineRadius on both backends.
- Remove the clipped-left path flag from the WebGPU pipeline.
A thin horizontal feature that touches or crosses the edge of a 16-row
band on the CPU, or of a tile row on WebGPU, was not set. The column
pass of each band started from a zero winding and saw only the
crossings inside the band.

- Each column walk now starts from the winding just above the centre of
  the first row, and walks down and up from there. An edge exactly
  through the column centre on that row counts only when the start
  point is right of it.
- The walk reads the column crossings within half a pixel above and
  below the band or tile. The CPU replays the lines of the neighbouring
  bands. An aliased WebGPU fill command holds the path tiles above and
  below, and a horizontal line exactly on a tile row boundary is kept
  as a halo-only segment.
- Each band or tile sets only the midpoints in its own rows.
- Both backends keep 16 crossings for each column and skip a column
  that has more.
- Both backends sort coincident row crossings with the same key:
  vertical edge, then downward direction, then profile. Before, the
  direction bit had opposite meanings on the two backends, so two
  crossings at one position could form one interval on the CPU and two
  on WebGPU.
The row pass and the column pass test each pixel centre against the
same edge, from two separate interpolations in 24.8 fixed point. Both
used truncating division. One pass could put a centre outside the edge
while the other put the edge exactly on the centre. Then neither pass
set the pixel, and a thin sloped sliver got a one pixel hole. The CPU
and WebGPU both had this fault.

- Both backends now round each crossing down, and move an inexact
  value that lands on a pixel centre up by one unit. Only an exact hit
  then equals a centre, so the two passes always put a centre on the
  same side of an edge.
- Two pixels of the aliased ellipse reference images change. Their
  centres are 0.003 px outside the flattened ellipse.
WebGPU renders a large scene in tile-row chunks when a tile buffer is
larger than the binding limit. The aliased column walk reads the path
tiles above and below a tile to find thin features within half a pixel
of a tile row boundary. In a chunk those tiles did not exist at the
first and last chunk rows, so a thin feature across a chunk edge lost
its pixel.

- path_row_alloc keeps one tile row on each side of the chunk. Coarse
  writes commands for the chunk rows only, and it allocates the
  segments of a tile outside the chunk for the fill tile next to it.
- Fine skips a neighbouring tile that has no segment allocation, for
  example a tile where coarse skipped the draw inside a clip.
- The path rows, tiles and segments of a chunk are sized for the chunk
  rows and the two extra rows, and they scale back to the scene budget
  with the same rows, so the budget does not grow from flush to flush.
An aliased fill sets the midpoint pixel of a thin feature between two
pixel centres. When such a feature crossed the edge of the image, a
clip or a region, both backends dropped the geometry outside the edge,
so the pixel inside was lost. The output inside the edge must equal the
output with no edge.

- CPU: an aliased item rasterizes one more pixel on each side of its
  interest. The first row band can then be band -1. The band info
  carries the interest, and the coverage row handler clips every span
  to it. This also stops an antialiased stroke on a region canvas from
  writing outside the region, so one reference image changes.
- WebGPU: binning keeps one more pixel around the interest and the
  clips of an aliased fill. Where a path touches a target edge,
  path_count and path_tiling also walk the tile row or column just
  outside it, and store those pieces in the edge tile as halo-only
  segments. Fine reads their real crossing positions. The encoder
  bounds count the extra pixel and the edge row.
- path_row_alloc gives a draw with no tile rows or columns an empty
  bbox, and path_count writes a record that path_tiling skips for every
  reserved crossing slot that no tile keeps.
FillPath_AliasedThinBarsAcrossChunkEdges_MatchUnchunkedRender uses the
100k-line scene of FillManyLines_ChunksSmallerThanOneBin_MatchUnchunkedRender,
which draws the lines antialiased. It drew them aliased, and on the
macOS CI runners that render did not finish within the 5 second readback
timeout. The lines are now antialiased, and only the bars across the
chunk edges are aliased. The test still fails without the chunk halo
fix.
@JimBobSquarePants
JimBobSquarePants merged commit a631c96 into release/3.1.x Oct 28, 2026
12 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant