

Verlet-js - Open source dynamic body physics engine - subprotocol
http://subprotocol.com/verlet-js/

======
subprotocol
Hi HN. I recently open sourced a verlet physics engine that I wrote for fun.
Four example experiments are in there so far. I have a few other experiment
ideas in mind that I hope to get implemented soon. Anyways, it was a blast
creating this and thought others might like to look/play with it too.

Cheers

~~~
iambot
Looks great, thanks for sharing. One thing I would suggest is to not worry
about rendering the physics on the canvas, threejs is good at what it does and
lacks a good physics engine. It's just my opinion, but I think the project
would benefit from either making it work with threejs or by not solving the
render problem, and just focus on doing great physics, so that people can use
the results in their threejs scenes.

Great work though

~~~
subprotocol
This is a really great point. Abstracting it away shouldn't be bad, and it is
possible to extend by vec2 implementation to 3d. After I finish my next batch
of examples I will venture down this path.

Thank you for the feedback!

~~~
bm1362
There is a physics engine for threejs- it's somewhere on their demo page. I'm
actually working on a physics engine as well- I'm willing to help you extend
it in whatever direction.

A question, Why did you chose Verlet integration? I know it's great for
particles but I always had issues trying to do angular mechanics.

~~~
iambot
Are you thinking of Physijs [0], which is made to work well with ThreeJS? Its
a wrapper around Ammojs for ThreeJS.

It does look good and integrates well, but to be honest ThreeJS is so mature
and battle tested with multiple renderers (canvas, webgl etc) that when
building a physics engine, I really think it would be better to spend ones dev
time on the physics and not waste* time reimplementing a portion of ThreeJS.

[0]: <http://chandlerprall.github.io/Physijs/>

*Obviously not actually 'wasted' time, hacking is great even just for the sake of it - but I'm sure you know what I mean.

------
michaelkscott
Nice project. The spider was a bit unexpected though. I had to jolt back a
bit. I then pulled it out of the web and it died. Phew. (:

~~~
pooriaazimi
I thought you were joking (about dragging the spider out), but it actually
works! Extremely well-done.

~~~
Zecc
You drag it slightly off the web and she will hold on for dear life. Verly
funny!

~~~
rurounijones
Amazingly "life-like" behaviour on the spider considering such simple "AI"

~~~
subprotocol
Thanks =)

------
blixt
You should make a benchmarking script to track speed over time. I've written
probably 10 different Verlet engines in JavaScript, and the overhead of
JavaScript's dynamic nature can be very palpable in the simulations.

For my most recent attempt at something speedy, here's some source code making
use of typed arrays and doing away with objects completely. The speed
improvement is good, but maybe the maintainability suffers a little (press
space to create blob): <https://c9.io/blixt/blob/workspace/index.html>

Note that the particle-line collision is currently inefficient, so it slows
down the simulation a lot more than it should.

------
alexvr
Awesome. I love the spider demo, especially -- the way it sticks and
everything just feels right, to the point where it's too realistic for
comfort. I felt like I was messing with a real spider.

~~~
ikawe
I pulled her off, and then felt awful about it. Luckily you can put her back
on.

I'm not sure what about it is so effective.

------
donpark
There is a similar project named Coffee-Physics [1] by Soulwire.

[1] <https://github.com/soulwire/Coffee-Physics>

~~~
rorrr2
Also

Box2D JS and Box2Dweb

<http://box2d-js.sourceforge.net/>

<https://code.google.com/p/box2dweb/>

Bullet JS

<https://github.com/adambom/bullet.js/>

Cannon.js

<https://github.com/schteppe/cannon.js>

Ammo.js

<https://github.com/kripken/ammo.js/>

Physijs

<http://chandlerprall.github.io/Physijs/>

JigLibJS

<https://github.com/supereggbert/JigLibJS>

~~~
Ygg2
Interesting list but I wonder how do these libraries fare when used by JS
developers? What are their performances and experience with them?

~~~
seanmcdirmid
Also, a verlet-based physics engine is a very different beast compared to a
rigid-body one (a few in the list above are also based on verlet, but not
most).

~~~
jjoonathan
Err, I thought verlet was just an integration technique? How does it translate
into a "very different beast"?

