max.hn

About me Notes
Menu
Max ·

With most traffic coming from mobile devices and therefore small screens, are there any websites that have put “desktop” styles in a separate file and only load it, if the media query matches?

Something like this?

<link
  href="big-screens.css"
  media="(min-width: 800px)"
>

This would remove render blocking by desktop styles when mobile devices visit the website. They are still being downloaded, but don’t block the time to first paint.

I don’t know any websites that do this yet, but maybe I just haven’t found them?

You can follow my Notes using any RSS reader — my personal favorite is Reeder.