This article is written for interview / documentation purposes. If you have any questions about the content please contact me.

esports.htc.com

This is a consulting project done for HTC (from June 2017 to August 2018). Our collaboration started from the dissatisfaction of the previous esports website. We stepped in very quickly to provide necessary resources to remedy the situation.

The website is quite simple compared to our other projects, so we focussed on the basics to create the best experience for the client and their users. Their requirements are: an editable website where they can publish articles, post updates about esports teams, view their social media and host gaming tournaments.

Since we needed a CMS for the client, we chose a flat-file CMS (grav) and made a custom template. Using this makes the website easier to scale without having to worry about databases.

Here's a recent lighthouse report:

Aside from the missing PWA functionality, the website scores top marks in all categories. The website is served from California yet loads very quickly almost anywhere without a global CDN. This is thanks to:

  • Careful consideration of image sizes (grav resizes them for different viewports)
  • Use of modern image formats such as webp
  • Aggressive caching
  • HTTP/2, making use of server push
  • Cutting down on unnecessary JS/CSS bloat

The result is a fast and snappy website.

Some future considerations we could consider:

  • Load images through a specialised CDN to further compress/optimise size
  • Add a CDN
  • Implement AMP for articles

gaming.htc.com (prototype)