Skip to content
This repository has been archived by the owner on Jun 10, 2023. It is now read-only.

[Feature Request] Some optimizations and lazy loading of images #410

Open
theKAKAN opened this issue Jan 9, 2023 · 0 comments
Open

[Feature Request] Some optimizations and lazy loading of images #410

theKAKAN opened this issue Jan 9, 2023 · 0 comments

Comments

@theKAKAN
Copy link

theKAKAN commented Jan 9, 2023

A list of things that we can do:
JS:

  • Load Prism.js separately, preferably from a popular CDN. This increases a chance of hitting a cache.
  • Don't load Prism.js unless there's some code (or load it as async/deferred)

CSS:

  • Load fonts from a popular CDN cache instead of bundling it in.

Images:

  • Adding loading="lazy" to image tags might be better.
  • srcset attribute for <img> is now well-supported by most modern browsers, and we can have both src and srcset as a fallback.
  • Convert images to WebP when hugo builds the server files. I imagine this would be required for implementing srcset as well, so might as well do it...

For the images part, there seems to be a well-made hugo module available: https://github.com/hugo-mods/lazyimg
A resource on srcset with hugo would be: https://cconcannon.medium.com/hugo-shortcodes-to-process-your-images-4f66c1d9a91b

I host my instance at kakan.omg.lol, however, I receive a score of around 80 because the images served are too big. It's my fault, but this would still be very good to see added! :)

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant