4 ms·
A lightweight website doesn't have to be boring. My current project has a 1920x1080 picture which is only 29KiB with AVIF (and it'll further reduce in size when
by pdenton 5y ago
A lightweight website doesn't have to be boring. My current project has a 1920x1080 picture which is only 29KiB with AVIF (and it'll further reduce in size when I crop it for smaller displays, using the picture element with media queries). There was 5,7KiB worth of SVG icons and I turned it into a 2KiB font. Not the best of savings, but still better (although correct sizing and positioning of font icons is somewhat difficult).
- nicbou 5y agoI found that inlining SVGs is a lot faster than loading an external font, because of the server round trip.
- pdenton 5y agoYou can inline a font as well, just use the data: URI. I do this only for really small font files, such as the icons, and having the above-the-fold CSS in a style tag means the font comes with the HTML request.