Browsers allow websites to store data on the visitor’s device. This is called local storage. The getItem(), storeItem(), clearStorage(), and removeItem() functions control it.
This example is inspired by Daniel Shiffman’s Loading JSON Data and Loading Tabular Data examples for Processing written in Java. It uses a class to organize data for a bubble. The visitor can add new bubbles, and their data will be saved in local storage. If the visitor revisits the sketch, it will reload the same bubbles.
Local Storage by p5.js Contributors and the Processing Foundation is licensed under CC BY-NC-SA 4.0.
Related Examples

Black outlines of circles on a white background. Text below the circles reads "Click and drag to add bubbles."
Local Storage
Save data from the browser on the device.

Black outlines of circles on a white background. Text below the circles reads "Click and drag to add bubbles."
JSON
Store data in JavaScript object notation.

Black outlines of circles on a white background. Text below the circles reads "Click and drag to add bubbles."
Table
Store data as comma-separated values.