Traitement javascript plus rapide

Question

Je viens de poser ma première question et j'ai eu une bonne réponse. Très utile. A m'a aidé à créer ce bit de javascript pour créer deux nombres aléatoires sur la même page.

<script> 
window.onload = function(){ 
generateRandomNumber1(); 
generateRandomNumber2(); 
}</script> 

<script> 
function generateRandomNumber1(){ 
var n = 30; 
var number = Math.floor(Math.random()*n)+1; 
document.getElementById("random1").innerHTML = number; 
} 

function generateRandomNumber2(){ 
var n = 15; 
var number = Math.floor(Math.random()*n)+1; 
document.getElementById("random2").innerHTML = number; 
} 
</script> 

A utiliser également ce bit de script pour montrer les deux divs sur un délai:

<script> 
var toggle = function() { 
$("#loadingContainer1").show(); 
} 
setTimeout(toggle, 1000); 
</script> 
<script> 
var toggle = function() { 
$("#loadingContainer1").hide(); 
} 
setTimeout(toggle, 8000); 
</script> 
<script> 
var toggle = function() { 
$("#loadingContainer2").show(); 
} 
setTimeout(toggle, 7000); 
</script> 
<script> 
var toggle = function() { 
$("#loadingContainer2").hide(); 
} 
setTimeout(toggle, 14000); 
</script> 

vraiment lourd, je sais, mais cela fonctionne, et je suis assez content de moi-même travailler la plupart de moi-même (avec beaucoup d'aide de threads d'autres sur Stack Overflow). De toute façon, tout fonctionne, donc ce n'est pas mon problème, le seul problème est, que le générateur de nombres aléatoires travaille si lentement, que les divs dans lesquels les nombres apparaissent sont généralement venus avant que les nombres aléatoires soient générés . Après avoir actualisé la page plusieurs fois, ils commencent normalement à travailler un peu plus vite, mais est-il possible d'accélérer le processus afin que les nombres aléatoires soient générés dans la première seconde du chargement de la page.

Merci beaucoup.

Answer 1

Il y a BEAUCOUP de code désordonné, mais peut-être parce que onload ne se déclenche pas tant que la page n'est pas complètement chargée. Voici une réécriture de votre code pour mieux fonctionner:

<script type="text/javascript"> 
    $(function() { // uses jQuery's "ready" handler 
     $("#random1").html(Math.floor(Math.random()*30)+1); 
     $("#random2").html(Math.floor(Math.random()*15)+1); 
     $("#loadingContainer1").delay(1000).fadeIn(0).delay(7000).fadeOut(0); 
     $("#loadingContainer2").delay(7000).fadeIn(0).delay(7000).fadeOut(0); 
    }); 
</script> 

Hope this helps!