[HN Gopher] p5.js
___________________________________________________________________
p5.js
Author : alabhyajindal
Score : 355 points
Date : 2024-08-03 04:53 UTC (18 hours ago)
(HTM) web link (p5js.org)
(TXT) w3m dump (p5js.org)
| gnabgib wrote:
| Big in:
|
| 2022 (244 points, 57 comments)
| https://news.ycombinator.com/item?id=33176026
|
| 2017 (349 points, 77 comments)
| https://news.ycombinator.com/item?id=14749527
|
| 2014 (381 points, 93 comments)
| https://news.ycombinator.com/item?id=8144212
| trungdq88 wrote:
| Pretty cool library to quickly build a game out of. I've built a
| small water simulation [1] with p5.js and really like how simple
| it is to learn p5.
|
| [1]: https://github.com/trungdq88/summer
| alabhyajindal wrote:
| Very cool!
| jna_sh wrote:
| Oh the new website shipped! They've been working on this for a
| while, looking great.
| rikroots wrote:
| I think the key reason why this link has been posted to HN now is
| because p5js has a new website? Back in 2023 the Sovereign Tech
| Fund gave the p5js folks a EUR450k grant[1] "to enhance p5.js
| Documentation organization & accessibility" and this seems to be
| some of the results of that investment.
|
| In my view, it seems to be paying off - the site feels a lot
| easier to navigate and search, with more useful information. For
| example, compare the old[2] and new[3][4] versions of how to use
| p5js editor/canvases with a screen reader.
|
| [1] - STF announcement/progress -
| https://p5js.org/events/stf-2024/
|
| [2] - Using p5 with a screen reader (old version) -
| https://archive.p5js.org/learn/p5-screen-reader.html
|
| [3] - How to Use the p5.js Web Editor with a Screen Reader (new)
| - https://p5js.org/tutorials/p5js-with-screen-reader/
|
| [4] - Writing Accessible Canvas Descriptions (new) -
| https://p5js.org/tutorials/writing-accessible-canvas-descrip...
| kapep wrote:
| It's nice that they keep the old site available as
| https://archive.p5js.org/
|
| I'm not a fan of the layout on large screens though. The linked
| tutorial [1] is fixed width left-aligned paragraphs, which
| makes right half of my display empty. On the other hand, other
| elements like on the reference overview [2] are stretched in
| four columns across the whole display which looks ok when the
| browser window is half my displays width but is hard to read
| when the window is maximized.
|
| [1]: https://p5js.org/tutorials/p5js-with-screen-reader/ [2]:
| https://p5js.org/reference/
| petercooper wrote:
| We also featured it quite prominently in yesterday's
| _JavaScript Weekly_. With ~175k subscribers, things we include
| often make it to HN front page hours later. It 's next to
| impossible to actually _prove_ the connection.. but it 's just
| part of the fun of how links spread around the ecosystem for me
| :-)
| slorber wrote:
| Impossible yet it often happens the same old link gets
| featured everywhere at the same time :)
| larodi wrote:
| Recently did a digital ad entirely in processing and then
| ported it to p5js. In my experience with it...
|
| * processing is still much easier to work, even though p5js
| seems to catch-up. I did work with it like 10 years ago and it
| was already very easy
|
| * it was very easy to spot bugs or missing implementation in
| p5js
|
| * While an almost identical port was possible, it's not 1:1 and
| takes learning some APIs
|
| * p5js is not even close to d3 or three.js in terms of
| performance
|
| * tbh it seems to me lot easier to animate in web with modern
| css3 and some helper libs, than use p5js. In fact I would see a
| very straight pipeline from free vector apps into css with very
| little shading without p5js. Which makes me wonder how is p5js
| relevant in 2024, apart from educational tool.
|
| * For things which involve pixel level compute there is no easy
| way to use the GPU efficiently
|
| For me this whole 450k funding is quite bizarre, and in
| particular the fact it got directed to a not so popular
| framework.
| zyklonix wrote:
| These are some great insights! Thanks for summarizing them.
| It will save me a lot of time in the future. I would love to
| see this digital ad! Is it public?
| ralusek wrote:
| Regarding performance, I once had an experience that I never
| bothered to look into. I made a cool little interactive
| simulation in the p5js sandbox; ran flawlessly. I then copy
| pasted it into a codesandbox, and it was choppy and abysmal.
| I checked the version numbers and how it was being included
| and couldn't see anything obvious. Maybe codesandbox has some
| isolation that is taxing? Like I said, never looked into it.
| j45 wrote:
| p5.js ability to spark beginners while being reasonably
| capable is what stands out to me.
|
| There's lots of options now, but it hits some outcomes in
| empowering folks who learned actionscript when it was the
| only game.
|
| More options today for sure.
| j45 wrote:
| The old site was decent and already mobile responsive.
|
| The new site is more mobile optimized and makes it possible to
| read more on the higher density screens.
|
| Discovery of p5.js is well deserved, as are the related coding
| train videos.
| javaunsafe2019 wrote:
| I tried the examples on a recent iPhone and all of them didn't
| work :(
| tymscar wrote:
| I tried first 5. All work on 15 pro max
| contrast wrote:
| I tried the first 5 on my 15 pro max. First one didn't work
| at all. They all stopped working if I pressed "play" on the
| example, giving the impression they're broken.
| dopidopHN wrote:
| I'm on a 2016 IPhone 5S and it works ?
| Centigonal wrote:
| This is a really pretty website! I'm surprised that they decided
| to take out the part in the About section mentioning that this is
| a continuation of the ideas from Processing - I guess maybe now
| P5.js is more popular than processing is/was?
| noduerme wrote:
| I really loved proce55ing as a mini language. I think it made a
| ton of sense in a world where it was fairly difficult to
| manipulate pixels inside something like a canvas inside a
| webpage if you wanted to make an interesting visual experiment.
| And it was also very readable and accessible to artists with
| little programming experience.
| layer8 wrote:
| Why the past tense?
| bmitc wrote:
| > I'm surprised that they decided to take out the part in the
| About section mentioning that this is a continuation of the
| ideas from Processing
|
| There was a schism between Ben Fry and the Processing
| Foundation, so I would reckon it's political. One of his chief
| complaints was how the p5.js project had taken over the
| Processing Foundation and minimized Processing development.
| phforms wrote:
| Some more context: Ben Fry posted a thread on X in 10/2023[1]
| where he announced and explained his decision to resign from
| the Processing Foundation.
|
| Seems like Processing got left out from expenses despite
| their large budget, running against their original reason to
| start the foundation: "I was soon shocked to learn that the
| Foundation spent nearly $800,000 last year. $0 of that went
| to Processing 4. This year, the proposed Foundation budget is
| around $1.2 million. But for Processing, there is budget for
| just two people: one developer, one community lead. You know
| what that sounds like? The reason we started a Foundation in
| the first place. Two people is not enough for any of the
| Processing software projects (i.e. anything that lives at a
| http://processing.org domain.)"
|
| I wonder if most of the money went into p5 or the new website
| or whatever, but it made me a bit sad to see that the
| original Processing got left behind. It is what got me into
| programming and there are still lots of good reasons to
| choose it over p5. I can, however, understand if they
| prioritised p5 due to the rise of web apps and mobile
| devices, sharability, JS being everywhere and so on. Maybe
| it's nostalgia, but it just doesn't bring me as much joy as
| the original.
|
| [1]: https://x.com/ben_fry/status/1709400641456501020
| solidsnack9000 wrote:
| "...there are still lots of good reasons to choose it over
| p5."
|
| What are some good reasons to choose it over p5?
| martijnvds wrote:
| Kind of sad that this isn't an implementation of Perl 5 in JS
| atomicstack wrote:
| https://fglock.github.io/Perlito/perlito/perlito5.html
| nonoesp wrote:
| You can write and run code in the browser with p5.js's
| playground, and even create an account to store your code
| sketches.
|
| https://editor.p5js.org/nonoesp/sketches/ruSYeEUEH
| alator21 wrote:
| Daniel Shiffman was the one that introduced me to this library
| years ago. Their videos were essential to my development as a
| programmer
| Flex247A wrote:
| https://editor.p5js.org/lalit.c/full/oN-oq5yM6
| whywhywhywhy wrote:
| I've used P5.js in a ton of my professional work although would
| suggest anyone interested in using it today know what happened
| with one of the founders of the foundation and creator of the
| original Processing language P5 derived from.
|
| https://news.ycombinator.com/item?id=37760363
|
| Knowing what I know now I regret supporting the work of
| Processing Foundation.
| password4321 wrote:
| Looks like the Processing Foundation got Mozilla Foundation'd.
| smrtinsert wrote:
| This explains a lot. In an era with so many performant graphics
| apis I didn't understand why processing/p5 felt so stuck, with
| no major changes in years. What a sad place to end up.
| _spduchamp wrote:
| ChatGPT knows P5.js pretty well so you can ask "Write a P5
| program that plots a sine wave and let's me control phase with a
| slider." and it does it.
|
| I used P5.js with ChatGPT to make a design tool that balances 5
| masses on a circumference for creating a rotary magnetic bow with
| reduced harmonic locking.
|
| Drag vertices of the pentagon...
| https://editor.p5js.org/spDuchamp/full/zgtkE2xik
|
| Here 3D printed result https://www.instagram.com/p/Cr4ZXGztY27/
| zyklonix wrote:
| I am fascinated with this. What is it used for?
| _spduchamp wrote:
| I use it to play music.
|
| Short demo: https://youtu.be/G1ftvw-Y6pk
|
| Open mic set: https://youtu.be/nKFK_OhQv3k
| zyklonix wrote:
| Did you transform a coat stand into an awesome futuristic
| instrument??? So glad I asked. Brilliant work. This should
| be in the HN front page!
| _spduchamp wrote:
| Yup. That's exactly what I did.
|
| I made an album for falling asleep to that you can find
| on various streaming music services. Just search
| "Autonomous Drone Lullabies" by Stefan Powell. It's an
| album that was made autonomously using an algorithm in
| Pure Data. It's also here:
| https://stefanpowell.bandcamp.com/album/autonomous-drone-
| lul...
| evanjrowley wrote:
| Purchased! Excellent find on HN today.
| potatoman22 wrote:
| Imagine a procedurally generated game via using an LLM to
| continually program new content for the game.
| jckahn wrote:
| That seems pretty soulless and uninteresting.
| dr_dshiv wrote:
| That sounds like a challenge worth taking up. (How to
| operationalize the soulfulness, though?)
| duped wrote:
| That sounds like engineers missing the point of art
| ikesau wrote:
| Love p5 - I learned a bunch of new concepts through it: polar
| coordinate space; thinking in radians; dot products; event-driven
| programming.
|
| It's one of the fastest ways I know of to make something fun and
| expressive in code.
| sjdonado wrote:
| Really good library and documentation, helped me to jump into
| animations in no time.Got this https://cs-games.sjdonado.com/
| done in a few days
| e40 wrote:
| On mobile the right third of the board is cut off.
| john-tells-all wrote:
| I _adore_ P5js -- the community OpenProcessing[1] has _thousands_
| of wonderful artworks that are easily viewed, cloned, and
| modified. I 'm mostly a Python guy but making small changes to
| P5js programs has helped me learn Javascript.
|
| [1] -- https://openprocessing.org/discover/#/trending
| jerpint wrote:
| Ive used p5js to build my own Tetris game with vim bindings :)
|
| https://www.jerpint.io/blog/tetris/
| petarb wrote:
| I started learning how to program using Processing about 16 years
| ago, so P5 and other similar libraries always have a soft spot in
| my heart. It's so gratifying for a beginner to write some code
| and see some shapes move around the screen.
| FounderBurr wrote:
| I'm not convinced about the inclusiveness claims made here, can
| you offer more proof?
| jimmar wrote:
| Is there a JavaScript library that does animation using
| timelines, key frames, etc? It seems like p5js and several other
| animation libraries focus on things like partial simulations or
| other animations driven by mathematical formulas rather than
| animations done by placing objects on timelines and transforming
| them.
| wsintra2022 wrote:
| It has a frame rate property you can reference
| soegaard wrote:
| Processing (the original Java one) has inspired many libraries.
| These days it is possible to find (more-or-less) compatible
| libraries for most popular language.
|
| As a summer project I wrote a version for Racket:
|
| https://docs.racket-lang.org/manual-sketching/
|
| The main inspiration was Daniel Shiffman's YouTube channel "The
| Coding Train". He has a knack for picking visual interesting
| problems/algorithms and his enthusiasm is unmatched.
|
| https://thecodingtrain.com/
| throw156754228 wrote:
| It is indeed slow. It's a library written by non-developers for
| non-developers and it shows in the APIs.
| trentearl wrote:
| Nice new website! Great project, I've been using it since the
| pro55esing java applet days. I got my 10 year old niece
| interested in programming by showing her some quick
| openprocessing code.
___________________________________________________________________
(page generated 2024-08-03 23:00 UTC)