Différer l'analyse de JavaScript - Google Page Speed

Je vois c'est une vieille question, mais depuis que je suis à la recherche pour une bonne réponse moi-même, je vais partager la méthode que j'utilise actuellement.

Autant que le Javascript en ligne est concerné, ce que j'ai à faire est de changer tous les type attributs de text/deferred-javascriptou quelque chose de similaire, de sorte que le code dans la balise script n'est pas évaluée lors du chargement de la page. Puis-je joindre une fonction à la page onload de l'événement; la fonction trouve tous les scripts correspondant au type ci-dessus et évalue le code à l'intérieur à l'aide de eval(). Je sais en général eval() est mal, mais il semble être utile ici.

Pour les fichiers Javascript externes, - je faire quelque chose de très similaire. Au lieu d'ajouter les balises de script de la page, je de les enregistrer et de les ajouter un par un après chargement de la page est terminé.

Un problème que je vais avoir, c'est que si l'un des inline différés Javascript contient une erreur (par exemple, une erreur d'analyse), les scripts ne sont pas chargés (mais ça dépend peut-être de mon actuel de mise en œuvre).

Salut nous avons récemment créé une opensource nodejs cadre appelé "cadre élégant" que vous aider à la construction rapide d'applications web et nous avons réussi à obtenir 100% de google page speed à la fois de bureau et mobiles dans toutes les pages :
vous pouvez le vérifier sur:

https://developers.google.com/speed/pagespeed/insights/?url=getelegant.com

il y a beaucoup de choses que vous pouvez apprendre de lui en affichant le code source de la page aussi, si quelque chose vous ne pouvez pas comprendre s'il vous plaît commentaire donc je peux vous aider avec

jusqu'à présent, vous pouvez essayer cette méthode:

//Load script element as a child of the body
function loadJS(src, callback) {
var script = document.createElement("script");
script.type = "text/javascript";
if (script.readyState) {  //IE
script.onreadystatechange = function () {
if (script.readyState == "loaded" || script.readyState == "complete") {
script.onreadystatechange = null;
if (callback) {
callback();
}
}
};
} else {  //Others
script.onload = function () {
if (callback) {
callback();
}
};
}
script.src = src;
document.body.appendChild(script);
}
//Load style element as a child of the body
function loadCSS(href,callback) {
var element = document.createElement("link");
element.rel = "stylesheet";
if (element.readyState) {  //IE
element.onreadystatechange = function () {
if (element.readyState == "loaded" || script.readyState == "complete") {
element.onreadystatechange = null;
if (callback) {
callback();
}
}
};
} else {  //Others
element.onload = function () {
if (callback) {
callback();
}
};
}
element.href = href;
document.body.appendChild(element);
}
//Load All Resources
function loadResources() {
//css
loadCSS("/compressed/code-mirror-style.css?please1");
loadCSS("/compressed/all.css?please2");
//js
loadJS("/compressed/code-mirror.js", function () {
loadJS("/compressed/common.js", function () {
$("[data-lang]").each(function () {
var code = $(this).addClass("code").text();
$(this).empty();
var myCodeMirror = CodeMirror(this, {
value: code,
mode: $(this).attr("data-lang"),
lineNumbers: !$(this).hasClass('inline') && !$(this).hasClass('no-numbers'),
readOnly: true
});
});
});
});
}
//Check for browser support of event handling capability
if (window.addEventListener) {
window.addEventListener("load", loadResources, false);
} else if (window.attachEvent) {
window.attachEvent("onload", loadResources);
} else {
window.onload = loadResources
}