~~~
bm1362
Verlet integration uses an object's change in position at time t to determine
the velocity for t+1- it is typically used for particles not full rigid
bodies.

~~~
seanmcdirmid
Verlet is incredibly stable and allows you to update the position of a mass
directly (velocity, force, momentum are all implicit), making it very easy to
work with if not very accurate. You can't emulate rigid bodies very well
(shape matching kinda works), collision response and stacking is a pain in the
ass.

~~~
jjoonathan
I guess I'm still having trouble understanding where the complexities arise. I
have no difficulty believing that they _do_ arise, but I would like to
understand how it happens if you're willing to take the time to explain.

I would think that rigid bodies -- either perfectly rigid or semi-rigid via
springs & struts -- would not handle all that differently in verlet since
force is explicit (typo on your part?) and a v/p estimate is available from
the last position, albeit with a bit more phase lag than usual. Does the phase
lag induce nasty oscillations or something?

~~~
seanmcdirmid
We can make semi-rigid bodies in verlet using strings are shape matching
techniques, but the pressure needed to maintain shape necessarily interferes
with stacking or any other kind of stable contact. Actually, their was a
solution to this in a shape matching paper by Matthias [1] but I was never
able to get it to work right.

I've played around a lot with Verlet, it is very powerful in certain
cases...especially since you can just update the position of a mass directly
(very easy to program, very mouse/touch input friendly). However, a rigid body
physics engine is probably better for most game use cases.

[1] <http://www.matthiasmueller.info/realtimephysics/>

~~~
jjoonathan
Cool, thanks for the link!

------
arocks
The spider has been extremely well done. Spent a lot of time playing with it.

------
drorweiss
Awesome! Thanks for sharing. It's amazing what you can do inside the browser
these days.

Any thoughts of integrating it with SVG? SVG is super useful for drawing and
manipulating shapes in the browser.

~~~
subprotocol
Thank you! I have actually not played around with SVG yet. Is it as easy as
canvas? I am very new to canvas and found it to be super easy to pick up and
run with.

~~~
drorweiss
I haven't played with canvas yet... it's quite powerful... checkout
[http://www.netmagazine.com/features/20-svg-uses-will-make-
yo...](http://www.netmagazine.com/features/20-svg-uses-will-make-your-jaw-
drop)

------
talloaktrees
I pulled on a circle and it became a bicycle.

That is the best bug ever.

------
goyalpulkit
This looks really good.

Just for fun, try pulling one of the spider's legs and bring it close to the
web! I really like how it clings on to the web.

------
opminion
Awesome. This kind of well designed personal site mixing tech with demos is
very appealing, because if gives you something beautiful, potentially very
useful, and chewable.

Anyone knows a good "directory" or collection of such sites?

Another example of that kind of site: <http://worrydream.com/>

------
f4stjack
Hey, I downloaded the zip sourcefile from the github repository but any change
on the tree example code (for example commenting out tree1) increases load
time tenfold. Has anyone experienced this?

Thanks for any reply.

edit: after I deleted google analytics code, everything went hunky dory.
Thanks for this amazing piece of code :)

------
Hawkee
Reminds me of another project done in Java Processing. It implements a similar
curtain effect except you can tear it to pieces,
[http://bluethen.com/wordpress/index.php/processing-
apps/curt...](http://bluethen.com/wordpress/index.php/processing-
apps/curtain/)

------
C1D
This is great, it doesn't seem to have any lag and I can't wait to see this
being implemented.

~~~
lanstonpeng
I'm diving into it.LOL

------
accatyyc
This is awesome. Very well done, and very nice looking examples. Simplistic
and stylish. Props for the spider!

------
BaconJuice
Holy crap, I am blown away by how amazing this is! great work guys and thank
you for sharing.

------
somid3
I am intrigued, this is a lot of work it seems, what inspired you to create
this engine?

~~~
subprotocol
It all started as play coding. The deeper I went the funner it became =)

------
buren
Really great work! Thanks for open-sourcing the project, already love playing
with it

------
bluepill
Very nice work, thanks for sharing

------
mouseroot
that spider example is pretty freaking neat

