What is muuri?

Muuri is a JavaScript layout engine that lets you build interactive, responsive grids on a webpage where items can be dragged around, filtered, sorted, and animated. Think of a Pinterest-style board or a Trello task board where you can click and drag cards to rearrange them, and the whole layout smoothly adjusts to fill in the gaps. It bundles several common layout behaviors into a single tool, so you don't need to mix and match different libraries to get these effects working together. At its core, it figures out where each item should be positioned within a container and handles all the math and animations when things change. You set up your HTML with a container element and child items, add a bit of CSS to mark their positions, and then initialize it with a single line of JavaScript. From there, you can enable drag-and-drop, configure how items animate when they appear or disappear, and control how the grid responds when the browser window is resized. It can even perform these layout calculations in the background, which helps keep the page responsive even when you have a lot of items. This would be useful for anyone building a content-heavy dashboard, a photo gallery, a project management board, or a product listing where users need to reorganize items by dragging them. If you are building an app where people curate their own boards or rearrange widgets on a screen, this handles the complex interactions so you can focus on what goes inside each card. One notable thing about the project is how much it packs into its core. Rather than requiring you to bolt on separate libraries for drag-and-drop, sorting, and filtering, it builds these features in directly. This keeps things simpler but means you are relying on one engine to handle a lot of moving parts. The API is designed to stay as low-level as possible, giving developers fine-grained control over the layout and behavior without hiding everything behind heavy abstractions.