Depuis la version 6.0 de l'API Virtual Earth et aujourd'hui la 6.1, l'ensemble des méthodes ont été optimisées afin de garantir des performances élevées.

virtual earth_header

C'est le cas de la méthode d'ajout d'élément sur la carte, ces élements peuvent être des punaises, des polylignes (polylines) ou des polygones (polygons).

Il est en effet possible maintenant d'ajouter de nombreux points très rapidement en passant tout simplement un tableau de points à la méthode d'ajout. L'initialisation de ce tableau est bien plus rapide que l'ajout successif dans le DOM de chacun des points.

Méthode classique d'ajout :

function addPins() 
{
  var Now = new Date();      // Grab the current date.
  Start = Now.getTime();
  var latLong = map.GetCenter();
             
  for(var i = 0; i < limitPin; i++) 
  {
    var shape = new VEShape(VEShapeType.Pushpin, latLong);
    shape.SetTitle("Titre de la punaise " + i);
    shape.SetDescription("Description de la punaise " + i);
    map.AddShape(shape);
  }
  alert("total time = " + elapsedmilliseconds() + "milliseconds");
}

Le passage mis en gras est celui le plus intéressant dans le cas présent.
On créé un objet de type VEShape en initialisant quelques une des propriétés dans le constructeur puis à l'aide des appels qui suivent aux méthodes SetTitle() et SetDescription() de cette même classe.
On ajoute cet objet au MapControl en utilisant la méthode AddShape() de la classe VEMap.

L'ensemble de ce traitement est effectué dans une boucle un nombre de fois défini plus tôt. Les autres lignes concernent une méthode simple de mesure du temps.

 

Méthode d'ajout en masse : Bulk Addition

function addBulkPins() 
{
  var Now = new Date();      // Grab the current date.
  Start = Now.getTime();
  var latLong = map.GetCenter();        
             
  var shapes = new Array();
             
  for(var i = 0; i < limitPin; i++) 
  {
    shapes[i ] = new VEShape(VEShapeType.Pushpin, latLong);
    shapes[i ].SetTitle("Titre de la punaise " + i);
    shapes[i ].SetDescription("Description de la punaise " + i);                 
  }
  map.AddShape(shapes);   //Bulk addition
             
  alert("total time = " + elapsedmilliseconds() + "milliseconds");
}

Comme précédemment, le passage en gras est celui qui nous intéresse.
Ici après avoir créé un tableau qui accueillera nos points, on ajoute un objet de type VEShape puis on initialise ses propriétés comme vu au dessus.

La différence survient au moment de l'ajout, ce dernier s'effectue en dehors de la boucle et la méthode AddShape() de la classe VEMap prend cette fois le tableau d'objet de type VEShape en paramètre.

 

Quels sont les gains ?

Ici, sans avoir optimisé au plus fin le code JavaScript de manipulation du tableau (j'entend par là que la manipulation du tableau pourrait certainement être amélioré), on obtient déjà un gain important que ce soit sur des quantités faibles ou importantes de données.

Voici un tableau de temps relevant cela :

Navigateur - Meth. 100 punaises 1000 punaises 5000 punaises
IE8 - Classique 510 ms 6600 ms 60300 ms
IE8 - Bulk 160 ms 1900 ms 8400 ms
FF2 - Classique 350 ms 6800 ms * Crash *
FF2 - Bulk 130 ms 1700 ms 14500 ms

Ici les temps sont données qu'à titre purement indicatif, ils peuvent variés selon les configuration. IE8 était en mode "Emulation IE7".
J'avais réalisé le test sur IE7 il y a quelques semaines, et on peut également voir qu'IE8 améliore largement les performances.

 

Conclusion :

Enfin, on remarque que quelque soit la quantité de données ajoutées, l'ajout est bien plus rapide et donc cette fonctionnalité d'ajout de masse ou Bulk Addition est très efficace.

Cette méthode ne semble, par contre, pas être disponible sur la classe VEShapeLayer, il n'est donc pas possible d'ajouter les éléments au layer en passant en paramètre un tableau d'objet de type VEShape. L'information sera remontée dès que possible à l'équipe VE.


Restons cependant prudent avec ces ajouts, il est déconseillé de dépasser 500 éléments sur le MapControl afin de garantir un fonctionnement optimal et c'est une recommandation que je conseille de prendre vivement en compte !
Si vous devez en afficher davantage, il faudra mettre en place des techniques de clustering cliend-side et/ou server-side mais cela sera abordé plus tard.