Optimizing Portfolio FCP with Local Tailwind and FontsOptimizing Portfolio FCP with Local Tailwind and Fonts
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Optimized my portfolio's First Contentful Paint from 2.6s to 0.2s today.
Two things were blocking render:
The Tailwind CDN, which loads a ~400KB script and generates CSS at runtime.
Google Fonts, which adds a DNS lookup and TLS handshake to a third-party domain on the critical path.
Fix one: compiled Tailwind locally into a 4.4 KiB static stylesheet. Only the classes actually used, no runtime.
Fix two: self-hosted Inter via @fontsource-variable/inter so the font loads from my own domain.
Also deferred the interactivity script so it downloads in parallel with HTML parsing instead of blocking paint.
Result: 0.2s FCP on desktop, 1.5s on emulated slow 4G. Both inside Google's "good" threshold.
Post image
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started