Traiter un fichier CSV de 13GB en 9 secondes en tirant parti des structures bas niveau de JavaScript (Bun dans le cas présent).
Régler finement l'utilisation de la mémoire par Node pour améliorer les performances du Garbage Collector.
Un ensemble de petites applications conçues pour tourner dans le navigateur uniquement :
- Un outil pour enlever le fond d'une photo
- Un optimisateur d'images
- Un optimisateur de vidéos
- Un éditeur d'image
- Un upscaler d'image
- Etc.
Une revue de différentes méthodes pour découper le traitement de tâches longues et ainsi éviter de bloquer le thread principal en JavaScript (ce qui est primordial).
La nouvelle propriété CSS content-visibility permet de faire du lazy loading sur des morceau entiers du DOM pour améliorer le temps de chargement de vos pages.
Les éléments à qui est attribuée la valeur auto ne seront "peint" ou rendu par le navigateur seulement lorsqu'ils s'apprêtent à être visible, après que l'utilisateur ait suffisamment fait défilé la page.
Et c'est un bon candidat à l'amélioration progressive puisque les navigateurs qui ne connaissent pas cette propriété se contenteront de l'ignorer.
Article passionnant sur comment passer de 5 minutes à 11 secondes pour traiter un fichier de 12 Go avec Node. Très didactique, notamment sur l'utilisation des streams.
Un outil pour effectuer du benchmarking avec Node.
Pré-charger les polices de caractère dont on sait à l'avance qu'elles seront utilisées, pour que le navigateur n'attende pas d'avoir chargé le CSS pour les télécharger.
Cette technique permet de limiter les layout shifts provoqués par le remplacement de la police par défaut par la police personnalisée, et d'améliorer le temps de chargement global de la page.
Utilisation de Deno.bench pour comparer la vitesse d'exécution de divers algorithmes de tri, de boucles, etc.
Il n'y a rien de plus performant que d'utiliser les APIs DOM directement, sans framework.
Cet article regroupe quelques bonnes pratiques si vous avez besoin de performances optimales.
Comment optimiser du code JavaScript. Il faut noter que ça se fait souvent au détriment de la lisibilité et de la compréhensibilité. Certains conseils sont donc à réserver pour des scénarios où les performances sont cruciales.
Un outil pour analyser une image Docker et proposer des outils pour l'optimiser.
Via https://korben.info/explorer-optimiser-images-docker-avec-dive.html
Très bon article en français qui explique de manière concise le fonctionnement des attributs async, defer, rel=preload/preconnect/dns-prefetch, fetchpriority et loading.
Un outil qui permet de scroller un très grand nombre de données efficacement dans une app Vue.
Un regroupement d'articles qui parlent en profondeur de comment optimiser une appli web. C'est plein de bonnes pratiques à avoir en tête quand on développe.