Saltar al contenido

¿Es posible diferir la carga de jQuery?

Te recomendamos que pruebes esta resolución en un entorno controlado antes de enviarlo a producción, un saludo.

Solución:

Prueba esto, que es algo que edité hace un tiempo del bookmarklet de jQuerify. Lo uso con frecuencia para cargar jQuery y ejecutar cosas después de cargarlo. Por supuesto, puede reemplazar la URL allí con su propia URL para su jquery personalizado.

(function() 
      function getScript(url,success)
        var script=document.createElement('script');
        script.src=url;
        var head=document.getElementsByTagName('head')[0],
            done=false;
        script.onload=script.onreadystatechange = function() this.readyState == 'complete') ) 
            done=true;
            success();
            script.onload = script.onreadystatechange = null;
            head.removeChild(script);
          
        ;
        head.appendChild(script);
      
        getScript('http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js',function()
            // YOUR CODE GOES HERE AND IS EXECUTED AFTER JQUERY LOADS
        );
    )();

Realmente combinaría jQuery y jQuery-UI en un solo archivo y usaría una URL para ello. Si REALMENTE quisiera cargarlos por separado, simplemente encadene los getScripts:

getScript('http://myurltojquery.js',function()
        getScript('http://myurltojqueryUI.js',function()
              //your tab code here
        )
);

Como esta es una pregunta de alto rango sobre un tema importante, permítanme ser tan audaz para brindar mi propia opinión sobre esto basada en una respuesta anterior de @valmarv y @amparsand.

Estoy usando un multidimensional array para cargar los scripts. Agrupando las que no tienen dependencias entre ellas:

var dfLoadStatus = 0;
var dfLoadFiles = [
      ["http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"],
      ["http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js",
       "/js/somespecial.js",
       "/js/feedback-widget.js#2312195",
       "/js/nohover.js"]
     ];

function downloadJSAtOnload() 
    if (!dfLoadFiles.length) return;

    var dfGroup = dfLoadFiles.shift();
    dfLoadStatus = 0;

    for(var i = 0; i

Carga primero jquery después de cargarlo, continúa cargando los otros scripts a la vez. Puede agregar scripts fácilmente agregando a la array en cualquier parte de tu página:

dfLoadFiles.push(["/js/loadbeforeA.js"]);
dfLoadFiles.push(["/js/javascriptA.js", "/js/javascriptB.js"]);
dfLoadFiles.push(["/js/loadafterB.js"]);

Aquí hay una buena descripción del enfoque moderno para la carga asincrónica/diferida de javascript. Pero no funciona para scripts en línea.



@nilskp sugirió la solución más simple para la carga asíncrona: script de externalización:



Si guardas alguna sospecha o forma de arreglar nuestro artículo te insinuamos dejar una explicación y con gusto lo ojearemos.

¡Haz clic para puntuar esta entrada!
(Votos: 5 Promedio: 4)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *