Skip to content

fix: prevent browser freeze when tessellating >50k vertices (dev-2.0)#8729

Open
Nixxx19 wants to merge 2 commits intoprocessing:dev-2.0from
Nixxx19:nityam/tessellation-freeze-fix-2.x
Open

fix: prevent browser freeze when tessellating >50k vertices (dev-2.0)#8729
Nixxx19 wants to merge 2 commits intoprocessing:dev-2.0from
Nixxx19:nityam/tessellation-freeze-fix-2.x

Conversation

@Nixxx19
Copy link
Copy Markdown
Contributor

@Nixxx19 Nixxx19 commented Apr 17, 2026

Resolves #8219 for the dev-2.0 branch

This is the dev-2.0 port of #8555.

Summary

  • Adds a one-time confirmation prompt before tessellating very large PATH-mode shapes (>50,000 vertices) to avoid browser freezes in libtess.
  • Cancel: skips tessellation and draws nothing for that shape.
  • OK: remembers the choice for the lifetime of the renderer via _largeTessellationAcknowledged and tessellates normally without prompting again.
  • Respects p5.disableFriendlyErrors: when disabled, tessellation always runs with no prompt.

Tests

Added unit tests in test/unit/webgl/p5.RendererGL.js under the beginShape() in WEBGL mode suite, written in vitest syntax (vi.spyOn / mockImplementation). All 4 tests pass locally.

@Nixxx19
Copy link
Copy Markdown
Contributor Author

Nixxx19 commented Apr 17, 2026

Screenshot 2026-04-17 at 3 57 22 PM

@p5-bot
Copy link
Copy Markdown

p5-bot bot commented Apr 20, 2026

Continuous Release

CDN link

Published Packages

Commit hash: 746e46c

Previous deployments

This is an automated message.

Comment thread src/webgl/ShapeBuilder.js
const MAX_SAFE_TESSELLATION_VERTICES = 50000;

if (vertexCount > MAX_SAFE_TESSELLATION_VERTICES) {
const p5Class = this.renderer._pInst.constructor;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah yes this is one of the currently kinda awkward bits of 2.x now that we've split core functionality into addons: there is not always a global p5. The way we're currently dealing with this is with a sort of "dependency injection" pattern of sorts, where we make a function on the current class, like in this case maybe friendlyErrorsDisabled() { return false; }, and then in an addon file inside of function myAddon(p5, fn, lifecycles) { ... }, we override that function with a real implementation. Take a look in this PR at how we've given p5.Image access to p5.friendlyError: https://github.com/processing/p5.js/pull/8676/changes#diff-fdf1c89a0511ed981f59e9539de1ff707da1e75c7b21f35184406cacb5781672

Let's maybe try to follow a similar pattern here where we override ShapeBuilder.friendlyErrorsDisabled (or whatever we choose to call it) from within the addon function that adds the WebGL renderer to p5?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants