Skip to content

Blog

Tailwind CSS at build time, zero at runtime

Details
Date:
Author:
Black Bao Studio
Topics:
Tailwind CSSPerformanceDesign

Utilities are scanned from the templates and compiled into one stylesheet per section. The browser never sees a class it does not use, and it never runs a line of styling JavaScript.

Tailwind CSS gets a bad name from projects that ship the play CDN and let the browser generate styles at runtime. Compiled ahead of time it is the opposite: the scanner reads the source, emits only the utilities that appear, and the result is a small, static stylesheet that caches for a year.

The one discipline it demands is that every class stays literal in the source. A utility assembled from string pieces is never generated and the element silently keeps its default. Templates here use lookup objects of complete class strings and interpolate the key, never the class.

All posts