Permalink
Browse files

Changing loading of deferred CSS to the flamentgroup's methods (prelo…

…ad + polyfill)
  • Loading branch information...
1 parent 35bdbd2 commit cacc24e40c783c89facce35f03ab067d5dda0428 @futtta committed Feb 21, 2017
Showing with 8 additions and 5 deletions.
  1. +8 −5 classes/autoptimizeStyles.php
@@ -527,7 +527,7 @@ public function getcontent() {
}
} else {
if ($this->defer == true) {
- $deferredCssBlock = "<script data-cfasync='false'>function lCss(url,media) {var d=document;var l=d.createElement('link');l.rel='stylesheet';l.type='text/css';l.href=url;l.media=media;aoin=d.getElementById('aonoscrcss');if(window.location.href.indexOf('ao_nodeferredcss=1') === -1){aoin.parentNode.insertBefore(l,aoin.nextSibling);}}function deferredCSS() {";
+ $preloadCssBlock = "";
$noScriptCssBlock = "<noscript id=\"aonoscrcss\">";
$defer_inline_code=$this->defer_inline;
if(!empty($defer_inline_code)){
@@ -561,7 +561,7 @@ public function getcontent() {
//Add the stylesheet either deferred (import at bottom) or normal links in head
if($this->defer == true) {
- $deferredCssBlock .= "lCss('".$url."','".$media."');";
+ $preloadCssBlock .= '<link rel="preload" as="style" media="'.$media.'" href="'.$url.'" onload="this.rel=\'stylesheet\'" />';
$noScriptCssBlock .= '<link type="text/css" media="'.$media.'" href="'.$url.'" rel="stylesheet" />';
} else {
if (strlen($this->csscode[$media]) > $this->cssinlinesize) {
@@ -573,10 +573,13 @@ public function getcontent() {
}
if($this->defer == true) {
- $deferredCssBlock .= "}if(window.addEventListener){window.addEventListener('DOMContentLoaded',deferredCSS,false);}else{window.onload = deferredCSS;}</script>";
+ $preloadPolyfill = '<script data-cfasync=\'false\'>/*! loadCSS. [c]2017 Filament Group, Inc. MIT License */
+!function(a){"use strict";var b=function(b,c,d){function e(a){return h.body?a():void setTimeout(function(){e(a)})}function f(){i.addEventListener&&i.removeEventListener("load",f),i.media=d||"all"}var g,h=a.document,i=h.createElement("link");if(c)g=c;else{var j=(h.body||h.getElementsByTagName("head")[0]).childNodes;g=j[j.length-1]}var k=h.styleSheets;i.rel="stylesheet",i.href=b,i.media="only x",e(function(){g.parentNode.insertBefore(i,c?g:g.nextSibling)});var l=function(a){for(var b=i.href,c=k.length;c--;)if(k[c].href===b)return a();setTimeout(function(){l(a)})};return i.addEventListener&&i.addEventListener("load",f),i.onloadcssdefined=l,l(f),i};"undefined"!=typeof exports?exports.loadCSS=b:a.loadCSS=b}("undefined"!=typeof global?global:this);
+/*! loadCSS rel=preload polyfill. [c]2017 Filament Group, Inc. MIT License */
+!function(a){if(a.loadCSS){var b=loadCSS.relpreload={};if(b.support=function(){try{return a.document.createElement("link").relList.supports("preload")}catch(b){return!1}},b.poly=function(){for(var b=a.document.getElementsByTagName("link"),c=0;c<b.length;c++){var d=b[c];"preload"===d.rel&&"style"===d.getAttribute("as")&&(a.loadCSS(d.href,d,d.getAttribute("media")),d.rel=null)}},!b.support()){b.poly();var c=a.setInterval(b.poly,300);a.addEventListener&&a.addEventListener("load",function(){b.poly(),a.clearInterval(c)}),a.attachEvent&&a.attachEvent("onload",function(){a.clearInterval(c)})}}}(this);</script>';
$noScriptCssBlock .= "</noscript>";
- $this->inject_in_html($noScriptCssBlock,$replaceTag);
- $this->inject_in_html($deferredCssBlock,array('</body>','before'));
+ $this->inject_in_html($preloadCssBlock.$noScriptCssBlock,$replaceTag);
+ $this->inject_in_html($preloadPolyfill,array('</body>','before'));
}
}

2 comments on commit cacc24e

Owner

futtta commented on cacc24e Feb 21, 2017

@zytzagoo don't know if you're into "inline & defer", if so this will sooner or later go on the main branch ..

Contributor

zytzagoo replied Feb 21, 2017

@futtta thanks for the heads up

Please sign in to comment.