Javascript/Typescript Physics Engines

[cmann]

What physics engines are available for Javascript and/or Typescript? I've searched myself but maybe there's one or two I missed.
I also found a post in these forums but that's over two years old now; It's a little disappointing to see that some of them aren't actively developed and lacking a lot of features.

I put together a test to compare the different engines I tried - I've attached the files if anyone wants to try it out.

Here are the engines I've tried:

• PhysicsJs http://wellcaffeinated.net/PhysicsJS/
  - Incomplete: lacking simple features like constraints
  - Seems like it was last updated 2 years ago
  - Possibly the worst performance
  - Strange API (in my opinion) and difficult to use
  - Built in mouse interaction behaves strangely
• MatterJs http://brm.io/matter-js/
  - Also incomplete and lacking constraints
  - Has a built in mouse constraint but it acts strangely
  - Updated recently
  - Simple and easy to use
  - Doesn't handle stress test well
• p2.js http://schteppe.github.io/p2.js/
  - Complete
  - Updated within the last few months
  - Doesn't handle stress test well
  - Easy to use
  - Good documentation
• Box2DWeb https://github.com/hecht-software/box2dweb
  - Complete - everything you would expect from Box2D
  - Last updated one or two years ago
  - Semi-poor documentation - you have use the box2d flash documentation which is fairly thorough but slightly outdated
  - Much faster and a lot more accurate than the above three libraries.
• Nape http://napephys.com/
  - Complete - lots of features - but isn't very active
  - Has a great marching squares utility which can convert bitmaps into polygons
  - Good site and documentation
  - Easy to use but the pooling get/dispose stuff can be a bit confusing
  - Similar (or maybe even slight better) performance to Box2DWeb and possibly more accurate
  - Large - minified it's still 1.7MB

The one problem with Nape though is that it isn't really meant for Javascript and I had a lot of trouble getting it set up in Typescript.
There were some project to convert it to js and generate definition files but I had to modify them a lot to get something complete that worked for me. I also had to manually convert the debug draw classes from as3 to js and Easeljs.
Luckily that only needs to be done once - after that I didn't have any problems using it though.

