What Common Scripting Language Is P5 JS Based On?


Heather Bennett

What Common Scripting Language Is P5 JS Based On?

P5.js is a popular JavaScript library that allows you to create interactive graphics and animations in the browser. It is based on another well-known scripting language called Processing. In this article, we will explore the relationship between P5.js and Processing, and understand how they are connected.

Processing – A Brief Overview

Processing is an open-source visual arts programming language and integrated development environment (IDE). It was created by Casey Reas and Benjamin Fry in 2001 as a tool for artists, designers, and educators to learn computer programming.

Processing simplifies the process of creating interactive visualizations, animations, and games by providing a user-friendly syntax and powerful drawing capabilities. It abstracts many low-level details of programming to enable users to focus on creative expression.

P5.js – The JavaScript Version of Processing

P5.js was developed by Lauren McCarthy as a JavaScript port of the original Processing language. It aims to bring the simplicity and accessibility of Processing to web developers, allowing them to create interactive graphics directly in the browser.

P5.js retains much of the core functionality of Processing while leveraging the power of JavaScript. This makes it easy for developers familiar with Processing to transition into web development without having to learn an entirely new language.

The Similarities Between P5.js and Processing

  • Syntax: P5.js borrows its syntax from Processing, which means that if you are familiar with one, you can easily understand the other.
  • Drawing Functions: Both P5.js and Processing provide a set of simple yet powerful drawing functions that allow you to create shapes, lines, colors, and images on the canvas.
  • Mathematical Operations: P5.js and Processing offer a wide range of mathematical functions that enable you to perform complex calculations and transformations.

The Differences Between P5.js and Processing

  • Environment: P5.js runs in the browser, while Processing requires the installation of a separate IDE. This allows P5.js to take advantage of web technologies such as HTML, CSS, and JavaScript.
  • Interactivity: With P5.js, you can easily respond to user input events like mouse clicks and keyboard presses. This makes it ideal for creating interactive web applications.
  • Web Integration: P5.js seamlessly integrates with other web technologies, allowing you to combine graphics with HTML elements, CSS styling, and even interact with APIs.


In summary, P5.js is based on the popular scripting language called Processing. It brings the simplicity of Processing to JavaScript developers by providing a familiar syntax and powerful drawing capabilities.

With P5.js, you can create interactive graphics directly in the browser and take advantage of web technologies to enhance your projects. Whether you are a beginner or an experienced developer, exploring P5.js can open up new possibilities for creative expression on the web.

Discord Server - Web Server - Private Server - DNS Server - Object-Oriented Programming - Scripting - Data Types - Data Structures

Privacy Policy