Skip to content

v0.1.5

Compare
Choose a tag to compare
@regisphilibert regisphilibert released this 30 Mar 19:22
· 11 commits to main since this release
c7ac985

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

Full Changelog: v0.1.4...v0.1.5