{"id":478,"date":"2019-08-17T18:08:53","date_gmt":"2019-08-17T22:08:53","guid":{"rendered":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/?p=478"},"modified":"2019-08-21T17:22:48","modified_gmt":"2019-08-21T21:22:48","slug":"load-css-asynchronously","status":"publish","type":"post","link":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/2019\/load-css-asynchronously\/","title":{"rendered":"Load CSS asynchronously"},"content":{"rendered":"<p>Came across a short and clear article about loading CSS asynchronously to speed up page rendering.<\/p>\n<p><!--more--><\/p>\n<p><strong>Where:<\/strong> <a href=\"https:\/\/www.filamentgroup.com\/lab\/load-css-simpler\/?utm_source=CSS-Weekly&amp;utm_campaign=Issue-373&amp;utm_medium=email\" target=\"_blank\" rel=\"noopener noreferrer\">The Simplest Way to Load CSS Asynchronously<\/a> by Scott Jehl on the Filament Group blog<\/p>\n<p><strong>What:<\/strong> Please read the whole thing because they give pros and cons of different methods and what those different methods are, but the short and sweet of it is:<\/p>\n<pre><code class=\"html\">&lt;link rel=\"stylesheet\" href=\"\/path\/to\/my.css\" media=\"print\" \r\n    onload=\"this.media='all'\"&gt;<\/code><\/pre>\n<p><strong>Thoughts:<\/strong> I won&#8217;t use this for most of my WordPress websites, there are plugins who take care of the most important optimizations for me, but on sites I build from scratch, this is a very pretty thing.<\/p>\n<hr \/>\n<p>Photo by\u00a0<a href=\"https:\/\/unsplash.com\/@bel2000a?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\">Belinda Fewings<\/a>\u00a0on\u00a0<a href=\"https:\/\/unsplash.com\/search\/photos\/luggage?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText\">Unsplash<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Came across a short and clear article about loading CSS asynchronously to speed up page rendering.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[40,17,39,38],"class_list":["post-478","post","type-post","status-publish","format-standard","hentry","category-new-things","tag-asynchronous-loading","tag-css","tag-loading-times","tag-website-speed","infinite-scroll-item"],"_links":{"self":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/posts\/478","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/comments?post=478"}],"version-history":[{"count":0,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/posts\/478\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/media?parent=478"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/categories?post=478"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.blindemanwebsites.com\/today-i-learned\/wp-json\/wp\/v2\/tags?post=478"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}