Questlog 0.26 — Optimizations

Sometimes a release is a bit smaller. This is one of these releases so I don’t really have to say much. But I address some things I wanted to do for a while.

Performance optimiziations

One thing is pretty much a main performance issue. Or better… it was. When I started with Questlog my understanding of polymorphic many to many relationships in Laravel was a bit… let’s say non-existant. A coworker explained it once to me and a week after I built the play status implementation of Questlog. It was not optimal to say it gently.

Every single game asked for their status for the current user on every page. Classic N+1 problem. A game listing with 1 game? 2 database queries. A game listing with 10 games? 11 database queries. 100? games? 101 database queries. I had to reduce the game count to a pretty low number.

The optimization of this and the optimization of the general game card size has enabled me to clean this up. All game listings across Questlog now have always 24 games and everything is much faster now. So fast in fact, that I could drop the cache from pretty much every game listing without a noticeable difference. Except for my code, that is much cleaner now. Cache invalidation is definitely no fun task. Database indexes and smarter queries on the other side are pretty fun actually.

UI optimiziations

Until now every game listing had it’s own game count as the UI was always a bit different. The search UI had 5 games next to each other playlists 7 and the featured sections on the home page or similar games on a game page had 8.

On mobile it was always 2 or 3. And 2 next to each other seemed pretty big. So I got asked multiple times if I could make it always 3 games per row on mobile. Glad you asked, so I was motivated to clean this up.

On bigger screens it’s always 8 or 6 now. 6 if there’s a sidebar, 8 if there’s no sidebar. On mobile it’s always 3 now. And as this is pretty predictable now, it’s 24 games on all pages, as 24 is dividable by 3, 6 and 8 at the same time. In the future I will add a user setting so you can select 48 and 72 per page as well. As this is a performance concern on slower devices 24 will stay the only option until then.

Here are some comparisons

Changelog

As always, here’s the unfiltered changelog with the stuff I didn’t mention.

Features

  • It’s now possible to the profile of the currently logged in user via /u/me

Improvements

  • The status the currently logged in user has selected for visible games is retrieved much more performant now
  • Change the base sizing of game cards so that they’re always about the same
  • Every game listing has now 24 games per page
  • Reduce file size for images in game cards
  • Optimize the sizing and spacing across the whole site to look more uniform
  • Improve manifest file to improve PWA capabilities
  • Optimize database structure to remove the need for caching games

Fixes

  • Fix bug where the listing filter was in a modal on iPads despite the fact there was enough room for the filters
  • Images in video cards should now always fill the whole width
  • Add missing aria-label for alternative names