Optimizing Front-end Performance
June 26, 2018
As a front-end web developer, my goal is to focus on the user experience and an essential part of a good experience is performance. It’s especially important considering that over 50% of people abandon a website if it takes more than 3 seconds to load. I've come to learn that every small bit of optimization adds up to significantly impact user satisfaction.
Improving performance starts before the project even begins: picking tools, languages, and frameworks to develop with. For example, choosing a lightweight CSS framework like Bulma or Basscss over Bootstrap. Or leaving out jQuery if possible (although it's often worth the weight). And my favorite example: throwing WordPress in the trash where it belongs and using static site generation instead.
After doing all of the above, I'll use tools like PageSpeed Insights, Lighthouse, and Varvy for audits and improve as much as I can. I also use a performance checklist like this one: https://github.com/thedaviddias/Front-End-Performance-Checklist. No website will be perfect in terms of performance and many times it's a trade-off between functionality, but by implementing these techniques I can get most of the way there.