Differences between Isotope and Masonry jQuery plugins

javascript jquery jquery-plugins jquery-masonry jquery-isotope
Dónal picture Dónal · Jan 13, 2012 · Viewed 50.9k times · Source

I recently discovered the Masonry and Isotope JQuery plugins. They seem to be functionally almost identical and both appear to have the same author. The only obvious difference I can see is the license.

What are the main differences between these two in terms of functionality? Why would you use one over the other?

Answer

PrimosK picture PrimosK · Jan 13, 2012

An excerpt from the interview with the author:

To some people Isotope would look very similar to the work you had previously done with Masonry; can you explain the main differences between the two?

Isotope has several features that Masonry lacks. Masonry essentially does one thing, placing item elements in a cascading arrangement. Isotope has Masonry’s layout logic built in, but in addition, it also has several other layout modes that can be used to dynamically position elements. You can even develop your own custom layout mode.

As I’ve mentioned, it has filtering and sorting functionality built in. Filtering items is as easy as passing in a jQuery selector:

$('#container').isotope({ filter: '.my-selector' });

Isotope takes advantage of the best browser features out there. Instead of using typical left/top styles positioning, Isotope takes a progressive enhancement approach and uses CSS transforms if supported by the browser. This provides for top-notch performance for top-notch browsers. With hardware acceleration kicking in, animations look silky smooth on WebKit browsers, and even less-powerful devices using iOS. CSS transforms perform better with CSS transitions, which I’ll discuss later.

Another difference is license as @AminAriana pointed out. Masonry is under the MIT license, but Isotope is only free for personal use.

You can buy (25$) Isotope commercial license on this page.

Related questions

What's the easiest way to call a function every 5 seconds in jQuery?

JQuery, how to call a function every 5 seconds. I'm looking for a way to automate the changing of images in a slideshow. I'd rather not install any other 3rd party plugins if possible.

Read More
Get query string parameters url values with jQuery / Javascript (querystring)

Anyone know of a good way to write a jQuery extension to handle query string parameters? I basically want to extend the jQuery magic ($) function so I can do something like this: $('?search').val(); Which would give me the …

Read More
javascript compare strings without being case sensitive

I have to check some strings using JavaScript but case sensitivity is causing problems. for example if('abc'=='ABC') { return true; } it will not go inside the if loop though the meaning of the word are same. I cant use …

Read More