LukePrior / nbn-upgrade-map

Interactive map showing premises eligible for the NBN FTTP upgrade program.
https://nbn.lukeprior.com/
MIT License
134 stars 11 forks source link

Improve mobile site performance #203

Open LukePrior opened 1 year ago

LukePrior commented 1 year ago

image image

https://pagespeed.web.dev/analysis/https-lukeprior-github-io-nbn-upgrade-map/oo8n14u5jd?form_factor=mobile

lyricnz commented 1 year ago

Related https://github.com/LukePrior/nbn-upgrade-map/issues/82

lyricnz commented 12 months ago

It may be worse now

image

And it's not great on Desktop either

image

But that may just be a bad cache-miss

image
LukePrior commented 11 months ago

I think as long as it's all hosted on GitHub we will have some limitations but I'm not seeing many complaints about performance...

LukePrior commented 11 months ago

Will wait for 28 days from service worker rollout to see if that helped at all.

LukePrior commented 10 months ago

Seems to have improved on both to acceptable levels for everything but INP

LukePrior commented 7 months ago

Now that INP is a core metric, I focused on reducing the blocking main thread work when loading the markers into Leaflet.

This has helped slightly and it seems to be trending down over the last week, will need to wait for complete 28 day period to confirm.

Mobile image

Desktop image

LukePrior commented 5 months ago

INP is good on desktop now but on mobile it's still not great, but I think to get it any lower is going to require significant engineering effort potentially writing a webgpu driver but I don't really feel like doing that. Screenshot_20240520_190912_Brave Screenshot_20240520_190904_Brave

LukePrior commented 2 months ago

Screenshot_20240826_214126_Brave Screenshot_20240826_214118_Brave

Desktop remains completely stable and good, mobile fluctuates more than I would expect. Trending positively for LCP, and INP but regressing on CLS.

Any specific suggestions for site improvement are welcome.

LukePrior commented 2 months ago

I've migrated the site to a custom domain with CloudFlare proxy enabled, also utilising jsDelivr CDN for distribution of files which should both help performance a bit.

LukePrior commented 2 months ago

Future optimisations might include a better leaflet renderer including for clustering and additional compression of source files