Desktop Support for p5.js via a New Processing Mode

This mode integrates p5.js into the Processing Development Environment (PDE) and provides a desktop runtime based on Electron.

• Run and stop p5.js sketches directly from Processing
• Electron-based embedded browser for rendering
• Error reporting in the editor
• Built-in examples (WIP)
• Syntax highlighting (Note: The current syntax highlighting system has known limitations and may change)
• Works on Linux, macOS, and Windows
• PNPM for Node package and dependency management
• Automatic installation of required tools:
  • PNPM
  • Node.js
  • Electron

• Export p5.js sketches as standalone desktop apps
• Uses electron-builder for packaging

1. Download Processing
2. Install it (see the install instructions)
3. Open the Contribution Manager in Processing and install p5.js Mode (experimental).

1. Download the latest .pdex file from the Releases page.
2. Opening the .pdex file in Processing

• The mode is implemented in Kotlin
• Mode-specific code lives in the top-level p5js directory
• Build and distribution tasks are handled with Gradle

See the wiki for architecture notes.

License information can be found in LICENCE.md.

This project was created by Stephan Max (@stephanmax) as part of the 2025 Building Bridges (pr05) Grant from the Processing Foundation. The project was mentored by Stef Tervelde (@Stefterv).

For more context, watch Stephan’s presentation at OpenAssembly 2025 and read his blog post.