Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
layout thrashing in jQuery

Re: On layout & web performance by Kelly Norton

#lazyweb Is there any documentation about which jQuery functions/effects trigger layout? re: kellegous.com/j/2013/01/26/l…

— Dave Rupert (@davatron5000) January 28, 2013
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

getWidthOrHeight() used in jQuery.fn.width/height

clientLeft

  • 3180 jQuery.event.mousehooks.filter
  • 9355 jQuery.fn.offset

clientTop

  • 3181 jQuery.event.mousehooks.filter
  • 9354 jQuery.fn.offset

getBoundingClientRect

  • 9349-9350 jQuery.fn.offset
  • 9420 jQuery.fn.position

innerText

  • 4826 Sizzle.pseudos.contains

offsetHeight

  • 1456 support test
  • 1463 support test
  • 7039 getWidthOrHeight
  • 7230 jQuery.expr.filters.hidden

offsetParent

offsetTop

offsetWidth

  • 1462-1468 support test
  • 7039 getWidthOrHeight
  • 7124 jQuery.cssHooks.width/height
  • 7230 jQuery.expr.filters.hidden

scrollLeft and scrollTop

  • 3180 jQuery.event.mousehooks.filter
  • 9048 Tween.propHooks.scrollTop, Tween.propHooks.scrollLeft
  • 9354-9355 jQuery.fn.offset
  • 9457-9458 jQuery.fn.scrollLeft/Top

offsetX & offsetY

  • 3168 jQuery.event.mousehooks.props?

getComputedStyle

scrollTo

  • 9472 jQuery.fn.scrollLeft/Top
@davatron5000

This comment has been minimized.

Copy link

commented Jan 28, 2013

You are a web hero and a saint!

@paulirish

This comment has been minimized.

Copy link

commented Jan 28, 2013

Hero!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.