Gros JSON : rendu frontend performant pour 100MB de donnees
2024-06-18
Les apps de logs ou data manipulent parfois des dizaines ou centaines de MB JSON. Un parse synchrone et un rendu complet du DOM peuvent figer l'onglet.
Ou part le temps
JSON.parse est synchrone et couteux CPU ; le graphe parse consomme beaucoup de heap.
Rendre des millions de noeuds coute souvent plus cher que le parsing : virtualisez l'UI.
Parser dans un Web Worker
Envoyez texte ou buffers au Worker pour parser hors thread principal.
Renvoyez de preference seulement la page courante plutot que tout le graphe.
Listes virtuelles
Pour de grands tableaux, n'affichez que les lignes visibles via virtualisation.
Pour les arbres, chargez les enfants a la demande a l'ouverture.
Streaming et morceaux
JSON Lines convient au flux incremental ; les grands tableaux uniques exigent souvent pagination ou NDJSON.
Avec fetch + ReadableStream, vous pouvez traiter progressivement.
Conseil realiste pour 100MB
Priorisez filtre, pagination et compression cote serveur.
Si tout est client : Worker + virtualisation + progression visible et suivi memoire.