p5.js 2.0 Update: Beta, Timeline, and Compatibility Addons

[ksen0]

Hi!

I’m Kit, and I’ve joined the Processing Foundation recently as project lead for p5.js! I am so excited to be part of this amazing community, and to start helping bring the vision of p5.js 2.0 to completion.

In this update, I want to share our current thoughts about compatibility. (Even as p5.js 2.0 becomes more stable, p5.js 1.x will continue to be supported!)

Last year, we initiated the p5.js 2.0 RFC (Request for Comment) process to collectively re-envision the next major release of p5.js. Since then, many contributors have been working to make p5.js 2.0 happen.

• You can read more about the Governance Model and Decision-Making Process in the previous update: p5.js 2.0 Updates #7261
• You can find the beta release of 2.0 here: https://github.com/processing/p5.js/releases/tag/v2.0.0-beta.1

Now that the beta release is available, you can try testing out the beta! Please report any bugs you encounter to help improve p5.js 2.0. To try out the beta release:

• You can duplicate this web editor project: https://editor.p5js.org/davepagurek/sketches/wiOiYAp6P
• You can also add a script tag to this build that @davepagurek is hosting: <script src="https://davepagurek.com/stuff/p5/p5-2.0-b1.min.js"></script>

Even as p5.js 2.0 becomes more stable, p5.js 1.x will continue to be supported for at least a year. Here’s the timeline so far:

• We plan to have p5.js 2.0 finished by the end of March 2025.
• Up through the end of March 2026 (next year!), the p5.js Editor will still default to p5 1.x, with an option to switch to 2.0 when it is finished.

Between 1.x and 2.0, there are many additions, and some breaking changes. In addition to making p5.js 2.0 available as a library, we are working on preparing several compatibility addons that would make it possible to keep using 1.x features that are no longer part of 2.0.

• You can review the 2.0 changes in the release notes
• We’ve prepared this check-in survey about the breaking changes. This is because many users of p5.js are not active on GitHub. Please feel free to engage in the discussion here on any topic in the survey or regarding the changes - and to share the survey with p5.js users you know who might be!
• Do you have a library that depends on p5.js and you’d like to update it for compatibility with 2.0? If your library is in the directory then we are already planning to check whether the change from 1.0 to 2.0 breaks examples given by that library. Feel free to test your library out with the new release, or reach out / comment here!

What do we mean by “Compatibility addon?” If you want to use something like preload() which has been removed in 2.0, you would have to use a <script> tag to import both p5.js 2.0 and the compatibility addon for that feature. If you do that, any use of preload() just like in 1.x will continue to work. We are preparing addons for other changes, such as shape/vertex, listed here.

Thank you!

[GregStanton]

Thanks for the update @ksen0!

Question: Is there a plan for syncing the reference on p5js.org with the default version of p5.js in the web editor? For example, if the web editor defaults to 1.x until March 2026, but the reference documents version 2.0 when it's released in March 2025, then users following the reference may get unexpected errors.

I imagine there's already a plan in place for this, but in case there's not, here's an initial idea. By the time 2.0 is released, I think it will have been about nine months since the release of the new p5.js site. So, perhaps the link at the bottom of every page that reads "Looking for the old p5.js site? Find it here!" is no longer needed; it could be moved to a less prominent place on the site. In its place, there could be a link that reads "Using the new p5.js 2.0? Check out the updated site." In March 2026 when the web editor defaults to 2.x, this arrangement could potentially be flipped, with the 2.x version being the main version, and a link to the 1.x version at the bottom of every page.

In addition to alleviating confusion around the reference, this would also address conflicts relating to tutorials and examples, and to the contribute page, all of which might contain updates related to 2.0.

[ksen0]

Hi @GregStanton that's a great question!

This depends on exactly how reference is updated on the website itself. I am in the process of checking if/how it would be technically possible, but one idea would be that the URLs stay stable, and each page allows toggling between versions in a way that persists. So one possible behavior is that while the editor defaults to 1.x, and so does the site, opting in is done twice. Or, as you describe, if a user opts-in in one place, that persists in the second place (e.g., through a cookie). Depending on how a hypothetical "version toggle" might be able to work, it could be used in tutorials/examples, not only reference. If it's not possible or practical to do a "version toggle" approach, something like what you're describing makes a lot of sense.

One thing we've also been discussing is the idea of pro-actively helpful with transition from 1.x to 2.0. As I mentioned, libraries in the directory we are already planning to check whether the change from 1.x to 2.0 breaks examples given by that library, and notify those projects through an issue. It is up to the maintainers of each library whether to support 1.x, or 2.0, or both, and on what kind of timeline. I think it would be best if resources like the libraries page are also able to show which version is supported.

There are also other pieces, like the Autocomplete Hinter in the p5.js Editor, and FES, that will need to be updated to help users navigate errors related to versions. One way I'm thinking about this: if someone is starting not from the p5.js website, but from an example they found elsewhere online, and is new to p5.js, what are the possible ways that our tools can help them understand and resolve the errors?

Very happy to hear additional thoughts about all the above.