Skip to content

Instantly share code, notes, and snippets.

@paulirish
paulirish / what-forces-layout.md
Last active July 29, 2024 19:02
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
@tryashtar
tryashtar / selectors.md
Last active July 15, 2024 23:07
Code analysis of target selectors

Requirements

Selector arguments can optionally have two requirements: requiring only players, and requiring only a single target. Here are some examples of arguments of each type:

  • Only players: /give <targets>
  • Only a single target: /damage <target>
  • Only a single player: /xp query <targets>
  • Any number of any entities: /kill <targets>

As is well-known, each selector type has default "implicit" arguments. All behavior below will be described in terms of these arguments, not the base selectors themselves.

  • @p, @a, and @r have an implicit type=player, and will fail to parse if given a different type.