Skip to content

Instantly share code, notes, and snippets.

@metaphox
metaphox / what-forces-layout.md
Last active September 19, 2015 11:15 — forked from paulirish/what-forces-layout.md
What forces layout/reflow in Chrome. 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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
@metaphox
metaphox / System Design.md
Created April 18, 2016 12:01 — forked from vasanthk/System Design.md
System Design Cheatsheet

#System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

##Basic Steps

  1. Clarify and agree on the scope of the system
  • User cases (description of sequences of events that, taken together, lead to a system doing something useful)
    • Who is going to use it?
    • How are they going to use it?