Performance Budgets that Stick

A presentation at This.JavaScript: State of Performance in March 2019 in by Tim Kadlec

Slide 1

Slide 1

PERFORMANCE BUDGETS (THAT STICK) TIM KADLEC @TKADLEC

Slide 2

Slide 2

A clearly defined limit on one or more performance metrics that the team agrees not to exceed, and that is used to guide design and development.

Slide 3

Slide 3

A clearly defined limit on one or more performance metrics that the team agrees not to exceed, and that is used to guide design and development.

Slide 4

Slide 4

Slide 5

Slide 5

Slide 6

Slide 6

  1. CONCRETE 2. MEANINGFUL 3. INTEGRATED 4. ENFORCED

Slide 7

Slide 7

  1. CONCRETE

Slide 8

Slide 8

“lightning quick” “as fast as possible” “faster than the competition”

Slide 9

Slide 9

No more than 2 seconds to start render at the 90th percentile on 3G networks.

Slide 10

Slide 10

  1. MEANINGFUL

Slide 11

Slide 11

Slide 12

Slide 12

Slide 13

Slide 13

Slide 14

Slide 14

  1. INTEGRATED

Slide 15

Slide 15

Slide 16

Slide 16

Slide 17

Slide 17

Slide 18

Slide 18

188k 140k

Slide 19

Slide 19

Slide 20

Slide 20

  1. ENFORCED

Slide 21

Slide 21

Slide 22

Slide 22

Slide 23

Slide 23

react + react-dom = 102.4kb

Slide 24

Slide 24

UNIFYING TARGET

Slide 25

Slide 25

Slide 26

Slide 26

THANK YOU! TIM KADLEC @TKADLEC