search

drgullin / icheck

Highly customizable checkboxes and radio buttons (jQuery & Zepto)
http://fronteed.com/iCheck
7.39k stars 1.63k forks source link

Reorder parent construction wrap slightly to avoid layout thrashing #342

Closed geordiemhall closed 7 years ago

geordiemhall commented 8 years ago

I know the 1.x branch won't be used much anymore, but thought I'd submit this just in case :)

Was optimising a project I use iCheck in and found that there was a synchronous layout forced by the parent.css('position') == 'static' line, since the parent element had been wrap()ed a few lines earlier (so the browser has to recalculate styles to know what position it has now).

By moving the position check above the wrapping the browser can just use its existing style calc and so a reflow isn't forced.

The page I was working on was particularly complex, so the recalc was quite expensive, but pretty minor overall

geordiemhall commented 7 years ago

Actually, discovered issues with this method. Changed my version to use an icheck-parent class instead to avoid the position check altogether