DataGrid Performance en Flash (ou comment lire 2 000 enregistrements XML en moins de 0,5 secondes)
Traduire/Translate : English - Espagnol - Deutsch (by Google)
Pour Flex, consulter cer article.
Le problème
Question : Quel est le moyen le plus rapide pour lire 2 000 données XML et les afficher dans un DataGrid ?
Voici quatre méthodes et les résultats sur une machine :
| Méthode 1 (classique) Noeuds, XMLConnector avec Schéma et Databinding |
Méthode 2 Attributs, XMLConnector avec Schéma et DataBinding |
Méthode 3 Attributs, parse XML et dataProvider |
Méthode 4 Attributs, parse XML et items |
|
| Flash Player 7 | 12 388 ms | 11 963 ms | 2 930 ms | 442 ms |
| Flash Player 8 | 9 365 ms | 7 569 ms | 1 858 ms | 314 ms |
Le problème détaillé
Dans de nombreux forums, des utilisateurs se plaignent des performances du trio XMLConnector/DataSet et DataGrid pour lire des fichiers XML.
Cet article compare 4 méthodes pour lire un fichier XML de 2 000 enregistrements.
Le test
Le fichier est constitué de 2 000 enregistrements représentant des clients.
Un client est représenté par un prénom, un nom, habite une ville, a un age et un chiffre d'affaire (ca). Les données sont de type String et Number.
L'objectif est de lire le plus rapidement possible les données stockées dans un fichier XML, de l'afficher dans un DataGrid et de se positionner à la 3ème ligne.
dgperfSrc.zip (1 696
Ko)
Méthode 1
Pour représenter les données, nous utilisons des noeuds. Un client est représenté de la manière suivante :
<client>
<nom>Deschamps</nom>
<prenom>Amandine</prenom>
<ville>Caluire-Et-Cuire</ville>
<age>43</age>
<ca>2173.7</ca>
</client>
Pour Flash, nous utilisons un XMLConnector pour lire le fichier (en utilisant un Schéma), un DataSet pour le modèle et un DataGrid pour afficher les données. On utilise des liaisons de données (DataBinding) pour lier les 3 éléments.
C'est la méthode "classique" que vous trouverez dans de nombreux tutorials.
Pourquoi cette méthode est lente ?
Le fichier XML a une taille de 315 ko. Lorsqu'on utilise le Schema d'un XMLConnector, Flash utilise un XPath pour accéder aux données.
Le fichier est gros, le XPath est lent : c'est la méthode la plus longue. On arrive à 12,5 secondes.
Le test
Patienter environ 12,5 secondes (avec Flash Player 7)...
Méthode 2
L'idée de cette méthode est d'utiliser des attributs (au lieu des noeuds) et de voir l'impact sur les performances.
Un client est représenté de la manière suivante :
<client nom="Deschamps" prenom="Amandine" ville="Caluire-Et-Cuire" age="43" ca="2173.7"/>
Pour Flash, nous utilisons la même méthode que dans la méthode 1 : un XMLConnector pour lire le fichier (en important le schéma), un DataSet comme modèle et un DataGrid pour afficher les données. On utilise des liaisons de données (DataBinding) pour lier les 3 éléments.
Pourquoi cette méthode est plus rapide que la méthode 1 ?
Le XPath est plus "rapide" pour accéder à un attribut (que pour un noeud). Notons aussi que le fichier XML est plus "petit" (164 ko au lieu de 315 ko)
Le test
Patienter environ 12 secondes...
Méthode 3
Pour représenter les données, nous utilisons des attributs.
L'idée de cette méthode est de ne pas utiliser le schéma du XMLConnector (qui utilise un XPath) mais de parser manuellement le XML.
Pour ceci, on lit le plus "rapidement" le XML : on utilise une boucle while avec nextSibling. Pour encoder les nombres, on utilise Number (et non pas parseInt et parseFloat qui sont plus lents).
Il n'y a plus de databinding entre le XMLConnector et le Dataset. On utilise le dataProvider du DataSet pour lier le résultat du parsing du XML.
Pourquoi cette méthode est plus rapide que la méthode 2 ?
On effectue manuellement le parsing du XML. On n'utilise plus le XPath (et on n'utilise pas le Schema du XMLConnector).
Par contre, il faut "encoder" les attributs. Dans la plupart des données XML, on retrouve des chaînes de caractères et des nombres. L'encodage est donc très rapide.
Le test
Patienter environ 3 secondes...
Méthode 4
Avec la méthode 3, on sait lire très rapidement le XML. L'idée de cette méthode est de savoir si on peut améliorer la liaison de données (on utilise dataProvider dans la méthode 3).
Si vous regardez la documentation du DataSet, il existe deux méthodes pour associer des données à un DataSet : la méthode dataProvider et la méthode items.
Quelle est la différence entre dataProvider et items ?
La documentation de Flash MX 2004, de Flash 8 ou des LiveDocs ne donne pas trop de détails. Il faut donc regarder les sources du DataSet :
Dans Flash 8 : Macromedia\Flash 8\en\First Run\Classes\mx\data\components\DataSet.as
En fait, la méthode dataProvider effectue des conversions de type si il existe un Schema (dans la méthode internalAddItem). La méthode items effectue un lien direct (sans conversion/vérification de type).
Comme on a déjà effectué les conversions de type, on utilise donc la méthode items. (Dans la méthode 3, la conversion de type n'était pas nécessaire).
Le code est le suivant :
client_con.addEventListener("result", Delegate.create(this, doParseData));
//
function doParseData():Void {
var dataXML:XML = client_con.results;
var resultArray:Array = [];
var mainNode = dataXML.firstChild;
var aNode:XMLNode = mainNode.firstChild;
while (aNode) {
var obj = new Object();
for (var attribute:String in aNode.attributes) {
if (attribute == "age" || attribute == "ca") {
obj[attribute] = Number(aNode.attributes[attribute]);
} else {
obj[attribute] = aNode.attributes[attribute];
}
}
resultArray.push(obj);
aNode = aNode.nextSibling;
}
// -- use items (and not dataProvider)
client_ds.items = resultArray;
}
Voila une méthode qui permet de passer de 12,5 secondes à moins de 0,5 secondes pour lire un fichier de 2 000 enregistrements.
Le test
Patienter environ 0,5 seconde...
Commentaires
Flash Player 7 / Flash Player 8
Les tests montrent sur cette démonstration que de passer à Flash Player 8 augmentent les performances de 40%.
Inconvénients
La méthode 4 est donc la plus rapide.
Un des inconvénients est qu'il faut encoder les attributs. Dans notre cas, il existe deux types d'attributs : String et Number : ce qui est le cas le plus majoritaire.
Pour le type Date ou d'autres types, contactez-moi.
Question : Mon fichier XML possède des noeuds et des attributs et donc je ne peux pas utiliser cette méthode.
Une possibilité est d'utiliser une transformation XSL (XLST) sur le serveur pour préparer le XML. Vous transformez toutes vos données en attributs.
dgperfSrc.zip (1 696
Ko)
Version
version 1.0 - 23 Octobre 2005 : version initiale