Performance Quantitative Testing Old vs. New
This ticket will be used to keep track of comments/discussion aimed at improving performance of the application.
App Performance:
- On Desktop, There is basically no difference on a fast connection/fast device
- Old: 100 Performance Rating in lighthouse (less than 1 second to first meaningful paint)
- New: 100 Performance Rating in lighthouse (less than 1 second to first meaningful paint)
- The major difference between the old interface and the new interface is time to "First Contentful Paint" and "First Meaningful Paint" on a throttled 4G connection.
- Old: First Contentful Paint - 2.0 s, First Meaningful Paint - 3.6 s
- New: First Contentful Paint - 4.2 s, First Meaningful Paint - 4.8 s
- The actual difference in first meaningful paint between old & new is (1.2s), which is the same amount of time difference it took to load the main javascript bundles. So we might just try to reduce the bundle size as much as possible.
- It also looks like there is a period of time in the network tag where nothing is happening (3.2 - 3.8 seconds), where angular is "compiling the module and evaluating the module" , the amount of time to evaluate the angular module/script is about 4 times as long as the old index.js bundle
Map Performance:
- With 2,000 events loaded on my phone,
- Old: interface freezes after each pan, becomes unresponsive for a second or two
- New: interface pans smoothly
- Zooming the map,
- Old: interface flashes when zooming in/out
- New: with vector grid we do not get a flash
Old Application, Lighthouse Report mobile, throttled to 4G speeds earthquake-mobile-4G-applied.pdf
New Application, Lighthouse Report mobile, throttled to 4G speeds beta-mobile-4G-applied.pdf
Edited by Edward J Hunter