1. Accueil
  2. Question et réponse
  3. Trieuse Javascript rapide de table?

Trieuse Javascript rapide de table?

2009-03-14 7 views
13

J'ai une table avec environ 250 lignes (peut doubler dans les 6 mois), et 50 colonnes sur this page (avertissement: lent avec IE). J'utilise le JQuery Table sorter. Mais il est trop lent avec IE 7: il donne un avertissement à propos d'un javascript lent, et demande si je veux l'arrêter. J'ai passé beaucoup de temps pour améliorer les performances, il fonctionne très bien pour tous les autres navigateurs:Trieuse Javascript rapide de table?

  • texte de tri et chiffres ne
  • enlevé tous mais 2 parseurs
  • a créé une table supplémentaire qui contient tous les valeurs, beaucoup plus rapide que de faire node.textContent() pour chaque cellule
  • minuscules enlevé, garniture, etc.

Ma version du javascript est here. Je pense que je ne peux pas l'optimiser beaucoup plus. Je suis à la recherche d'une autre implémentation rapide d'un trieur de table, ou de toute bonne optimisation que j'ai peut-être oublié, afin qu'IE 7 ne se plaint pas du temps d'exécution.

Edit: Je ai désactivé sur 35 tri des colonnes, il est encore trop long pour IE

Source

2009-03-14 Julien

+1

Vous pouvez mettre un jockey sur un cheval plus léger, mais à un moment donné que le cheval ne peut aller si vite. – cletus

Répondre

7

J'utilise sorttable une bibliothèque javascript de tri de table extrêmement rapide. (pas JQuery)

Source

2009-03-14 05:11:56

+0

Je l'ai utilisé par le passé et ça marche très bien. Parfois, vous devez utiliser leurs attributs personnalisés pour les dates, mais dans l'ensemble, il est très solide. – hunter

+0

Très belle bibliothèque mais que se passe-t-il si je ne veux pas utiliser tous les en-têtes pour le tri? – Sarah

+1

Le site n'est plus là ... – corymathews

1

Solutions La plupart JScript qui fonctionnent ont lent beaucoup d'interaction avec les DOM. Au moment où vous effectuez des modifications au niveau DOM ligne par ligne, cela prendra longtemps dans IE. Si vous construisez le code HTML dans une chaîne et que vous le placez immédiatement dans le DOM, cela ira beaucoup plus vite. (Il y avait quelques démos au dernier PDC montrant exactement cela.)

Mais la morale de l'histoire ici est que votre table est assez grande. Vous pourriez penser à utiliser REST, avec la pagination et le tri des tables et une certaine logique côté serveur. Je pense que cela peut être beaucoup plus rapide et fonctionnera bien avec JQuery. (Et c'est toujours une solution AJAX.) Il pourrait même vous faire économiser de la bande passante ...

Espérons que cela aide.

Source

2009-03-14 05:11:12

0

L'une des pires choses que vous pouvez faire est d'utiliser eval() et je vois cela dans votre code. Vous devriez profiler votre code et voir où se trouve le goulot d'étranglement.

Source

2009-03-14 05:24:15 epascarello

+0

Cela éval() ressemble à ce qu'on appelle une fois par tri .. mais on dirait que ça fait quelque chose de moche. –

-1

un problème dans la fonction buildCache (tableau) Ligne 219 Erreur: « all_data » non défini

Source

2009-07-15 14:57:47

1

commentant sur toutes les références à applyWidget et leurs liaisons respectives ainsi que la suppression des analyseurs inutilisés fait une grande différence à un 500 table de rangée dans IE6 (oui, je sais, mais il ne mourra toujours pas).

Source

2009-10-25 19:35:21 GlennG

+0

Il est clair sur les widgets, mais quel genre de parseurs U signifie-t-il? –

2

Je suis un grand fan de trieuse de table jQuery Christian Bach ... http://tablesorter.com/docs/

  • Compact et rapide
  • Trier sur plusieurs colonnes
  • zébré Dynamic
  • extension de métadonnées en option rend les choses encore plus facile
  • Parsers pour le tri du texte, html, chiffres, peu importe (facile à personnaliser)
  • En-têtes CSS stylables (bien sûr)
  • Navigateur croisé: IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+

enter image description here

EDIT: Toute personne intéressée à tablesorter devrait voir ce que Mottie a fait avec elle: https://github.com/Mottie/tablesorter

Source

2012-07-29 08:07:30 neokio

+0

Le dernier changement de code est de 2008 est-il compatible avec le dernier jQuery? – powtac

+1

Je pense qu'il a été trop occupé pour le maintenir, mais Mottie a fait un travail incroyable avec le code, y compris la mise à jour pour jQuery 1.9 ... https://github.com/Mottie/tablesorter – neokio

+0

Merci pour le nouveau lien! – powtac

0

Un grand et option robuste est ce plugin jQuery, appelé DataTables.

  • pagination longueur variable
  • On-the-fly filtrage
  • multi-colonnes de tri avec détection de type de données
  • gestion intelligente de la colonne largeurs
  • données d'affichage à partir de presque toutes les sources de données DOM, Javascript array, Fichier Ajax et traitement côté serveur (PHP, C#, Perl, Ruby, AIR, Gears etc.)
  • Options de défilement pour la vue de table
  • entièrement internationalisable
  • soutien jQuery UI ThemeRoller
  • roche solide - soutenu par une suite de 2900 tests unitaires
  • Une grande variété de plug-ins inc. Éditeur, TableTools, FixedColumns et plus
  • C'est gratuit!

Source

2013-03-07 16:25:29 knownasilya

0

Si vous travaillez avec des bases de données sérieusement essayer un grand côté serveur avec DataTables (plugin jQuery).

Fondamentalement, tous les pagination, filtrage, tri etc. que DataTables fait peuvent être transférés à un serveur (ou à toute autre source de données).

Exemple complet ici: http://datatables.net/examples/data_sources/server_side.html

Source

2013-08-15 19:36:30

Questions connexes

 Questions connexes