2013-04-08 6 views
2

Как вы, наверное, знаете, Google PageSpeed Insights хочет отложить ваш javascript.Окончательное решение для откладывания javascript и jquery после загрузки страницы

Google сам suggests a solution перенести код:

<script type="text/javascript"> 
    function downloadJSAtOnload() 
    { 
     var element = document.createElement("script"); 
     element.src = "deferredfunctions.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> 

Конечно это хорошее решение, но это далеко от реальных обстоятельств (многие сценарии включают в себя, код для выполнения, и т.д ...)

Strating из примера:

<html> 
    <head> 
    </head> 
    <body> 
     <script type='text/javascript' src='...'></script> 
     <script type='text/javascript' src='...'></script> 
     <script type='text/javascript' src='...'></script> 
     <script type='text/javascript'><!-- 
      // some code 
      $(document).ready(function(){ 
       // code to execute when the page is ready 
      }); 
     --></script> 
    </body> 
</html> 

вопрос: Как применить предложение Google в приведенном выше примере?

+0

учитывая, что ваш второй образец требует, чтобы jquery загружался для выполнения, вы не получите многого. «загрузите JS, чтобы вы могли отложить загрузку JS». –

+0

Вы правы Марк, но Google PageSpeed ​​не говорит то же самое. Он продолжает показывать мне совет: «отложить выполнение JavaScript до загрузки страницы». Как вы думаете, я могу это пропустить? –

ответ

0

Пример Google может работать для нескольких сценариев, если у вас есть downloadJSatOnload, чтобы добавить несколько элементов сценария на страницу, а затем вызвать код, который вы обычно ставите в $(document).ready(function() { ... });. Этот код можно вызвать явно или загрузить последний файл.

+0

Я попытался применить это решение. Все сценарии jquery работают (слайд-шоу, карта, проверка формы), но я получил ошибку «Uncaught ReferenceError: $ is not defined». Это похоже на то, что готовый блок выполняется перед всеми скриптами, но все работает одинаково. Как это возможно? –

+0

В IE8 он генерирует ошибку –

+0

Можете ли вы отредактировать вопрос, чтобы включить код, который вы пробовали? Кроме того, см. Некоторые связанные вопросы, они очень похожи на этот и могут дать некоторые идеи. –

 Смежные вопросы

  • Нет связанных вопросов^_^