v0.1.5
This release mostly addresses fonts and adds an experimental "Tailwind JIT" transformation to styles. It also might potentially introduce a breaking change by replacing the prefetch
setting by preload
.
huge/Fonts: performance optimization with preload
and more!
preload
A past mistake was to use prefetch
in order to direct browsers to load the font files ASAP. This has been corrected by implementing a preload
setting and retiring prefetch
. Huge will no longer use rel="prefetch"
for fonts "preloading". but a rel="preload"
along side other proper attributes:
<link as="font" crossorigin="anonymous" href="/fonts/my-font.woff2" rel="preload" type="font/woff2">
WARNING: This for now is limited to woff2
files as this is the most supported, most efficient format. Other file formats won't be "preloaded".
Only preload
certain fonts.
It's good practice to only preload certain font files (needed above the fold, or on most of the pages), so while by default, Huge will preload every woff2
file, users can overwrite the preload
setting as per declaration regardless of the global preload
setting.
fonts:
- family: Open
preload: false
file: fonts/OpenSans-ExtraBold
weight: 900
style: normal
@font-face
src
list order.
It recently came to the attention of this project's maintainers that the browser will load the first "supported" font file from the @font-face
declaration! So listing the font files in alphabetical order would result in woff
being used instead of the much better woff2
and for projects also using ttf
, making the much heavier ttf
used over woff
or woff2
.
From now on, Huge will declare the font files in the following order: woff2
, woff
, ttf
, svg
, eot
.
huge/Styles: Tailwind JIT
This is an experimental feature based on the work of @Gioni06 detailed here. It allows Hugo users to upgrade to Tailwind 3 pending resolution of gohugoio/hugo#8343
This won't be documented while it's experimental but you should know using this will generate a new resource in your resource/_gen
directory every time you save. It's perfectly fine if like many your whole resource folder is ignored by git, but be aware and use it at your own risk.
It introduces a new transformation called tailwind-jit
for use in the use
array of a registered style.
Feel free to discuss or share feedbacks on this experiment on the release's discussion
What's Changed
- Fonts: Fine-tune
preload
, retireprefetch
by @regisphilibert in #64 - Allow per-declaration
preload
setting by @regisphilibert in #66 - WIP: Add tailwind-jit transformation by @regisphilibert in #58
Full Changelog: v0.1.4...v0.1.5