What is p5.js?

p5.js is a JavaScript library for creative coding. It is based on processing and is a creative coding environment. It was originally developed by Ben Fry and Casey Reas. The main focus of processing is to make it as easy as possible for beginners to learn how to write interactive, graphical applications, making programming languages ​​more user-friendly through visualization.

The advantage of using the JavaScript programming language is its wide availability and ubiquitous support: every web browser has a built-in JavaScript interpreter, which means that the p5.js program can be used in any web browser run.

In addition, Processing is a language that emphasizes the feasibility of programmers to quickly create software prototypes to try out a new idea or to see if something works. For this reason, Processing (and p5.js) programs are often called "sketches".

The official documentation of p5.js recommends using Bracket or Sublime, then including JavaScript files, and finally leads us to work like any other programming language. But the online p5.js web editor is the best choice. It is a web-based programming environment.

What is the difference between p5.js and JavaScript?

JavaScript is a core language that provides all the features to build any functionality in the browser. It can use loops, functions, conditions, DOM operations, events, canvas, etc. Therefore, any framework can be developed and designed by using it.

p5.js is a JavaScript library. p5.js runs on pure JavaScript and provides some functions that allow JavaScript users to easily draw on the web.

Example:

function setup() { 
  createCanvas(400, 400); //画布大小400*400 
} 
  
function draw() { 
  background('blue'); //背景颜色蓝色 
}

Output:

setup(): It is the statement in the setup() function. It is executed once at the beginning of the program. createCanvas must be the first statement.

draw(): The statements in draw() will be executed until the program stops. Each statement is executed sequentially, and after the last line is read, the first line is executed again.

p5.js official website: https://p5js.org/

The above is the detailed content of What is p5.js?. For more information, please follow other related articles on the PHP Chinese website!