Discussion :

[Invité]

Bonjour,

Voulant dessiner quelques fractales, je me pose des questions sur FireFox.
Voici Mendelbrot dans 1 table de 200 lignes contenants 200 cases, bref 40000 cases!



Voici un test de création de 22500 "div" sous divers navigateurs:

FireFox (3.6.10) : Res: 150, pixel: 2, nbDiv: 22500, Délai calcul: 12364 ms, Délai fonction: 14802 ms
Opera (10.62) : Res: 150, pixel: 2, nbDiv: 22500, Délai calcul: 439 ms, Délai fonction: 446 ms
Safari (5.0.2) : Res: 150, pixel: 2, nbDiv: 22500, Délai calcul: 352 ms, Délai fonction: 355 ms
IE8 : Res: 150, pixel: 2, nbDiv: 22500, Délai calcul: 1140 ms, Délai fonction: 2812 ms
Chrome (6.0.472.63) : Res: 150, pixel: 2, nbDiv: 22500, Délai calcul: 426 ms, Délai fonction: 431 ms

Ai-je fais une erreur? ou bien FireFox a une drole de rapidité (15s).

Merci de vos futurs éclaircissements!

Le js du test:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
var resolution = 150;
var pixel = 2;
var nbDiv = resolution * resolution;
 
function show()
{
  var container = document.getElementById("container");
  container.setAttribute("style", "position:absolute;left:10px;top:50px;width:" + (resolution * pixel) + "px;height:"  + (resolution * pixel) + "px;");
 
  var start = (new Date()).getTime();
 
  for(var y = 0; y < resolution; y++)
  {
    for(var x = 0; x < resolution; x++)
    {
      var curDiv = document.createElement("div");
      var style = "position:absolute;background-color:silver;left:" + (x * pixel) + "px;top:" + (y*pixel) + "px;width:" + pixel + "px;height:" + pixel + "px;";
      curDiv.setAttribute("style", style);
 
      container.appendChild(curDiv);
    }
  }
  var endCalcul = (new Date()).getTime() - start;
 
  var end = (new Date()).getTime() - start;
 
  var info = "Res: " + resolution +
             ", pixel: " + pixel +
             ", nbDiv: " + nbDiv +
             ", Délai calcul: " + endCalcul + " ms" +
             ", Délai fonction: " + end + " ms";
  document.getElementById("info").innerHTML = info;
}

jlmag