Test de la vitesse de javascript

php.jpg Dans le cadre d'un petit développement amateur, on se posait la question de savoir si le javascript serait assez rapide pour modifier des centaines d'éléments de la page sans marquer de gros lag ou de temps d’arrêt.

Le test est le suivant:

Il y a 1000 lignes dans ce genre;

  1. <article id="1">
  2.                 <span name="ligne">1</span>
  3.                 <span name="code">DZPDSnELpc4LyGf</span>
  4. 	</article>
  5. 	<article id="2">
  6.                 <span name="ligne">2</span>
  7.                 <span name="code">Y8N6RhiKesWH7pd</span>
  8. 	</article>

(etc...)

Il doit incrémenter toutes les valeurs. A chaque ligne <article> le second span est une chaine aléatoire, juste pour alourdir la page et se rapprocher du code html du développement en cours, mais c'est sans intérêt en fait..

Je vous mets le script de test là http://blog-du-grouik.tinad.fr/public/script/test.php Cliquez sur "Tout décaler" pour le lancer.

Voici la source du fichier.

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  2.     "http://www.w3.org/TR/html4/strict.dtd">
  3. <html lang="fr">
  4. <head>
  5.     <title>Test</title>
  6.     <style type="text/css" media="screen">
  7. 	article {display:block; }
  8. 	a {cursor: pointer;}
  9.     </style>
  10. <script type="text/javascript">
  11. 	function decaletout()
  12. 	{
  13. 		eltr=document.getElementById("doc").firstChild;
  14. 		do
  15. 		{
  16. 			if (eltr.nodeName == 'ARTICLE')
  17. 			{
  18. 				eltr.id= parseInt(eltr.id) + 1;
  19. 				eltspan=eltr.firstChild;
  20. 				while (eltspan.nodeName != 'SPAN')
  21. 				{ eltspan=eltspan.nextSibling;}	
  22. 				//alert(eltspan.innerHTML);
  23. 				eltspan.innerHTML = parseInt(eltspan.innerHTML) + 1;	
  24. 			}
  25. 		eltr=eltr.nextSibling;	
  26. 		}while(eltr!=null);
  27. 	}
  28. </script>
  29.  
  30. </head>
  31. <body>
  32.   <p><a onclick="decaletout();">Tout decaler</a></p>
  33.     <div id="doc">
  34. <?php
  35. function generateHashtag($c)
  36. {
  37. 	//les caracteres utilises:
  38. 	$b=array('0', '1', '2', '3', '4', '5', '6', '7', '8','9', 'a', 'b', 'c','d', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u','v','w','x','y','z', 'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');
  39. 	$randomfilename="";
  40. 	for ($i=0; $i<$c; $i++){
  41. 		$randomfilename=$randomfilename.$b[rand(0,count($b))];
  42. 	}
  43. 	return $randomfilename;
  44. }
  45. for($i=1;$i<1000; $i++)
  46. {
  47. 	echo "	<article id=\"".$i."\">
  48.                 <span name=\"ligne\">".$i."</span>
  49.                 <span name=\"code\">".generateHashtag(15)."</span>
  50. 	</article>\n";
  51. }
  52. ?>
  53.     </div>
  54. </body>
  55. </html>

Le résultat est sans appel, c'est super rapide. Donc pour le petit développement amateur, on ne renverra pas le contenu de la page en php suite au décalage de lignes :D.

Si ça c'est pas un truc de geek, programmer quelque chose juste pour un test!?

gnieark lundi, janvier 3 2011, 19:43 dev web
Page top