Global Mode vs Instance Mode: Balancing Namespace Safety and Boilerplate in p5.js

Decision Context

When building a medium‑size interactive visualization that will share a page with other scripts and may rely on external add‑ons that expect p5 globals, the developer must choose between p5.js’s global mode and instance mode.

Global mode offers direct access to functions like createCanvas and loadImage without wrapping, but it places those identifiers on window, risking collisions with other libraries or multiple sketches.

Instance mode keeps the p5 namespace clean by passing a p5 instance to the sketch function, yet it requires every p5 call to be prefixed with that instance and can make DOM manipulation from outside the sketch more verbose.

Given the need to limit global pollution while still allowing external code to interact with the sketch and use libraries that assume globals, which approach better satisfies these competing constraints?

• How does each mode affect the likelihood of variable name clashes when multiple sketches or third‑party scripts are present?
• What patterns exist for exposing necessary p5 functions to external libraries in instance mode without rewriting large portions of the sketch?
• Can a hybrid strategy—such as selectively binding globals after instance creation—provide the encapsulation of instance mode with the convenience of global mode for specific add‑ons?