rel=preload

For technical support for all editions of CSS HTML Validator. Includes bug reports.
User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 600
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: rel=preload

Post by RSteinwand » Mon Apr 25, 2016 6:42 am

I want to get a few things done today, then I'll update my public side (in development only) with just this and see what works, if anything. Then I want to tweak the javascript on all the pages a bit. Previous script worked nicely, but didn't work in IE8.

I should know more tomorrow.
Rick

User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 600
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: rel=preload

Post by RSteinwand » Mon Apr 25, 2016 7:43 am

With just the preload css and no supporting javascript, it works in Chrome 50, but not in FF 46 (beta) or Edge/IE11 from fast ring of Windows 10.

I didn't have webkit version of Opera installed, but based on CanIUse, I suspect it probably works there too.
Rick

User avatar
Albert Wiersch
Site Admin
Site Admin
Posts: 3451
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: rel=preload

Post by Albert Wiersch » Mon Apr 25, 2016 8:06 am

Thanks Rick! I think I'm going to start using rel="preload" on my site for a typeface........ as soon as I get to it. :)
Image
Albert Wiersch

User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 600
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: rel=preload

Post by RSteinwand » Tue May 03, 2016 11:10 am

There's a bug with rel=preload in Chrome (which should be fixed any day now) where the style sheet is loaded twice, just a performance problem.

There's also a bug that affects IE8 (you see the print style sheet) if you use the LoadCss script with it. That one does concern me and I've rolled back my code, hoping for a quick fix. (A print style sheet for me means no menus.)

Otherwise I'm enjoying about .2 second performance increase using this and a similar increase by using async defer on pages with only one external script. (IE8/9 can't use async, which is why I use both)
http://caniuse.com/#feat=script-async
http://caniuse.com/#feat=script-defer

I currently have the external script (with async defer) in the head but the inline script that loads the post-loaded external css at the bottom (to prevent requiring multiple round trips to load the visible area). They suggest adding that to the head as well so I'll have to see if there's any benefit to having that script in the head. https://github.com/filamentgroup/loadCSS
Rick

Post Reply