P5 / webgl / something else ...


I have been using processing for many years and have now started to write shaders to get better speed with the GPU. I want to do things for the web. I have done some stuff in P5 but wounder what is best of putting time in? Go deeper into P5 which would be pretty easy since I know processing that well or put my time into WebGL or something else?

I saw this list: https://www.slant.co/topics/28/~best-javascript-drawing-libraries

And also this comparission between P5 and pixiJS, guess pixiJS also are using webGL: http://blindfish3.github.io/p5-playground/exploding-image/ http://blindfish3.github.io/pixijs-playground/exploding-image01/

And this webgl cubes: http://alteredqualia.com/three/examples/webgl_cubes.html

Give me your input



  • Haven't seen those in a while :D

    To be fair to p5 I've no idea if the speed comparison in those sketches is still valid; but pixiJS was certainly much faster at the time and still claims to be "the fastest, most flexible 2d WebGL renderer".

    My input:

    The drawing libraries list isn't that helpful as it contains libraries that are all designed to do very different things: from fast 2D rendering (pixijs) to interactive drawing with DOM elements (D3), to charts, 3D etc...

    If you know you want to concentrate on 2D or 3D with WebGL I'd suggest you concentrate your efforts on one of the dedicated libraries: pixiJS or EaselJS (for 2D) or three.js seem like obvious choices - i.e. well established and used in professional-grade projects. From my experience with pixiJS the transition from Processing is fairly straightforward: you'll find it has obvious equivalents to setup() and draw() and it's well documented.

    p5 is nice as a learning tool or when transitioning from Processing; but from a professional perspective I'd find it hard to recommend. IMO it's trying to do too much (and trying too hard to retain Processing's Java-derived syntax/code structure) and as such can't compete with smaller libraries dedicated to specific tasks (e.g. jQuery for DOM manipulation; pixiJS for 2d canvas, D3 for DOM interaction etc...)

    If you're not sure which direction you want to head in then p5 may just be a good fit; but if you want to develop your JS skills whilst learning some professionally useful libraries I'd opt for something else...

  • Thanks a lot for your input! I think I will concentrate on a library that has good possibility for speed. Im mainly creating stuff for 2D but maybe would be nice to have the possibility for 3D without the need of learning a new library.

    Im working with building interactive stuff with processing, touchdesigner and with simple fragmentshaders in GLSL.

    I want to expand my knowledge for including web. P5 seems like an easy way but it sounds that its better to focus on something else. What would you recommened between pixiJS and three.js? for realtime graphics? or something else?

    Maybe I start going through the tutorialspoint tutorial on webgl and after that focusing on learning a library ... what would you suggest?


  • If you want to do web stuff you'd better get in the habit of picking up and dropping libraries on a whim :D ...that's just the way it is in webland: they come and go at a phenomenal rate and even established libraries might pull the rug from under you - I'm looking at you Angular 2.0 or is it v.5 now? :((

    Actually graphics libraries seem a little more stable than application frameworks ;)

    I'm probably biased towards pixiJS because I found it so easy to pick up the basics - but I never had time to really get into it in depth; and nowadays I earn my bread and butter writing web apps and don't get to play like I used to :(

    Anyway 2D feels like an easier place to start... Less hard maths.

    One suggestion I would make is to take the time to learn some modern JS dev practices. It's well worth learning to write modules; use build tools; and package managers as they'll make it easier to structure, manage and deploy your code. See:

    Once you get into writing modular JS code you'll never want to go back to Java again :P

Sign In or Register to comment.