Developer Update: Improving Compression & Google Stuff (Patreon)
Content
Today I spent a ton of time tackling a few key issues, specifically around bandwidth consumption & web vitals (via google).
Bandwidth consumption is pretty much the number #1 contributor to costs, and compressing images can be challenging. I did some fine tuning on the compression that the server does today but the output is still not satisfactory enough for googles page speed insights to give an A grade on mobile. However, it's still a huge improvement.
Secondly, images for series are now served up at the appropriate resolution, and there are several new thumbnail columns on the backend that were populated during the downtime today. I'm hoping that the changes will help lower bandwidth consumption to a more sustainable level. Alternatively, we'll get an invite to Cloudflare Images Beta which may fix the issue by offloading them images to them to process via their network (and serve webp). S3 \ Lambda is just too pricey to handle this with what little budget is available.
Another improvement made today was the introduction of improved skeleton loaders on core pages (waifus, series) which allow google to give us a pass on core vitals. Previously, 90% of pages were failing CLS due to the sudden "jump" when Vue populates the page. To respond to this, new items were added early to the layout to help scaffold it, which are then unloaded when Vue is ready (it simply deletes the node). This solves the issue on both Desktop & Mobile for both CLS measurements.
JSON-LD was improved today as well to (hopefully) help boost our SEO score by relating waifus to series they belong to.
Finally, direct image links which were broken (would attempt to download files) are currently being processed on the backend so the browser understands to show an image, not attempt a download.
Let's hope these improvements set us up to get back to being sustainable next month! And let's hope we can get some more of that good ol' domain authority while we're at it!