What does the JIT (Just-In-Time) compiler do in Tailwind?
The JIT compiler in Tailwind is responsible for instant, on-demand class generation, meaning it creates CSS styles only for the utility classes that actually occur in the project, and it does this during development, not in advance.
Why this is needed
Before JIT, Tailwind generated a huge CSS file with every possible utility. After JIT appeared, the approach changed:
| Before (old mode) | Now (JIT) |
|---|---|
| all utilities are generated in advance | only what is used is generated |
| a large final CSS | a minimal CSS |
| no instant reaction to new classes | a new class appears instantly |
What JIT specifically does
1. Generates styles "on the fly" Every time a new utility class appears in HTML/JSX/Blade/Vue and so on, Tailwind immediately creates CSS for it, without restarting the build.
2. Supports arbitrary values You can write it like this, and JIT will generate the rule automatically:
<div class="w-[37%] bg-[#3b82f6] mt-[13px]"></div>This was not possible in the old mode.
3. Greatly reduces the final CSS Because JIT does not generate "junk": only what is actually used.
4. Speeds up development Updates appear instantly, without waiting for a long recompilation.
How the JIT pipeline works internally
You change the HTML/JSX/template
↓
JIT scans the classes
↓
Generates the missing utilities
↓
PostCSS runs the remaining plugins (autoprefixing / minification)
↓
The updated CSS is delivered to the browserFinal definition
JIT in Tailwind is a compiler that generates CSS rules dynamically, only for the classes in use, instantly updating the result as the project changes.
If you like, I can continue with questions about Purge, Tailwind's config, its pros and cons, or best practices.
Short Answer
Interview readyA concise answer to help you respond confidently on this topic during an interview.