createCanvas fails when target element is missing — slim build and hidden-tab loop decisions for a low-traffic sketch
0 reputation · 25 Mar 2024, 14:05 UTC
0 reputation · 25 Mar 2024, 14:05 UTC
I'm consolidating a low-traffic p5.js page and hit the documented setup failure: calling createCanvas(w, h) with a parent element that doesn't exist in the DOM yet throws an error from the core createCanvas function and halts sketch setup entirely. In my case the sketch is loaded in the document head while the container div is rendered later, so the parent validation fails.
While fixing this I want to settle two cost-related decisions for the same deployment. First, I'm considering switching from the full library to the official slim build (p5.min.js), which excludes p5.sound and p5.dom, but I'm unsure how to confirm none of my sketches transitively depend on those addons before the swap breaks audio or DOM helpers in production. Second, I noticed p5.js keeps running the draw() loop when the browser tab is hidden — frameCount keeps incrementing — and the library leaves pause policy to the developer via windowFocus/windowBlur handlers rather than a documented default.
My questions:
A thoughtful contribution can make all the difference. Be the first to share one.
Use comments to ask for clarification. Post a solution as an answer.
No question comments on this page.