Evolution of Processing/JavaScript Hybrids

  1. A simple case study: Translation
  2. Pure Processing (.pde)
  3. Processing "compiled" to JavaScript (.js)
  4. Processing mixed with JavaScript (.pjs)
  5. Processing.js using external .pde files
  6. Processing.js using inline Processing code
  7. Processing.js sketch rewritten in pure JavaScript, using Processing.js as API
  8. Controlling a sketch from user interaction with HTML/JavaScript
  9. Processing.js mixed with JavaScript libraries: jQuery
  10. Fine control over sketch startup and initialization using jQuery
  11. Dynamic sketch creation using JavaScript, multiple sketches
  12. Sharing data between JavaScript and Processing
  13. Accessing data, functions within the sketch
  14. Access and alter data in a sketch from the DOM/JavaScript