I also tried PhysicsType2D (http://physicstype2d.com/) but couldn't get it to work.

Overall I was a bit disappointed; In terms of performance, the 'native' js libraries fell short by a lot compared to the two ported ones, and on top of that they lacked a lot of important features.
Even the ported ones didn't perform as well as their Flash/As3 versions - the Nape stress test (you can find it here) which I copied, runs significantly better in flash.

PhysicsLib.zip

UPDATE:

You can find the updated github repo here: https://github.com/cmann1/Javascript-Physics-Library-Tests/

[Fatalist]

Thanks for this, I've searched for js physics engine benchmarks but could not find anything.

You should make a github repo so people can add additional tests and engines.

[cmann]

2 hours ago, Fatalist said:

Thanks for this, I've searched for js physics engine benchmarks but could not find anything.

You should make a github repo so people can add additional tests and engines.

No problem.

I've never used github or anything similar before but I might just try that.
I may also add a few more tests and make it easier to create tests without having to hand write code for each engine.

[cmann]

I've made some changes, added a demo comparing the various constraints each library offers, and, as you suggested, created a github repo.

You can find it here:  https://github.com/cmann1/Javascript-Physics-Library-Tests/
And view it online here: https://cmann1.github.io/Javascript-Physics-Library-Tests/

[cmann]

A small update: I've added a rag doll demo.

As expected Nape and Box2D handle this without a problem. It was also simple to do in p2.js but it falls behind a bit in performance with a large number of rag dolls.

I could hack something together that's close to a rag doll in MatterJs, but neither that nor PhysicsJs really has the required features to make it work properly.

[ozdy]

Hi, @cmann

Great job. I'm using the Nape typescript port, but I'm running into problems:

this.space.listeners.add(new InteractionListener(CbEvent.BEGIN, InteractionType.ANY, CbType.ANY_BODY, CbType.ANY_BODY, this.onInteractionBegin));

all the constants (CbEvent.BEGIN, InteractionType.ANY, CbType.ANY_BODY, CbType.ANY_BODY) are null, any idea why this happens?

EDIT: This is strange, some other constants like BodyType.STATIC are fine, even though they seem to be defined in the same way in nape.max.js ...

[cmann]

Honestly I haven't looked at this in a while, but I'll try to help.

If you use the following for example, what output do you get?

console.log(nape.callbacks.CbEvent.BEGIN);
console.log(nape.callbacks.CbType.ANY_BODY);
console.log(nape.phys.BodyType.DYNAMIC);

 

[ozdy]

18 minutes ago, cmann said:

Honestly I haven't looked at this in a while, but I'll try to help.

If you use the following for example, what output do you get?

console.log(nape.callbacks.CbEvent.BEGIN);
console.log(nape.callbacks.CbType.ANY_BODY);
console.log(nape.phys.BodyType.DYNAMIC);

 

Cheers for the help, @cmann

I get null, null and BodyType object:

[cmann]

Strange. This is what I get:

 

So just to confirm, you're using nape.min.js, or nape.max.js from here: https://github.com/cmann1/Javascript-Physics-Library-Tests/tree/master/lib/nape

 

[ozdy]

Yes, but with debugDraw.ts omitted, could that be the problem?

[cmann]

What browser are you running it in?

[ozdy]

1 minute ago, cmann said:

What browser are you running it in?

Chrome latest Windows 7 64bit/

[ozdy]

I now added all libraries (debugDraw, easeljs, etc) but I still get the same problem using nape.max.js. Could you hint me which functions are supposed to initiate these constants?

[ozdy]

@cmann I don't get the error with nape.min.js, only with nape.max.js, but it's hard to debug with that  Funny, even Visual Studio code gives me warnings on nape.max.js, like unreachable lines (238 and 251); (breaks after if/else with returns).

[cmann]

Ok so I think I found the problem.

Some of those constants have get_XXX function, then use defineProperty to link that function to the property name, eg. for BodyType.STATIC

// There's a function like this
BodyType.get_STATIC = function() {
	...
};

// Then lower down there's this:
Object.defineProperty(BodyType, "STATIC", {get: BodyType.get_STATIC});

 

Now for some reason (I'm have no idea how) some of those defineProperty calls were removed or possibly never added.
The thing is that to get nape working in js was a lot of work - I had to convert it from haxe to js, then had to do a lot of processing to get that working so it's possible I screwed something up at some point without realising it.

I quick fix could be to directly use the get_ functions instead, eg.

// Instead of this
CbEvent.BEGIN

// Use this
CbEvent.get_BEGIN()

 

[cmann]

@ozdy

I've updated nape.max.js in github
I had scripts that generated the nape js files, but can't remember how they work (it's a bit of a mess), so I just manually copy/pasted the necessary defineProperty lines from another copy I had

Hopefully this should fix the problem for you.

[ozdy]

14 hours ago, cmann said:

@ozdy

I've updated nape.max.js in github
I had scripts that generated the nape js files, but can't remember how they work (it's a bit of a mess), so I just manually copy/pasted the necessary defineProperty lines from another copy I had

Hopefully this should fix the problem for you.

Thank you for your work, I won't be able to test in a couple of days but will let you know!

[8Observer8]

PhysicsJS was archived.

Quote

This project is no longer maintained

It's been many years since writing this library. And I don't have time to dedicate to maintain it. On the up side, Matter.js has really stepped up and taken the spotlight of javascript physics. It has everything PhysicsJS has and more.

 

[8Observer8]

I rewrote a simple example from the Matter.js Getting Started tutorial to TypeScript. You can run it on Playground. Source code and instruction how to build: https://github.com/8Observer8/getting-started-matterjs-ts

 

[8Observer8]

• Usage of Planck.js with TypeScript (Planck.js is a port of Box2D Physics Engine)
• Usage of Ammo.js with TypeScript (Ammo.js is a port of Bullet Physics Engine)

[8Observer8]

http://fatidol.com/phy-benchmark/

https://github.com/shakiba/planck.js/issues/207

My result:

Asus K53SV; 8 GB RAM, i3 2.2 GHertz (2 cores); Intel HD Graphics 3000; Nvidia Geforce GT 540M (1 GB); Windows 10

• box2d.ts : 27 FPS
  

• planck.js : 17 FPS
  

• matter.js : 43 FPS