I'm happy to announce that jQuery Masonry, everyone's favorite dynamic layout resource, has received a full v2.0 revision and is ready for public consumption.

What's new

• The architecture of the plugin is built around a constructor pattern, similar to jQuery UI's widgets. This provides for plugin-specific methods and maintaining state of the plugin instance.
• isFitWidth option to enable centered layout
• isRTL option for right-to-left layouts for Arabic and Hebrew
• Better performance. My own basic tests yielded performance boosts of 30-40%
• Sexy animation appending content with the isAnimatedFromBottom flag in appended method, as seen in the Infinite Scroll demo
• Easy prepending with reload method
• Includes imagesLoaded plugin to easily deal with images. No more relying on $(window).load()
• gutterWidth option
• Downloadable docs and demos

Updating from v1

Masonry v2.0 adds new features, performs better and resolves several lingering issues with v1.0. Everyone is recommended to update.

Updating from v1 is fairly easy. The general functionality and basic options of the plugin remains the same.

$('#container').masonry({
  itemSelector: '.item',
  columnWidth: 240
});

Here are the changes you need to be aware of when updating:

• animated option has been renamed as isAnimated
• resizable option has been renamed as isResizable
• appendedContent option has been replace by the appended method
• savedOptions and singleMode options have been removed
• Filtering with Masonry is now unsupported. Use Isotope instead, which handles filtering significantly better.
• Do NOT use $(window).load() to resolve loading media like images. See Help: Unloaded media and overlapping

Development

When I was developing the first version of Masonry in 2009 and 2010, I was learning jQuery at the same time. Consequently, the code was cobbled together with logic that worked okay, but was ultimately not flexible or interoperable. v2 was an opportunity to start fresh and build a plugin that was maintainable and extendable.

Masonry v2.0 is a complete from-the-bottom-up revision of the script and docs. The development effort was started back in October 2010, when I had discovered the revised jQuery Plugins Authoring tutorial by Ralph Holzmann. The tutorial revealed how to build methods into the plugin and maintain state. As I hacked away on the script, it became clear that I would be able to develop another similar plugin that had even bigger functionality. That plugin became Isotope. For the past seven months, my plugin development bandwidth has been devoted on Isotope, thus leaving Masonry dormant.

A couple weeks ago, I felt that Isotope was in a good place and so it was time to give Masonry the proper revision it deserved. With all the development put into Isotope, I took Isotope as a template and worked backwards, reducing it to leave Masonry's core functionality.

In addition to revising the script, I upgraded the documentation to use Jekyll so they could be easily hosted on GitHub Pages. This makes my life a lot easier as I can leverage templating for building the markup. As it's integrated into GitHub, I now only have to update one code base instead of three.

Masonry has always been my most prolific resource and so it holds a sweet spot in my developer's heart. It didn't feel right leaving my baby inactive for so long (in Internet time). I'm pretty happy being able to release v2.0. I can rest assure that are getting a rock-solid resource and I'll be better able to improve upon it moving forward.