谷歌PageSpeed洞察與多個JavaScript文件

Question

我正在根據Google的PageSpeed洞察優化我的網站。它建議我「移除阻止呈現的JavaScript」爲多個文件（名稱簡化例如的緣故）：

<script src="js/1.js" type="text/javascript"></script> 
<script src="js/2.js" type="text/javascript"></script> 
<script src="js/3.js" type="text/javascript"></script> 

我想Patrick Sexton's "Defer Loading Javascript" approach僅推遲一個文件（defer.js）：

<script type="text/javascript"> 
    function downloadJSAtOnload() { 
    var element = document.createElement("script"); 
    element.src = "defer.js"; 
    document.body.appendChild(element); 
    } 
    if (window.addEventListener) 
    window.addEventListener("load", downloadJSAtOnload, false); 
    else if (window.attachEvent) 
    window.attachEvent("onload", downloadJSAtOnload); 
    else window.onload = downloadJSAtOnload; 
</script> 

我的問題是，這種方法如何修改以包含多個文件（即1.js,2.js,3.js）？

Answer 1

<script type="text/javascript"> 
    function downloadJSAtOnload() { 
     var links = ["js/1.js", "js/2.js", "js/3.js"], 
      headElement = document.getElementsByTagName("head")[0], 
      linkElement, i; 
     for (i = 0; i < links.length; i++) { 
      linkElement = document.createElement("script"); 
      linkElement.src = links[i]; 
      headElement.appendChild(linkElement); 
     } 
    } 
    if (window.addEventListener) 
     window.addEventListener("load", downloadJSAtOnload, false); 
    else if (window.attachEvent) 
     window.attachEvent("onload", downloadJSAtOnload); 
    else window.onload = downloadJSAtOnload; 
</script> 

Answer 2

爲此，您可以使用HeadJS 。我將它用於我們的一個項目，這非常有用。