TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Planck.js – JavaScript rewrite of Box2D physics library

245 pointsby vivaladavabout 8 years ago

19 comments

shakibaabout 8 years ago
Planck.js developer here! I have posted this to reddit before, so I&#x27;m just going to include it here too:<p>I have ported&#x2F;rewritten Box2D physics engine to JavaScript, for cross-platform HTML5 game development. Planck.js includes entire Box2D algorithms, a simple HTML5 Testbed, more than 50 examples and some new game prototypes. The project is pre-released and there may still be minor issues, which I&#x27;m working to fix. So far I have spent more than 400 hours for developing this project and it consists of around 20k lines of code.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;shakiba&#x2F;planck.js" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;shakiba&#x2F;planck.js</a><p>My main motivations for working on this project are:<p>- Taking advantage of Box2D&#x27;s efforts, achievements and community knowledge<p>- Developing readable and maintainable JavaScript code<p>- Optimizing the library for web and mobile platforms<p>- Providing a JavaScrip-friendly API<p>Your feedback is highly appreciated, and I hope you use Planck.js to make some awesome games soon!
评论 #14051981 未加载
评论 #14054439 未加载
评论 #14054943 未加载
评论 #14054867 未加载
评论 #14056334 未加载
评论 #14059081 未加载
评论 #14054453 未加载
d0vsabout 8 years ago
It baffles me that all those JS physics library never provide proper docs or even an API reference and always link to the C++ Box2D manual as if it was an acceptable alternative. Always have to guess what the JS equivalent is but even then you&#x27;re in for a surprise: <a href="https:&#x2F;&#x2F;github.com&#x2F;shakiba&#x2F;planck.js&#x2F;blob&#x2F;master&#x2F;CHANGES.md" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;shakiba&#x2F;planck.js&#x2F;blob&#x2F;master&#x2F;CHANGES.md</a>
评论 #14054159 未加载
评论 #14052977 未加载
评论 #14054210 未加载
评论 #14052964 未加载
评论 #14054284 未加载
IvanK_netabout 8 years ago
You reminded me, that I made a Javascript game with Box2D five years ago: <a href="http:&#x2F;&#x2F;www.loudrider.com&#x2F;" rel="nofollow">http:&#x2F;&#x2F;www.loudrider.com&#x2F;</a><p>I was using Box2DWeb <a href="https:&#x2F;&#x2F;github.com&#x2F;hecht-software&#x2F;box2dweb" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;hecht-software&#x2F;box2dweb</a> . It could be good to mention other javascript versions of Box2D and say, what are the differences between them and your library.
评论 #14055136 未加载
评论 #14053261 未加载
评论 #14055302 未加载
caseywebdevabout 8 years ago
I love that you kept the tried and true Box2D API as that&#x27;ll make porting what I&#x27;m working on much easier. I&#x27;ve been using the emscripten version [1] but the automatic port from C++ makes the JS API quite painful at times, especially with the manual memory management that&#x27;s required to prevent leaks. Thanks for doing this!<p>[1]: <a href="https:&#x2F;&#x2F;github.com&#x2F;kripken&#x2F;box2d.js" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;kripken&#x2F;box2d.js</a>
degenerateabout 8 years ago
In most of the demos, you can grab the objects and drag them around. In other demos (like 8 ball) you can &#x27;shoot&#x27; them.<p>I wasn&#x27;t expecting it to be so smooth and precise... this is really great work. It makes me realize why I got a C in physics, because I could never make this!
评论 #14051695 未加载
throwaway2016aabout 8 years ago
This seems like really great work.<p>I could have sworn this was done already but looking at all the search results that came up the alternatives seem awful at first glance. At the very least this project is better at marketing.<p>As an aside, does it bother anyone else that the 8-ball demo has two extra pockets in the table?
评论 #14051676 未加载
评论 #14051772 未加载
评论 #14051583 未加载
erikpukinskisabout 8 years ago
Off topic:<p>I&#x27;m interested in a physics library based on waveform collapse. It seems like performance would be so much better. A body could arc through empty space, without writing any new data to the GPU, just the clock changing, until an &quot;observation&quot; event where you wanted to check whether it interacted with anything, at which point you collapse some number of waveforms into particles, do rigid body math, and then generate new wave equations for the subsequent timeline. There would be no centralized &quot;tick&quot; just a tree of nested timelines forking whenever your code decided to do an observation. When rendering you&#x27;d just render all the waves, which means you can do arbitrary precision. You could do 90hz rendering of the waves for head position, while only collapsing particles every half second or so. Do that at multiple scales and you have a physics system with arbitrary fidelity traded off for performance. You can have different ticks at different scales (waves within waves). The properties of a given surface would just be the sum of maybe 3-4 waves at different levels of detail. You could collapse these independently depending on how much compute you wanted to devote at different levels. I think this would pair well with an SDF-based renderer, which lets you have screen-aligned surfaces that kind of act like particles already.<p>It would lead to bizarre physics bugs, but I suspect they would be very interesting and could lead to interesting gameplay. Perhaps they might even help us learn things about how our own universe works.
santaclausabout 8 years ago
Cool! Is there a big advantage to a manual rewrite vs emscripten? With emscripten folding in updates from Box2D &#x27;native&#x27; would be easier, it seems.
评论 #14053808 未加载
评论 #14053513 未加载
tapirlabout 8 years ago
great, included in <a href="http:&#x2F;&#x2F;www.tapirgames.com&#x2F;blog&#x2F;open-source-physics-engines" rel="nofollow">http:&#x2F;&#x2F;www.tapirgames.com&#x2F;blog&#x2F;open-source-physics-engines</a>
评论 #14054493 未加载
Hydraulix989about 8 years ago
Great work! This is really impressive stuff, and it&#x27;s applaudable that you saw this project through to the very end!<p>I&#x27;m actually seeing some hitching in the car demo on my reasonably fast dev machine, particularly when I&#x27;m interacting with the bridge (computing contact forces of a bunch of bodies connected with joints is a lot of work): <a href="http:&#x2F;&#x2F;piqnt.com&#x2F;planck.js&#x2F;Car" rel="nofollow">http:&#x2F;&#x2F;piqnt.com&#x2F;planck.js&#x2F;Car</a><p>Have you looked at perf yet? How does the performance of your rewrite planck.js compare to a compiled emscripten version?<p>Would you ever consider using something like ASM.js or WebAssembly? Physics libraries are definitely one of those performance-critical applications where this kind of stuff actually matters a whole lot.
评论 #14055366 未加载
评论 #14056263 未加载
IvanK_netabout 8 years ago
I made a graphics library IvanK.js and made a Box2D demo for it (using Box2DWeb). It ran smooth even back in 2012 :) <a href="http:&#x2F;&#x2F;lib.ivank.net&#x2F;?p=demos&amp;d=box2D" rel="nofollow">http:&#x2F;&#x2F;lib.ivank.net&#x2F;?p=demos&amp;d=box2D</a>
BLanenabout 8 years ago
Cool.<p>Did you contact the Phaser people( Or well, that one guy mostly)? This could replace Box2d there.
评论 #14055387 未加载
AndrewStephensabout 8 years ago
I&#x27;ve messed around with various incarnations of Box2D, including at least one other Javascript port. How does this one compare performance-wise? Does doing a full rewrite perform better than the automatically generated Javascript of the other ports?
评论 #14054183 未加载
the_arunabout 8 years ago
Awesome!! Makes it a delight to use
m0dEabout 8 years ago
I&#x27;m currently using Box2D intensively in one of my games: www.braains.io What would be the easiest way for me to replace the existing Box2D implementation with Planck.js?
partycoderabout 8 years ago
What I remember from Box2D is that the simulation wasn&#x27;t deterministic but rather dependent on frame rate for example. Is it the same case for this?
评论 #14052887 未加载
评论 #14053951 未加载
评论 #14052001 未加载
评论 #14053023 未加载
diseaseabout 8 years ago
How difficult would it be to integrate with Phaser? I believe Phaser currently has Box2D support but only through a closed source commercial plugin.
评论 #14054485 未加载
redjamjarabout 8 years ago
Nice job!! Love the 8 ball example ... really fun :)
floatbothabout 8 years ago
Nice demos! I like how in the soccer example you can play as a self-driving ball :D