Google Maps библиотеки загрузка блокирует страницу

Question

Я использую следующий HTML-тег для загрузки API Google Maps:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 

Однако, он блокирует погрузочную всё, что ниже его в HTML, пока сценарий не загружаются браузера.

Есть ли способ сделать эту загрузку неблокирующей?

Answer 1

Да, вы можете загрузить его асинхронно. Посмотрите эту часть документов: http://code.google.com/apis/maps/documentation/javascript/basics.html#Async

Answer 2

Этот код дает вам функцию отсрочки, которая берет URL-адрес и дополнительный обратный вызов. Он асинхронно загружает ваш скрипт без блокировки отображения страницы. Я поставил защиту, поэтому он не будет загружать один и тот же scritp дважды, так что вы можете наивно называть его столько раз, сколько захотите.

defer = (function() { 
    var urls = []; 

    return function (url, callback) { 
     var inc; 

     if (url && urls.indexOf(url) === -1) { 
      inc = document.createElement('script'); 
      inc.async = true; 
      inc.src = url; 
      inc.onload = callback || function() {}; 
      document.getElementsByTagName('head')[0].appendChild(inc); 
     } 
    } 
}()); 

defer('http://maps.google.com/maps/api/js?sensor=false'); 

Это работает для любого внешнего javascript, который не прерывается при загрузке async.