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.
Super initiative ! Quand je vois tous ces sites dont la home page fait 10 MB de scripts, CSS et images en tout genre et que ça semble ne gêner personne 🙄
Removing jQuery from GOV.UK was a huge yet manageable task that led to improved code and performance gains across the site. This is how and why we did this work.
Un outil pour analyser la taille d'un package npm.
Des pistes intéressantes pour réduire la taille de vos applications en supprimant les morceaux de dépendances dont vous n'avez pas besoin. Peu d'effort à mettre en oeuvre et un gain potentiellement conséquent !
Un article très intéressant sur l'optimisation des sites web. L'auteur s'autorise uniquement 50 Mo de data et analyse la poids des sites qu'il visite et comment ils pourraient être mieux optimisés.
Un très bon article sur le lazy-loading de modules en général avec Webpack et plus particulièrement de composants Vue.js. C'est étonnamment facile à mettre en place et ça peut permettre de drastiquement améliorer les performances au chargement d'une application.
Comment préserver son SSD sous Linux.
These notes describes how to improve Nginx performance, security and other important things; @ssllabs A+ 100%.
Améliorer les performances des grosses listes dans Vue.js en supprimant la couche réactive de chaque menu item lorsque c'est possible. C'est vrai que bien souvent les éléments d'une liste n'évoluent pas donc la réactivité n'apporte rien.
Sur les navigateurs mobiles, les "clics" sur les éléments interactifs (liens, boutons, etc.) ne sont pris en compte que 300 ms après l'action de clic. Ce délai sert à voir si un autre clic intervient dans cet intervalle, auquel cas le navigateur prendre en compte un double-clic et non un clic simple.
L'utilisation de double-clic sur un site étant assez marginale, si vous souhaitez donner une meilleure impression d'immédiateté, vous pouvez désactiver ce délai avec le code CSS suivant :
a,
area,
button,
[role="button"],
input,
label,
select,
summary,
textarea {
touch-action: manipulation;
}Via https://getbootstrap.com/docs/4.0/content/reboot/ et https://medium.com/css-mine/bootstraps-reboot-next-evolutionary-step-for-css-reset-a30f718521b9
Un outil pour optimiser vos SVG.
J'ai testé rapidement et le résultat est plutôt efficace !
Une web application pour optimiser vos images.
Plein de bons conseils pour garder vos SPA légère.