Defer attribute doesn't work with Google Maps API?

Question

I\'m trying to make sure the Google map is the last thing that loads on the page and doesn\'t affect the performance of the page negatively.

When the defer attribu

Answer 1

When you use defer you must use the asynchronous version of the API:

<script defer 
  src="http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize">
</script>

The issue:
when you use defer the script will be loaded when the document is closed- the content has been loaded. Furthermore external deffered scripts will be parsed after inline defferred scripts.

This has two side-effects related to your implementation:

1. you can't use the synchronous version of the API, because it makes use of document.write , which can't be used after the document has been closed

2. the call :

   google.maps.event.addDomListener(window, 'load', initialize); 
   

   ...comes at a point where the Maps-API isn't loaded yet, google is undefined, initialize will never be executed.