User:Neoksaal/Tutorials/p5js

Element

• Element
• Media Element

preload() setup() draw()

• preload()

A function that's called once to load assets before the sketch runs.
Declaring the function preload() sets a code block to run once automatically before setup() or draw(). It's used to load assets including multimedia files, fonts, data, and 3D models:

↳ 외부리소스를 쓸때 적절

• setup()

A function that's called once when the sketch begins running.
Declaring the function setup() sets a code block to run once automatically when the sketch starts running. It's used to perform setup tasks such as creating the canvas and initializing variables
Code placed in setup() will run once before code placed in draw() begins looping. If the preload() is declared, then setup() will run immediately after preload() finishes loading assets.

• draw()

A function that's called repeatedly while the sketch runs.
Declaring the function draw() sets a code block to run repeatedly once the sketch starts. It’s used to create animations and respond to user inputs.

This is often called the "draw loop" because p5.js calls the code in draw() in a loop behind the scenes. By default, draw() tries to run 60 times per second. The actual rate depends on many factors. The drawing rate, called the "frame rate", can be controlled by calling frameRate(). The number of times draw() has run is stored in the system variable frameCount().

Code placed within draw() begins looping after setup() runs. draw() will run until the user closes the sketch. draw() can be stopped by calling the noLoop() function. draw() can be resumed by calling the loop() function.

create

• createDiv()
• createCanvas()
• noCanvas()
• saveCanvas()

frame