You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
At least convert home page png and jpg to webp using Squoosh CLI, then replace their <img> elements with <picture> element with <source type="image/webp"> and <img> fallback for older browsers. I have no experience with Jekyll but it seems to be possible to add a Jekyll template for it, right? Then will be easy to replace a few <img> with <picture>.
The webp > png fallback is not possible for background images (full game images). They will stay. If you want them to be compressed (webp is >10x smaller than png) then to support older browsers the background CSS images need to be refactored into <picture> elements.
The 2 is related to #15. It might be possible to use webp>png/jpg without the automation first, possibly with a template file and https://devopsx.com/jekyll-check-if-file-exists/ . If there is no .webp for the image then render a single <img>, otherwise, render the <picture> element with webp and png/jpg.
Activity
mikatuo commentedon Dec 20, 2022
I can help with the load optimizations.
<img>
elements with<picture>
element with<source type="image/webp">
and<img>
fallback for older browsers. I have no experience with Jekyll but it seems to be possible to add a Jekyll template for it, right? Then will be easy to replace a few<img>
with<picture>
.<picture>
elements.The 2 is related to #15. It might be possible to use webp>png/jpg without the automation first, possibly with a template file and https://devopsx.com/jekyll-check-if-file-exists/ . If there is no .webp for the image then render a single
<img>
, otherwise, render the<picture>
element with webp and png/jpg.britzl commentedon Dec 27, 2022
This is a really good suggestion! I'm going to try this!
Yep, moving to webp will definitely improve page load times!