a port of the Processing Visualization Language

Processing.js v1.2 Released

31 May 2011

The Processing.js team is pleased to announce the release of Processing.js version 1.2. This is one of our largest releases to date, and focuses on performance, compatibility, 3D, and bug fixes. More people than ever are using Processing.js, from professional design houses to video game developers to fashion designers, and as the demand and uses continue to grow, we are excited to be able to bring you an even better Processing.js.

Since our last release, exciting things have been happening in browser development. WebGL, the 3D extension of the HTML5 canvas element, has now shipped in Firefox and Chrome, and is being tested in nightly builds of Safari and Opera. Processing.js has been fully WebGL compatible for more than a year, and version 1.2 includes some great 3D performance and bug fixes. We've also written a guide to help explain how Processing.js uses canvas and WebGL to support the various Processing render modes. Processing.js is a great way to get started with 2D and 3D graphics on the web, without having to understand all of the underlying technologies. With several guides for people new to Processing, JavaScript developers and Processing developers, there has never been a better time to jump in!

This release also includes some important changes to ensure better compatibility with Processing 1.5. First, we've altered our default frame rate to match Processing's (i.e., 60 fps). Developers who are upgrading from previous versions of Processing.js, and who don't explicitly set a frame rate, may notice that sketches seem to run more slowly. Don't worry, Processing.js is faster than ever! Your sketch is just drawing at 60fps. It's possible to make things as fast as the browsers will allow by setting a higher frame rate, but this will of course consume more CPU, and actually not provide any real gain other than bigger deltas between visible frames.

We had many requests from our users to follow Processing's lead and add support for Java Generics, and we're happy to report that as of Processing 1.2 this is fully supported! We've also improved our compatibility in key classes and functions like ArrayList and XMLElement, and arc() and beginShape(), etc. If you find that your Processing code isn't compatible with Processing.js, please make sure you tell us.

While we've been developing 1.2, we've seen some great examples of Processing.js in the wild. Here are some of our favorites:

One of the things we love most is seeing all the creative and unexpected ways that people use Processing.js. If you have a cool example, let us know about it, and we might showcase it on the site and in our blog posts.

Finally, we want to take this release as an opportunity to acknowledge one of our team members who will be leaving us. Anna Sobiepanek has been a full-time developer and researcher at Seneca's Centre for Development of Open Technology (CDOT) for more than a year. She's helped develop and lead the Processing.js project, and been our main git master (Anna's github graph is often used as an example of a complex git project). Anna's been a passionate contributor and great leader in the Processing.js project, and we'll miss her daily work with us. Lots of people bemoan the lack of women in open source, and we've been blessed to have such a great developer and amazing woman working on our team. We wish her well in her new job, and look forward to her continued contributions as a volunteer.

We hope you enjoy using Processing.js 1.2. We enjoyed making it for you, and are already working on 1.3!


  • Aligned default frameRate to match Processing (e.g., 60fps). NOTE: if your sketch seems slower than before, frameRate(1000) will yield the old behavior.
  • Added Performance Tests
  • Added lazy loading sketch extension
  • Added XMLElement toString() function
  • Added loadShape() testing
  • Added support for Java Generics
  • Added ArrayList addAll()
  • Fixed stroke being applied in endShape()
  • Fixed the key variable to hold the proper data type
  • Fixed string functions split(), contains()
  • Fixed background() when called with image different size from sketch
  • Fixed IE9 loading issues
  • Fixed mouseX/mouseY to be computed with canvas scaling taken into account
  • Fixed text string's height to not ignore textLeading()
  • Fixed copy() to handle transparency
  • Fixed ellipse 3D to take noStroke and noFill values into account
  • Fixed regression in specular() defaults to be same as 1.1.0
  • Fixed screenX()
  • Fixed arc() 3D fill
  • Fixed endShape(CLOSE) so the shape doesn't disappear
  • Fix for 3D PGraphics always drawing below 2D shapes
  • Fixed noStroke() on P3D endShape()
  • Fixed 3D ref tests
  • Fixed rect() for 3D when used with lights
  • Fixed param()
  • Fixed leak of global typed array variables
  • Fixed rendering of println() so it's more usable
  • Fixed Scaling/Light problem in 3D
  • Fixed reverseTransform()
  • Fixed line(x,y,x,y) so that it draws a point
  • Fixed Processing constructor to take a single argument
  • Fixed Iterator for Map's EntrySet to iterate through the entire set
  • Fixed dir vector transforms in directionalLight() and spotLight()
  • Fixed arrayList remove() to take an object argument
  • Fixed light/shadowing failures in ref tests for 3D
  • Fixed strokeWeight to not get reset in draw()
  • Fixed image cache to set loaded property for images inserted from js
  • Fixed parser bug with negative values
  • Fixed parser bug with static variables
  • Fixed textWidth to work with newlines
  • Fixed beginShape() and endShape() to work with bezierVertex()
  • Fixed arc() when covering 0 radians
  • Fixed unit tests that caused UTF-8 errors in newer JSSHELL
  • Fixed linting errors
  • Fixed arc() regressions
  • Fixed XML API to be Processing 1.5 compatible
  • Fixed subset(array, offset) bug
  • Converted all XMLElement tests to unit tests
  • Converted endShape() ref tests to be part of the regular 2D/3D ref tests
  • Documented rotate() to explain direction
  • Documentation fixes and corrections on website
  • Improved minification
  • Improved the performance of arc()
  • Improved the performance of blur()
  • Improve the performance of blend()'s ADD mode
  • Implemented ArrayList indexOf()
  • Improve the performance and output of ref tests
  • Improved compatibility of WebGL context creation
  • Moved colors object out of Processing instances to save memory
  • Reduced calls to uniformMatrix()
  • Removed test/unit/braces.js
  • Removed clear()
  • Removed transform matrix calculations if there are no lights
  • Removed dependency on init.js, and init.js from examples
  • Removed all uses of use3DContext from compiled sketches
  • Rewrote build system, switched to closure
  • Removed Bespin IDE
  • Removed unused tools and minifiers
  • Removed uses of constructor.name
  • Renamed internal uses of int(), boolean(), etc. to parseInt(), parseBoolean(), etc
  • Add known failures to ref tests
  • Convert test-suite tests to REF tests
  • Fixed inheritance for certain (js object) methods still broken (1.1)
  • Fixed more extra semi-colon breaking
  • Fixed createImage for RGB format produces image with transparent background
  • Removed String.prototype.match and .replace in IE9
  • Removed static beginCamera/endCamera examples from repo
  • Re-factor 3D and 2D drawing functions into separate objects
Fork me on GitHub