Processing.js: more than a free canvas drawing and animation language

by Maarten

The Processing language is “an open source programming language and environment for people who want to program images, animation, and interactions”. It has now been ported into JavaScript, as processing.js. Processing.js scripts are linked to <canvas> tags. By using the methods for drawing shapes and controlling animation, drawing graphics in webpages becomes remarkably easy! Responding to keyboard or mouse events is made simple as can be too, reducing this to implementing the correct methods.

Processing.js represents a new scripting language that can be used in the browser. It uses a Java-like syntax and even supports the use of classes with inheritance and encapsulation. This makes processing.js easier to learn than JavaScript itself. But of course, since it isn’t JavaScript, it cannot be used for general scripting in the browser; Ajax calls or manipulating the DOM tree aren’t possible for example. And I haven’t seen anything about a Processing to JavaScript interface either.

I’ve tried out the language in a simple program and it really makes drawing shapes and animations child’s play – or at least for the child of a Java programmer. It’s a shame utilizing classes with encapsulation and inheritance seems to give errors at some points, making the development of big projects a rather difficult at the moment. But still, be sure to check the project out!