Traditional script tags in browsers require waiting for the script to download, parse, and execute before rendering subsequent HTML content. However, with asynchronous scripts, the browser can continue parsing and rendering HTML without waiting for the async script to finish. Asynchronous scripts are fetched quickly but executed when the browser's UI thread is not busy.
It's worth noting that the javascript file at maps.googleapis.com/maps/api/js is dynamic, serving different js files based on parameters.
function getScript(src) {
document.write('<' + 'script src="' + src + '"' +
' type="text/javascript"><' + '/script>');
}
Synchronous script loading requires waiting for complete load before executing, while asynchronous loading allows execution after the document is fully loaded. When using "callback=initialize" to load a script, the self-executing function already includes the initialize callback and a modified function for further asynchronous script loading.
For more details on loading Google Maps asynchronously, check out this related ticket: Loading google maps asynchronously