Masonry vs Muuri
Which should you use? A side-by-side look at what each one does, who it suits, what it costs, how hard it is to set up, and where each falls short.
Open source · MIT
A lightweight Objective-C wrapper that makes Auto Layout constraints shorter and easier to read.
Open source · MIT
A JavaScript library for building responsive grid layouts that can be sorted, filtered, and dragged.
The short answer
Choose Masonry if you need…
- iOS or macOS developers writing Objective-C projects that use Auto Layout in code
- Teams maintaining existing Masonry-based code
- Developers who want shorter constraint code without Visual Format Language strings
Choose Muuri if you need…
- Front-end developers building card or photo grids that need drag and drop or filtering
- Developers who want custom layouts beyond what CSS alone can do
- Projects that want layout, animation, and interaction in a single library
Side-by-side
| Masonry | Muuri | |
|---|---|---|
| Type | Library | Library |
| Price | Free and open source | Free and open source |
| Licence | MIT | MIT |
| GitHub stars | 18.1k | 10.9k |
| Setup difficulty | Intermediate | Intermediate |
| How you get it | Install with a package manager | Install with a package manager |
| Main language | Objective-C | JavaScript |
| Last code update | 4 years ago | 2 years ago |
What each one is
Masonry
Masonry is a layout library for iOS and macOS apps. Auto Layout normally requires long, repetitive code to position views, and Masonry wraps it in a chainable syntax such as make.edges.equalTo(superview). The README says it produces more concise and readable layout code than raw NSLayoutConstraint calls, and that it adds constraints to the right view and turns off translatesAutoresizingMaskIntoConstraints for you.
Muuri
Muuri is a JavaScript layout engine that arranges items in custom grid layouts that resize with the screen. It also adds animation, filtering, sorting, and drag and drop on top of the layout, so developers do not need to combine several separate libraries. The README describes it as a mix of Packery, Masonry, Isotope, and Sortable.
Best for
Masonry
- iOS or macOS developers writing Objective-C projects that use Auto Layout in code
- Teams maintaining existing Masonry-based code
- Developers who want shorter constraint code without Visual Format Language strings
Muuri
- Front-end developers building card or photo grids that need drag and drop or filtering
- Developers who want custom layouts beyond what CSS alone can do
- Projects that want layout, animation, and interaction in a single library
Strengths
Masonry
- Constraint code is considerably shorter than the equivalent NSLayoutConstraint code, per the README's examples
- Automatically adds constraints to the appropriate view and sets translatesAutoresizingMaskIntoConstraints
- Supports iOS and macOS Auto Layout with a mix of view attributes, numbers, structs and arrays
Muuri
- Bundles layout, animation, sorting, filtering, and drag and drop in one library
- Supports asynchronous layout calculation in web workers and nested grids
- Installable via npm or a CDN link, with a minimal starting configuration
Not ideal for
Masonry
- Swift-only projects: the README recommends SnapKit instead for better type safety and a simpler API
- People who build layouts in Interface Builder or storyboards, since the library is aimed at code-based constraints
- Non-developers, because the code examples assume familiarity with Objective-C and Auto Layout
Muuri
- Simple layouts that CSS grid or flexbox can handle, since the README says CSS is often enough and Muuri adds complexity
- People without JavaScript experience, because setup requires writing code and CSS rules
Trade-offs
Masonry
- The README recommends SnapKit for new Swift projects, so this is best suited to Objective-C codebases
- Latest release is v1.1.0 and the last push shown is from April 2023, so update activity may be limited
- The README describes the project as still maintained, but the README excerpt does not spell out a support timeline
Muuri
- Requires specific CSS rules, such as absolute positioning on items and no overflow auto or scroll on the grid element
- Browsers without Web Animations support need an extra polyfill
Getting started
Masonry
Run CocoaPods install for the examples project
pod installFrequently asked questions
What is the difference between Masonry and Muuri?
Masonry: A lightweight Objective-C wrapper that makes Auto Layout constraints shorter and easier to read. Muuri: A JavaScript library for building responsive grid layouts that can be sorted, filtered, and dragged. Masonry suits ios or macos developers writing objective-c projects that use auto layout in code, while Muuri suits front-end developers building card or photo grids that need drag and drop or filtering.
Are Masonry and Muuri free?
Masonry: Free and open source. Muuri: Free and open source.
Is Masonry or Muuri more popular?
Masonry has more GitHub stars (18.1k) than Muuri (10.9k). Popularity isn't the same as fit — check which one matches your use case above.
What are other alternatives to Masonry and Muuri?
Other options people compare them with include SnapKit, Sortable, dnd-kit, React-Grid-Layout, Moveable.
Keep comparing
Built from our catalogue entries for both products: open-source details come from each project's README (AI-assisted, refreshed weekly) and GitHub data; AI-tool details are editorial. Spotted something wrong? Let us know from either product's page.