🥇 Carregamento de script assíncrono

Isso é o que eu uso para carregar scripts de forma assíncrona. É para carregamento de script assíncrono simples, em vez de gerenciamento de dependência total. Para isso, você deve usar algo como o maravilhoso Require.js .

Aqui está um exemplo de quando pode ser útil: carregar a API do Google Maps quando você a estiver usando apenas em uma página do seu site (por exemplo, Contato). Não adianta carregar o script em todas as páginas se você usá-lo apenas em uma.

function asyncLoad(scriptURL,callback)
{
    if(!scriptURL){return;}
    var firstScriptTag=document.getElementsByTagName('script')[0];
    var js=document.createElement('script');
    js.type='text/javascript';
    js.src=scriptURL;
    js.async=true;

    if(callback && typeof(callback)===typeof(Function))
    {
        //Modern browsers (IE9+)
        if(js.addEventListener)
        {
            js.addEventListener('load',callback,false);
        }
        else//(IE8-)
        {
            js.onreadystatechange=function()
            {
                if(js.readyState in {loaded:1,complete:1})
                {
                    js.onreadystatechange=null;
                    callback();
                }
            };
        }
    }

    firstScriptTag.parentNode.insertBefore(js,firstScriptTag);
}

Uso:

asyncLoad('some/local/script.js',someFunction);
function someFunction()
{
    //script.js loaded
}

asyncLoad('http://code.jquery.com/jquery-1.8.0.min.js',function()
{
    //$===jQuery
});

Agradecimentos especiais a Stoyan Stefanov, cujo artigo inspirou a maior parte do código na função acima.

Uso:

Related Posts