Skip to content

Feature(v3) refactored zIndexing #669

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
wouterlucas merged 44 commits into from
Jan 9, 2026
Merged

Feature(v3) refactored zIndexing #669

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
44 commits
Select commit Hold shift + click to select a range
945a64f
initial check in
jfboeve Nov 11, 2025
eff689f
changed UpdateType enum
jfboeve Nov 19, 2025
05d36ba
optimized zindex sorting
jfboeve Nov 20, 2025
a5ce760
revert get id back to previous setup
jfboeve Nov 20, 2025
5ae5dd7
revert radius settings in test
jfboeve Nov 21, 2025
1de7fe6
improved sorting by zIndex
jfboeve Nov 24, 2025
76f78d7
fixed bucket sorting, introduced max zIndex 1000, min zIndex -1000
jfboeve Nov 25, 2025
3bdab93
improved incremental check, pruned updateType when changing parents.
jfboeve Dec 16, 2025
1cd6805
fixed / improved incrementalRepositionByZindex
jfboeve Dec 16, 2025
5b51c7c
optimized text alignment calculations
jfboeve Nov 3, 2025
8a90c9a
ceil width/height sdf
jfboeve Nov 3, 2025
a26f1c1
fix wordbreak; breakall
jfboeve Nov 3, 2025
00b393b
fixed w/h precision of rendered text, fixed CI screenshotting for canvas
jfboeve Nov 10, 2025
bb53b19
update dynamically when text content changes
il-sairamg Nov 14, 2025
cf74e5b
keep text hidden without breaking visibility checks
il-sairamg Nov 17, 2025
3591cc9
3.0.0-beta16
jfboeve Nov 17, 2025
6c36093
feat: add renderable event to CoreNode
wouterlucas Dec 11, 2025
da93dc6
Create canvas w/ platform
estobbart Dec 22, 2025
f33c627
fixed maxWidth, maxHeight, contain
jfboeve Dec 9, 2025
5ba6a36
fixed truncation issues, fixed text engine tests
jfboeve Dec 12, 2025
275908a
fixed tests, added CoreTextNode set w/h blockers
jfboeve Dec 15, 2025
732e300
fix maxHeight, if calcs to 0 ensure 1 line.
jfboeve Dec 15, 2025
57225fd
update vrt screenshots
jfboeve Dec 15, 2025
389d16f
Move FontFaceSet into Platform layer
estobbart Dec 22, 2025
4f439f5
3.0.0-beta17
jfboeve Dec 29, 2025
2c87200
fix initial node
jfboeve Dec 29, 2025
1aebdf3
fixed issue where w/h are multiplied by half
jfboeve Dec 29, 2025
ad20a49
fixed gradient when using special texture, added test
jfboeve Dec 30, 2025
7229bba
revert resize mode vrt's
jfboeve Dec 30, 2025
4092438
changed radial gradient from total width/height to radial width/heigh…
jfboeve Dec 30, 2025
8110d31
CanvasTextRenderer to use settings dpr
estobbart Dec 29, 2025
d5481fa
feedback
estobbart Dec 29, 2025
b306fda
3.0.0-beta18
jfboeve Dec 31, 2025
7f3efe6
support for undefined target
estobbart Jan 5, 2026
2590868
added improved texture compression, refactored texturecoord flow
jfboeve Jan 5, 2026
5575ff0
microqueue text loaded emit
jfboeve Jan 6, 2026
3ae31bd
fix rounding to be smoother on retina devices and smooth correctly fr…
chiefcll Jan 5, 2026
541b094
add another test for circles of different sizes
chiefcll Jan 6, 2026
9a7f4c5
(v3) Texture Management / GC
jfboeve Jan 7, 2026
9ca83e4
resolving texture props fixed. avoid infinite retries
jfboeve Jan 7, 2026
9b790d4
subtexture retry count now properly updates
jfboeve Jan 7, 2026
f548651
optimize the update loop
chiefcll Jan 7, 2026
da9c8c3
update new vrt result
chiefcll Jan 7, 2026
edaa379
Merge branch 'main' into feat/refactor-zindexing
jfboeve Jan 9, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 13 additions & 29 deletions examples/tests/zIndex.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
//@ts-ignore
color: Colors[color],
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
zIndex: 10 + (i + 1),
Expand All @@ -81,12 +81,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 600,
h: 600,
color: Colors.Gray,
// shader: renderer.createShader('RoundedRectangle', {
// shader: renderer.createShader('Rounded', {
// radius: 40,
// }),
zIndex: 2,
parent: testRoot,
zIndexLocked: 1,
});

const childRectWhite = renderer.createNode({
Expand All @@ -95,7 +94,7 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 200,
h: 200,
color: Colors.White,
// shader: renderer.createShader('RoundedRectangle', {
// shader: renderer.createShader('Rounded', {
// radius: 40,
// }),
zIndex: 4,
Expand All @@ -108,7 +107,7 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 200,
h: 200,
color: Colors.Red,
// shader: renderer.createShader('RoundedRectangle', {
// shader: renderer.createShader('Rounded', {
// radius: 40,
// }),
zIndex: 5,
Expand Down Expand Up @@ -136,7 +135,7 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 400,
h: 100,
color: Colors.Green,
// shader: renderer.createShader('RoundedRectangle', {
// shader: renderer.createShader('Rounded', {
// radius: 40,
// }),
zIndex: 2,
Expand Down Expand Up @@ -164,13 +163,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),

zIndex: 148901482921849101841290481,

zIndexLocked: 148901482921849101841290481,
parent: testRoot,
});

Expand All @@ -180,13 +177,12 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),

zIndex: -148901482921849101841290481,

zIndexLocked: -148901482921849101841290481,
parent: testRoot,
});

Expand All @@ -196,13 +192,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
// @ts-expect-error Invalid prop test
zIndex: 'boop',
// @ts-expect-error Invalid prop test
zIndexLocked: 'boop',
parent: testRoot,
});

Expand All @@ -212,13 +206,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
// @ts-expect-error Invalid prop test
zIndex: true,
// @ts-expect-error Invalid prop test
zIndexLocked: true,
parent: testRoot,
});

Expand All @@ -228,13 +220,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
// @ts-expect-error Invalid prop test
zIndex: null,
// @ts-expect-error Invalid prop test
zIndexLocked: null,
parent: testRoot,
});

Expand All @@ -244,11 +234,10 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
zIndex: undefined,
zIndexLocked: undefined,
parent: testRoot,
});

Expand All @@ -258,15 +247,12 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
// @ts-expect-error Invalid prop test

zIndex: () => {},
// @ts-expect-error Invalid prop test

zIndexLocked: () => {},
parent: testRoot,
});

Expand All @@ -276,13 +262,11 @@ export default async function test({ renderer, testRoot }: ExampleSettings) {
w: 10,
h: 10,
color: 0x00ffffff,
shader: renderer.createShader('RoundedRectangle', {
shader: renderer.createShader('Rounded', {
radius: 2,
}),
// @ts-expect-error Invalid prop test
zIndex: {},
// @ts-expect-error Invalid prop test
zIndexLocked: {},
parent: testRoot,
});
}
1 change: 0 additions & 1 deletion src/core/CoreNode.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,6 @@ describe('set color()', () => {
x: 0,
y: 0,
zIndex: 0,
zIndexLocked: 0,
};

const clippingRect = {
Expand Down
Loading