no need to "float" items

[yairEO]

Using floats (in this manner) is considered bad practice. Please use inline-block and if your HTML is not minified, then you will have to hack the container with font-size:0.

[brunjo]

Why is it a bad practice? I do not see the point. The performance of floats is even a little better: https://github.com/mdo/css-perf#grid-techniques. I think it is a matter of opinion if float or inline-block is better. What do you think?

[yairEO]

float's need to be cleared, and floats cannot be centered. If you think about it, float is something that needs to be floated next to a non-floated element, to be out-of-context. The condition best describing the semantics of your grid's items is inline-block which is what each item, a box which is inlined with other boxes. float should only be used where no other display solution can be achieved.

In another subject, what would be the performance of your gallery when dealing with thousands of items? The javascript is not designed to handle large amounts of items, since there no optimizations for performance..the key is to cache items, access the DOM as few times as possible and consider bulk updating and replacing the whole container's html every time. also it's very important to NOT use jQuery where ever possible, since it's very slow.

• using $container.children on every resize is bad..cache items and add/remove items when DOM changes.
• items.removeAttr('style').removeClass(options.firstItemClass); - using jQuery functions for each item is slow, try doing a bulk change.
• items.each(.. - again, very slow. replace this with a normal loop which is MUCH faster.
• elem.outerWidth() and elem.height() using pure javascript will increase performance by far, since this is called for each item a jQuery function is called, then that function is doing it's thing. a function call is always expensive, and you can do that same thing directly with JS..
• rowElems[rowElemIndex].css('margin-right', ... just use normal DOM style method. much faster. using the .css jQuery is only recommended when manipulating small amount of elements, so this is not performance-scalable.

I want to say that I really love your plugin, it's really, truly, a good one!

[brunjo]

Thanks yairEO, I appreciate your advices.

[brunjo]

FYI the plugin does not require a float grid system you can also use display: inline-block without problems.