Skip to content

Instantly share code, notes, and snippets.

View michaldudek's full-sized avatar

Michał Pałys-Dudek michaldudek

View GitHub Profile
@paulirish
paulirish / what-forces-layout.md
Last active June 10, 2024 06:51
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@Striker21
Striker21 / gist:1352993
Created November 9, 2011 20:57 — forked from padolsey/gist:500145
quickEach
// $.quickEach() replicates the functionality of $.each() but allows 'this'
// to be used as a jQuery object without the need to wrap it using '$(this)'.
// The performance boost comes from internally recycling a single jQuery
// object instead of wrapping each iteration in a brand new one.
// Development -----------------------------------
(function($)
{
$.fn.quickEach = function(f)
{