Loading a Single ImageA basic example of loading an image into a p5.js 2.0 sketch using async and await in setup().
Sequential LoadingDemonstrates JSON from the Dog API and then loading an image from the JSON.
API and Loading AnimationDemonstrates loading JSON from the Dog API and then creating a loading bar while fetching multiple images.
Parallel Loading with Promise.allAn example showing how to load multiple images in parallel for better performance using Promise.all().
Loading images with placeholders exerciseA demonstration of loading images from an array of files, displaying a placeholder while each image loads.
This video covers how to load external assets like images, JSON files, and data from APIs into your p5.js 2.0 sketches. Learn the fundamentals of asynchronous operations in p5.js using Promises with async/await.
The beta website for p5.js 2.0 with updated references and examples.
MDN documentation on Promise.all for handling multiple promises in parallel.
A public API for dog images used in the examples.
How to transition from p5.js 1.0 to 2.0 with async and await.
Learn more about JavaScript Promises in depth.
Continue learning about JavaScript Promises.
- Editing
by Mathieu Blanchette
- Animations
by Jason Heglund