4. MPAs
“Multiple-page applications work in a ‘traditional’ way.
Every change e.g. display the data or submit data back to
server requests rendering a new page from the server in
the browser.” - Paweł Skólsk
https://goo.gl/7Zjyh8
41. Measuring performance
RAIL Instant feedback
Input latency < 100ms
Run at 60fps
Each frame’s work < 16ms
Schedule work
Main thread work chunked < 50ms
Performance budgets
42. Measuring performance
RAIL Instant feedback
Input latency < 100ms
Run at 60fps
Each frame’s work < 16ms
Schedule work
Main thread work chunked < 50ms
Render critical path
< 1000ms
Performance budgets
55. Monitoring performance
RAIL Interaction response timings
Performance mark / measure (Chome 43+)
Long tasks / dropped frames
PerformanceLongTaskTiming (Chrome 58+)
First paint / First contentful paint
PerformanceObserver (Chrome 60+)
Chrome performance
APIs
56. Monitoring performance
RAIL Interaction response timings
Performance mark / measure (Chome 43+)
Long tasks / dropped frames
PerformanceLongTaskTiming (Chrome 58+)
First paint / First contentful paint
PerformanceObserver (Chrome 60+)
Chrome performance
APIs
Hero elements
Currently being worked on
57. Monitoring performance
RAIL Interaction response timings
Performance mark / measure (Chome 43+)
Long tasks / dropped frames
PerformanceLongTaskTiming (Chrome 58+)
First paint / First contentful paint
PerformanceObserver (Chrome 60+)
Chrome performance
APIs
Hero elements
Currently being worked on
Time to interactive
Polyfill https://goo.gl/YNbcU7
58. Monitoring performance
RAIL Interaction response timings
Performance mark / measure (Chome 43+)
Long tasks / dropped frames
PerformanceLongTaskTiming (Chrome 58+)
First paint / First contentful paint
PerformanceObserver (Chrome 60+)
Chrome performance
APIs
Hero elements
Currently being worked on
Time to interactive
Polyfill https://goo.gl/YNbcU7https://goo.gl/iKifq9