css延迟加载

application/third_party/htmlcompressor/controllers/index.php

@@ -61,6 +61,14 @@ class Index extends CI_Controller {
                 } else {
                     //网页内的js不需要提取
                     //$js_content.= $link_script->innertext;//js的内容
+                    // $js_content.= $link_script;//js的内容，包含<script>标签
+                    
+                  //  $link_script_content=$link_script->outertext;
+                    //含有$表示调用了jquery的函数，添加延迟加载defer
+                  //  if(strpos( $link_script_content,'$')!==FALSE){
+                  //     $link_script_content= str_replace('defer','defer',$link_script_content);
+                  //     $link_script_content= str_replace('<script','<script defer',$link_script_content);
+                  //  }
                     $js_content.= $link_script;//js的内容，包含<script>标签
                     $link_script->outertext = ''; //删除js，移动到页底
                 }
@@ -90,11 +98,11 @@ class Index extends CI_Controller {
 
 //在最后加载原始css文件和js文件
             //把css移动到页面底部，延迟加载
-            $lastload_js = '<script type="text/javascript" defer>';
+            $lastload_js = '<noscript id="deferred-styles">';
             foreach ($link_css_array as $item) {
-                $lastload_js.='var elem=document.createElement("link");elem.rel="stylesheet";elem.type="text/css";elem.href="' . $item . '";document.body.appendChild(elem);';
+                $lastload_js.='<link rel="stylesheet" type="text/css" href="'.$item.'"/>';
             }
-            $lastload_js.='</script>';
+            $lastload_js.='</noscript><script>var loadDeferredStyles=function(){var addStylesNode=document.getElementById("deferred-styles");var replacement=document.createElement("div");replacement.innerHTML=addStylesNode.textContent;document.body.appendChild(replacement);addStylesNode.parentElement.removeChild(addStylesNode)};var raf=requestAnimationFrame||mozRequestAnimationFrame||webkitRequestAnimationFrame||msRequestAnimationFrame;if(raf){raf(function(){window.setTimeout(loadDeferredStyles,0)})}else{window.addEventListener("load",loadDeferredStyles)};</script>';
             //把js移动到页面底部
             foreach ($link_js_array as $item) {
                 $lastload_js.='<script  src="' . $item . '"></script>';