Discussion :

[zadoner33]

Bonjour,

Ma problématique :
Je dois réaliser un tableau de données d'environ 6000 lignes ( chaque ligne comporte 30 champs ).
Sur ce grand tableau, je dois pouvoir effectuer des recherches par date, par attribut ...
Toutes ces données sont enregistrées dans une base de données MySql.

Ma question :
Quel technologie utilisée pour réussir au mieux à manipuler toutes ces données ? Jquery ? Ajax ? Php ? Iframe ?

Mes pistes :
Je suis déja parvenu à réaliser un tableau entièrement en javacsript/jquery sur lequel je peux effectuer toutes mes recherches (par date, par attribut, filtres...) mais ceci sur seulement une 20aines de lignes pour le moment.

- Es ce que je risque d'avoir des problèmes de traitement de données lorsque j'aurais des milliers de lignes de données ?
- Dois-je sinon utiliser l'ajax pour re-charger mon tableau en fonction des "filtres" ou des requetes que je demandes ?
- Es ce que l'utilisation de l'ajax avec une iframe serait une bonne solution ?
(dans mon iframe se trouverait mon tableau construit avec une requete sql, et avec l'ajax, je lui transmet les paramètres de la bonne requete sql à effectuer pour la construction du tableau)
- ou alors je transpose toutes mes données dans un gros fichier xml que je traite ensuite avec l'ajax ?

J'ai cherché sur le net mais je ne trouve pas d'avis sur la bonne techno à mettre en place sur le traitement d'un tableau de cette envergure.

Par avance, merci

[SylvainPV]

Le JS est côté client, ça permet donc de faire du tri rapidement sans requêter le serveur.
Le PHP est côté serveur, ça permet de faire le tri et de renvoyer les données paginées et triées, afin que le client n'ait pas à télécharger et interpréter toutes les données.

Il y a donc un compromis à trouver entre temps de chargement des données et temps de tri sur les données.

Généralement, un utilisateur accepte bien plus volontiers d'attendre dix fois de suite une seconde entre chaque résultat, plutôt que d'attendre une fois cinq secondes au début pour ne plus avoir à attendre ensuite. Donc faire le tri en PHP+AJAX serait une meilleure option.

MAIS avec les mécanismes de cache client comme le localStorage ou l'applicationCache, on peut télécharger toutes les données et ne plus avoir à requêter le serveur ensuite, et ce pour un temps infini (jusqu'à ce que l'utilisateur nettoie ses traces sur le navigateur ou que tu souhaites mettre à jour les données). Donc si les données ne sont pas amenées à évoluer souvent et que leur taille est de l'ordre du raisonnable (< 10 Mo), faire le tri côté client est un bon choix également.

Pour tes questions :
- Es ce que je risque d'avoir des problèmes de traitement de données lorsque j'aurais des milliers de lignes de données ? --> tout dépend du type d'informations et du type de traitement, mais si on reste dans l'ordre du millier ça ne fait pas trop peur
- Dois-je sinon utiliser l'ajax pour re-charger mon tableau en fonction des "filtres" ou des requetes que je demandes ? --> si tu fais le tri côté serveur, oui
- Es ce que l'utilisation de l'ajax avec une iframe serait une bonne solution ? --> je ne vois pas ce que vient faire l'iframe là-dedans, avec AJAX pas besoin d'iframe
(dans mon iframe se trouverait mon tableau construit avec une requete sql, et avec l'ajax, je lui transmet les paramètres de la bonne requete sql à effectuer pour la construction du tableau)
- ou alors je transpose toutes mes données dans un gros fichier xml que je traite ensuite avec l'ajax ? --> il faudra sérialiser tes données d'une manière ou d'une autre, et je te conseille de les envoyer en JSON (plus léger) et de générer ton tableau HTML en JavaScript ensuite. C'est ce qu'il y a de mieux en perf.

[zadoner33]

Alors tout d'abord, merci beaucoup pour cette réponse rapide et complète !

Par rapport à ce que tu me dis, la réponse s'éclaircit !

Déjà, concernant le localStorage ou l'applicationCache, je ne pense pas que ce soit approprié dans mon cas du fait que les informations seront amenées à être modifiées plusieurs fois par jour.

Ensuite, en effet, 10 fois une secondes est plus judicieux dans mon cas que 1 fois 5 secondes...
donc l'utilisation du Php/AJAX parait être la meilleur solution en effet !

Sur ce point :

- Es ce que je risque d'avoir des problèmes de traitement de données lorsque j'aurais des milliers de lignes de données ?
--> tout dépend du type d'informations et du type de traitement, mais si on reste dans l'ordre du millier ça ne fait pas trop peur

Je voulais préciser ma question dans le sens ou, si je charge ma page html avec disons 8000 lignes dans un tableau (30 champs par ligne) et que j'utiliser ensuite le jquery pour faire les manipulations de tri, es ce que j'ai des chances que ça rame un peu ? Quels sont les paramètres à prendre en compte pour anticiper d'éventuelles latences ? ( genre navigateurs ? puissance du pc ? ou cela n'a rien à voir ? )
( pour plus d'infos, les informations sont : en gros 25 champs de types varchar 256 caractères et 3/4 champs de type texte (genre 10/15 lignes)


Et enfin, tu me conseille donc de sérialiser mes données en JSON et de construire mon tableau en javascript. (mais la sérialisation ne va pas me prendre les fameuses 5 secondes dont on avait parlé plus haut ?

Cette technique sera plus rapide donc que d'utiliser une iframe ?

J'ai du mal à me rendre compte quelle solution est plus efficace dans le sens ou avec une iframe, il me suffit d'envoyer la bonne requête à mon iframe pour y charger mon tableau ? Le JSON va me permettre d'aller plus vite ?

[SylvainPV]

Oublie l'iframe. Si tu cherches la performance, charger les résultats sous forme de HTML pré-rendu par le serveur n'a pas de sens. Voir le chapitre IV de mon article: http://sylvainpv.developpez.com/tuto...ng-client/#LIV

Le JSON va te permettre d'échanger tes données dans un format léger, quelle que soit l'approche que tu choisis (tri côté serveur ou côté client, il faut bien envoyer les données). Sérialiser côté serveur et de-sérialiser côté client est une affaire de millisecondes, tandis que le gain en taille des requêtes peut lui se compter en dixièmes de seconde, voir en secondes sur les mauvaises connexions.

jQuery est une lib pour manipuler du DOM, ce n'est pas elle qui va trier tes données ; bien que tu peux utiliser quelques helpers jQuery pour ça mais ce que je veux dire, c'est que tu ne vas pas t'embêter à transformer toutes tes données en lignes de tableau et ensuite les trier, autant les trier tout de suite et les afficher ensuite avec une pagination ou avec un infinite scrolling.

Pour les problèmes de perf sur les traitements, je pense surtout que ça va dépendre de la complexité du tri. Par exemple si tu as des expressions régulières complexes à appliquer sur plusieurs champs. Si c'est juste un tri bateau par ordre alphabétique, ou une recherche par terme exact, ça devait être très rapide (surtout si tu fais le tri côté serveur).

[sekaijin]

http://dev.sencha.com/extjs/5.1.0/ex...red-store.html
http://dev.sencha.com/extjs/5.1.0/ex...mary-grid.html
http://dev.sencha.com/ext/5.0.1/exam...red-store.html

etc.
je pense que extjs est un outil pour gérer de telles tables à regarder de près
Le ticket d'entrée n'est pas immédiat mais c'est particulièrement bien adapté à ce besoin

A+JYT

[zadoner33]

Pour le côté théorique, je pense avoir compris en grande partie le principe, merci SylvainPV.
Et pour la pratique, merci à toi sekajin, je regarde de très près ce que tu m'a proposé, en effet ca à l'air puissant et surtout adapté à mes besoins. Notamment le fait que lorsque tu scroll tu effectues une requete Aajx à l'endroit ou le scroll se positionne...Je sai pas encore comment faire, mais c'est ce qu'il me faut

Il est facile de trouver sur le net des informations liées à telle ou telle techno mais pas toujours évident de définir la bonne techno en fonction de l'utilisation.

Donc un grand merci messieurs ! Et un bon week end

PS: Je me suis donc orienté vers de l'Ajax, avec retour des mes requêtes ajax traitées en JSON.