Matter.js – A 2D rigid body physics engine for the web

This is very impressive! The most advanced JS 2d rigid body physics engine to date! You can do a lot of optimization though, probably double the speed. Tip: V8 loves objects and hates parsing strings.<p>Your functional spaghetti style is a bit weird though. I hate using the &quot;find in file&quot; function in my editor. I wanted to &quot;rip&quot; some of the functionality, but it&#x27;s so entangled I would probably need all your other functions too to make it work. But maybe that&#x27;s intended :P<p>Many people, me included, would be willing to pay for an engine like this. I tried your &quot;Game physics for beginners&quot; but I&#x27;m too stupid to understand all the articles from math professors. I could probably learn, but I rather pay someone who understands.<p>But for me to use your engine, the API needs to be much easier! Something like this:<p><pre><code> var box1 = new Body(size, position); var world = new World({gravity: 9.8}); world.add(box1); world.render(); console.log(&#x27;New position: &#x27; + box1.position);</code></pre>

This person has produced some pretty incredible things with HTML&#x2F;JS&#x2F;CSS (including Matter.js).<p><a href="http://brm.io/work/" rel="nofollow">http:&#x2F;&#x2F;brm.io&#x2F;work&#x2F;</a>

I&#x27;m especially impressed by the time scaling. Back when I fiddled around with physics collision&#x2F;physics libraries years ago (ODE), have a fixed timestep was a fundamental design decision and changing that led to weird and unpredictable behaviour.<p>Things have come quite a long way :)<p>Edit: still has problems with squishiness of stacked solid objects though :\

When I was evaluating engines for Hype Pro&#x27;s [1] physics system, I compared based on file size, commit&#x2F;project activity, how easy it would be to modify and integrate, and the license (for obvious reasons). I looked at Matter.js, Verlet, PhysicsJS, p2.js, JPE, Newton, and box2d-js. While many have their respective strengths, overall Matter.js stood a notch above the rest. The code has been easy to work with and Liam has also been responsive in fixing bugs or accepting patches. It is truly a gem of a project.<p>[1] <a href="http://tumult.com/hype-pro/" rel="nofollow">http:&#x2F;&#x2F;tumult.com&#x2F;hype-pro&#x2F;</a>

I am familiar with P2 JS, looked through PhysicsJS and the two very basic arcade engines grown within Phaser JS. Matter JS seems to have the exact same feature set like any other library. I haven&#x27;t seen any 2D web engine, besides the JS ports of Box2D, which supports continuous collision detection (CCD), which would prevent a lot of tunneling, especially on slower mobile phones.<p>Why is that? CCD doesn&#x27;t look more complex in theory than any other concept in a 2d physics engine.<p>P2JS: <a href="https://github.com/schteppe/p2.js" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;schteppe&#x2F;p2.js</a> PhysicsJS: <a href="http://wellcaffeinated.net/PhysicsJS/" rel="nofollow">http:&#x2F;&#x2F;wellcaffeinated.net&#x2F;PhysicsJS&#x2F;</a> Phaser: <a href="http://phaser.io/" rel="nofollow">http:&#x2F;&#x2F;phaser.io&#x2F;</a>

