DEV Community

Discussion on: I rebuilt my portfolio🌻 Now it loads in 1.6s πŸŽ‰ Here's how I did

marksampson10 profile image
Mark Sampson

This is good stuff.. although, the stylesheets still load, even with a media attribute. Combining css into fewer sheets/links, and keeping the media queries in the stylesheet, is proving to be the fastest way to load.

saurabhdaware profile image
Saurabh Daware 🌻 Author

Hi Mark, I just checked my network tab and mobile.css is not really getting any request when I turn to desktop view.

Mobile view
mobile view of with network tab open

Desktop View
desktop view of with network tab open

I'm not really sure about the browser support or for any gotchas in this but apparently this is how it works in new browsers.

Thank you for reading the article 🌻

simonced profile image

I have a question on that matter.

If a user loads the website on phone in landscape that has more that 768px,
then rotates the screen into portrait, will the mobile.css file be loaded and applied?

That could make a big difference in my work. I could try that on my next project.

Thread Thread
saurabhdaware profile image
Saurabh Daware 🌻 Author

No, it won't be loaded by default since the media is checked on the loading time. However, you can actually call a javascript function which will add that link to head dynamically when a user rotates the screen but it depends if it fits your project needs