12 comments

  • Blake RutledgeBlake Rutledge, over 7 years ago

    Hmm. crashed my browser when i pack 9,999,999 boxes. Piece of shit plugin.

    22 points
  • Michael Cavalea, over 7 years ago (edited over 7 years ago )

    Happy hump day DN!

    Following up on the release of my portfolio last week, I'm trying to keep the ball rolling by releasing some of the open source stuff I've been cooking up.

    So here's Bricks. Masonry layout made ridiculously fast, regardless of how many items you put in it. Give it a shot on the project page (the post link), designed by the legend Chris Allen himself.

    The code is on GitHub here: https://github.com/callmecavs/bricks.js

    5 points
  • Paul MorelPaul Morel, over 7 years ago

    You're on a roll. First a complete rewrite of Layzr.js and now this! I'll probably have a use for this in my portfolio update. Thanks for sharing.

    2 points
  • Ricard Panadès NadalRicard Panadès Nadal, over 7 years ago

    Cool man! Thanks for sharing, I will try it with my future portfolio ;)

    1 point
  • Ollie BarkerOllie Barker, over 7 years ago

    Guy i work with built MacyJS for easy responsive masonry http://macyjs.com/

    0 points
  • Dmitry SemenovDmitry Semenov, over 7 years ago

    I needed a similar script a few months ago and I did some research on available pinterest-like layouts. As you, I found most too bloated so ended up writing my own. I also noticed that a lot scripts read-size/write-css alternately, instead of calculating all at once and then applying all at once. Your looks the closest to the perfect one.

    But I see some flaws in statements that you mention on the plugin homepage:

    Are built on dependencies, like jQuery

    That's not true. Even official masonry script by David Desandro has vanilla js version. Also there are https://github.com/henriquea/minigrid and https://github.com/attila/savvior and someone already mentioned Salvatore. And even Woomark has version without dependencies https://github.com/germanysbestkeptsecret/Wookmark-jQuery

    Mandate HTML markup, or require a CSS stylesheet

    That's also not true, most allow to use any markup.

    Position elements with transforms, making animation difficult

    It's actually the opposite. It's much cheaper for browsers to animate elements that are positioned with transforms.

    0 points
    • Michael Cavalea, over 7 years ago (edited over 7 years ago )

      I appreciate you saying mine looks the closest to perfect ;)

      In regards to your first 2 points - I get it, there are other exceptions to these "rules." I don't think what I said is a blatant lie though. There are plenty of solutions out there that are bloated, and don't perform particularly well, and depend on jQuery or mandatory HTML/CSS.

      In regards to your third point, what I meant is the following. If the masonry layout uses transforms to position the elements, it then becomes more difficult for the end user to animate the grid elements. Why? Because there's an inline "transform" property that they need to compete with, and that needs to be maintained for the element to continue to appear in the proper position. Believe me, I know that transforms and opacity are the cheapest properties for browser's to animate, because they effect only the composite layers, rather than layout, recalculating style, etc. If the library uses a transform to position a masonry element, then the end user is forced to animate a less-than-desirable property to "reveal" items.

      0 points
  • A. M. ­DouglasA. M. ­Douglas, over 7 years ago

    Random question: why is your logo a blurry-due-to-hardware-acceleration SVG instead of, y'know, text?

    0 points
  • Rolando MurilloRolando Murillo, over 7 years ago (edited over 7 years ago )

    Cool. Have you guys tried Salvattore too?

    0 points
    • Michael Cavalea, over 7 years ago

      I'd actually never heard of it, thanks for bringing it to my attention.

      I will say I do really like the CSS style syntax of it, and that's something totally original I've never seen with masonry implementations, but I always avoid using jQuery, so it's a bit outside of my use case.

      0 points
      • Rolando MurilloRolando Murillo, over 7 years ago

        It doesn't use jQuery. ;)

        0 points
        • Michael Cavalea, over 7 years ago

          Might I recommend changing the tagline? "A jQuery masonry alternative" made me think it was for sure a jQuery plugin - upon further research though I see that jQuery Masonry is a plugin, and your library is an alternative to it. My apologies.

          2 points