Why Concave Polygons Are Expensive in Matter.js
Complex concave polygons are computationally demanding in Matter.js primarily because 2D physics engines cannot directly resolve collisions on non-convex shapes. To handle a concave shape, Matter.js must automatically decompose it into multiple smaller convex sub-polygons. This decomposition drastically increases the number of collision checks, normal axes calculations, and contact constraints that the engine must resolve in every single physics frame, leading to severe performance bottlenecks.
The Separating Axis Theorem Limitation
Matter.js relies on the Separating Axis Theorem (SAT) for narrow-phase collision detection. SAT functions by projecting shapes onto various perpendicular axes to check for gaps; if an axis with no overlap exists, the shapes are not colliding. However, SAT fundamentally only works on convex shapes—polygons where all interior angles are less than 180 degrees.
When applied to concave shapes, SAT fails because an interior indent can cause the projection algorithm to report false collisions or miss genuine contacts entirely.
Mandatory Convex Decomposition
Because SAT cannot natively process concave forms, Matter.js uses
convex decomposition algorithms (typically via integrated tools like
poly-decomp.js) to break the shape down.
A single complex concave polygon is converted into a compound body composed of dozens or even hundreds of smaller convex polygons. What appeared to be a single rigid body to the developer becomes an array of individual child parts linked together inside the physics engine.
Exponential Narrowphase Collision Checks
The computational cost spikes immediately following decomposition due to how collision pairs are evaluated:
- Increased Part Multipliers: If Object A (a compound body with 20 parts) approaches Object B (a compound body with 20 parts), Matter.js no longer performs a single check. In the worst-case narrowphase, it may evaluate up to 400 potential polygon-to-polygon collision pairs.
- More SAT Projection Axes: Every convex sub-part introduces its own unique vertices and edges. The engine must project all vertices onto the normal axes of every edge involved in the test. Higher vertex density directly multiplies the mathematical dot products required per frame.
Broadphase and Cache Inefficiencies
Even before narrowphase SAT calculations occur, compound bodies stress the broadphase stage. While a compound body has a single overall axis-aligned bounding box (AABB), the engine must also maintain, update, and query the individual AABBs for every child sub-part as the body moves and rotates. This causes memory fragmentation and thrashes the internal bounding volume hierarchy, preventing the engine from quickly skipping non-colliding objects.
Contact Point Resolution Overhead
When complex concave shapes interact, they frequently generate numerous simultaneous contact points across their various decomposed parts. Matter.js utilizes an iterative impulse solver to resolve overlaps and calculate forces like friction, restitution, and momentum transfer.
Having dozens of simultaneous contact manifolds requires the solver to run through significantly more iterations to stabilize the objects. If the solver cannot converge quickly, it leads either to performance drops (frame rate stuttering) or physics instability, such as objects vibrating, clipping through each other, or exploding apart.