Pros: The samples play well, look fun, and it looks like a great solution to small physics demos in JS. Great job!<p>Cons: Playing with the Stress demos (especially #2) really shows the slowdowns and downsides to using a JS based engine. At 450 boxes (+ 4 bounding walls), it runs at 20fps on my Macbook and thats with a lot of jitter and overlap. Not as fun.<p>Edit: Significantly better w&#x2F; WebGL render, @32fps, and with sleeping+WebGL render @34fps.<p>I wish I could see a physics engine using WebGL and GPU acceleration for the web. This one is a great start if the author were to take it further and implement some of the logic with shaders.

Was it written from scratch or inspired by Box 2D?

This would have to start talking about the problems with previous attempts (box2d...)

There are some bugs with &quot;enable sleeping&quot; turned on. Occasionally an object that is sleeping seems to fail to have external forces act upon it. For example, you can end up with a sleeping object sitting on top of another object, and when the object falls out from under it, the sleeping object stays stuck in midair. I can reliably make this happen by toggling &quot;enable sleeping&quot; on and off (example: load up &quot;wrecking ball&quot;, stop the wrecking ball before it hits the pile, turn on &quot;enable sleeping&quot;, wait for all the blocks in the pile to go to sleep, then turn &quot;enable sleeping&quot; back off and you now have a stack of immovable blocks which the wrecking ball bounces off of, and which will hover if you remove the bricks below them), but I saw the bug occur even when I wasn&#x27;t flipping this setting back and forth.

I&#x27;ve used this a lot in the past few weeks. It&#x27;s really amazing. It has some trouble with triangles. But having a physics engine completely written in Javascript from the ground up using good JS principles is refreshing. One of the coolest features is mobile demo. Buttery smooth on my iPhone.

I wonder how it compares with P2.js. Another nice pure JavaScript 2D physics library. <a href="https://schteppe.github.io/p2.js/" rel="nofollow">https:&#x2F;&#x2F;schteppe.github.io&#x2F;p2.js&#x2F;</a>

Why all those &quot;physics engines&quot; are so jittery? Are there no ways to solve such a system with perceptually exact accurancy in realtime?<p>Those kinds of approximations are the source of some of the most hilarious bugs in games over last deacade or so.<p>Please don&#x27;t read this as a critique of this particular project which is pretty good at what it&#x27;s trying to do.<p>I just wonder why AAA games use pretty much the same math? Are there no better math?<p>I mean CAD systems obviously do something better... Is that the same thing as with drawing triangles vs. raytracing?

<a href="http://i.imgur.com/QcKoWLj.png" rel="nofollow">http:&#x2F;&#x2F;i.imgur.com&#x2F;QcKoWLj.png</a><p>Doesn&#x27;t seem to render correctly on Chrome 39. Works fine on latest Firefox.

demo request:<p>I want a demo where the user can control a soft body ball such that the ball is comprised of chain segments, connected with string constant k. The pressure of the ball would be calculated depending on the area enclosed by the chain&#x27;s polygon and would be applied to each segment equally, to the outwards side. Controls would be left&#x2F;right as a simple added force to all segments of the ball. Jump would be increased air amount (target surface area) and crouch would be decreased k. In my imagination, the ball would be low friction and would grow throughout the game, to take on bigger adversaries.<p>(Sharing it here cause I didn&#x27;t get to code it in years but I would really love to see if the control would work.)

This is really impressive! Just a small bug report:<p><a href="http://brm.io/matter-js-demo/#bridge" rel="nofollow">http:&#x2F;&#x2F;brm.io&#x2F;matter-js-demo&#x2F;#bridge</a> somehow had some things fall through to the ground the first time in loaded.

Pretty slick. I think I might be using this at Global Game Jam this weekend.<p>On a side note though, it seems that there are some issues if you get things moving fast enough. I was consistently able to fling shapes through the walls on the first demo.

Impressive - on the face of it, it seems both versatile and stable.

Really nice, noticed a few jitter issues on the bridge example, that&#x27;s possibly one of the hardest thing to do in a physics engine (that and fast moving objects).

Very nice. But strange things happen in the &quot;car&quot; demo if you put one car on top of the other: they try to throw off each other like horses.

Nice work. As someone who built physics engines years ago, it makes me kind of happy that solving stacking is still no trivial task.

It looks simply great. The efforts put together for creating this library are commendable.

Does not seem to work good in Chrome or Opera for me, all movement leaves trails.

How is the cloth demo done? Is it with partial differential equations

Very cool, love the variety of demos. :)

This is amazing!

Fun!

Physics and collision detection in JS. One can only imagine the horror.