Skip to content

Archived Content

Lauren Lee McCarthy edited this page Jul 4, 2020 · 13 revisions

Research documentation

This project developed out of a Fellowship with the Processing Foundation exploring the future of Processing with JavaScript. Documentation of research in process and references is below.

Starting points

Possibilities

  • what would be gained/lost by js, removing java altogether
  • processing-lite, js syntax
  • processing-js bridge to c++ compiles
  • installations without c++
  • processing as web dev

Approaches

  • a bunch of different scenarios - writing out what code for that would look like
  • speculative source code - examples or hack usable

Goals

  • processing identity - running in browser, barrier to entry low
  • primary audience - hard-core programmers, 19yr old design students
  • system+api
  • as a library, focus what processing does and doesn’t do

Questions

  • What is unique about javascript?
  • What are main ways it diverges/differs from java/processing?
    • dynamic vs static
    • loosely-typed vs strongly-typed
    • prototypal vs classical inheritance
    • functions as classes, constructors, methods
    • classical objects are hard, the only way to add a new member to a hard object is to create a new class. js objects are soft, a new member can be added to a soft object by simple assignment. shallow hierarchies are efficient and expressive, deep hierarchies are often inappropriate.
    • event driven vs linear/loop based
  • Focus on browser experience? What about node, etc.
  • Network connectivity, manipulating dom, interfacing with other elts outside canvas, user interface built-on elts that processing doesn't have, multiple drawing surfaces, interfaces with other libraries / also spec for other - maybe IDE adds in auto (like import library feature).
  • question - limited to canvas?

Considerations

Core classes

PImage, PFont, PShape and PShader, PGraphics (needed to create offscreen drawing surfaces), and PVector.

What js things could be improved?

  • libraries - documentready annoying, processing-js handles loading order for you (modernizer.js, queue.js), waits to execute
  • (controlled loading and execution built-in)
  • canvas/error handling

Other notes

  • Library spec?
  • dynamic typing - better typeof method, switch statement
  • strict typeof
  • enforce a type of code, scope
  • jslint strict mode
  • pokeyoke
  • easy way to define your own events, bind listeners

Current Processing JavaScript mode

  • processing.org/learning/javascript/
  • github.com/jeresig/processing-js
  • Processing.js is really two things: a Processing-to-JavaScript translator; and an implementation of the Processing API (e.g., functions like line(), stroke(), etc.) written in JavaScript instead of Java.
  • Nothing new to learn - Processing.js automatically converts your Processing code to JavaScript. This means that you don't have to learn JavaScript in order to run your code in a browser.
  • Does not currently support libraries.
  • Possible to write native JS code inside sketch, but not intended use.
  • Simulates synchronous I/O using Directives (preloading assets).

Notes / considerations

  • web developer tools
  • processing-js as entry point to web development
  • more transparent, more standard web structure
  • standard javascript - quasi auto complete, strict mode, viz of var scope, sequence
  • live, quasi-live coding environment, dev tools built in
  • also use processing methods
  • visually represent what's going on, in terms of inheritance
  • find in reference
  • not too cluttered
  • all the benefits, but executes like it's in the browser

Tools

  • JSHint - tool to detect errors and potential problems in JavaScript code and to enforce chosen coding conventions, flexible, easily adjusted to enforce particular coding guidelines and environment
  • JSLint

Editors