Liens sur la performance III

• Rendre la nouvelle page d'accueil de Github Fast and Performant - Tobias Ahlin décrit comment les effets de défilement sont effectués de manière plus performante grâce à IntersectionObserver et le fait qu'il évite l'utilisation de méthodes qui déclenchent des refloges, comme GetBoundingClientrect. Aussi, WebP SVG Masks!
  
• Tout ce que nous savons sur Core Web Vitals et SEO - Simon Hearne explique pourquoi tout le monde est si obsédé par CWV en ce moment: SEO. Simon dit quelque chose que j'ai entendu à quelques reprises: la mise à jour de l'expérience de la page est plus une approche de carotte que le bâton - il n'y a pas de pénalité directe pour ne pas avoir atteint les objectifs de Google. Autrement dit, vous n'êtes pas pénalisé pour un mauvais CWV, mais vous avez un bonus pour de bons chiffres. Mais si tout le monde autour de vous obtient ce bonus sauf vous, n'est-ce pas la même chose qu'une pénalité?
  
• Configuration des travailleurs de CloudFlare pour l'optimisation et les tests des performances du Web - Matt Hobbs commence par une intro 101 sur la mise en place d'un travailleur CloudFlare, en l'utilisant pour intercepter un fichier CSS et remplacer toutes les déclarations de la famille de polices par Comic Sans. Peut-être que cela ouvrira les yeux sur les possibilités: si vous pouvez manipuler tous les actifs comme HTML, CSS et JavaScript, vous pouvez forcer ces choses à faire des choses plus performantes.
  
• Voilà ce que j'appelle un travailleur de service! - Jeremy Wagner met en place un employé de service «en streaming» qui cache des partiels communs sur un site Web (par exemple, l'en-tête et le pied de page) de sorte que les habitants du comté de Waushara, Wisconsin, qui ont un Internet lent peuvent charger le site quelque part dans les environs de deux fois plus rapidement. Ceci s'appuie sur l'article des «petites charges utiles HTML de Philip Walton.
  
• Qui a le site Web F1 le plus rapide en 2021? - La série épique de la gamme épique de Jake Archibald analysant les performances des sites Web de course F1 (oh, l'ironie). On dirait que Red Bull est en tête jusqu'à présent avec Ferarri traînant. Il y a beaucoup à apprendre dans tous ces éléments, et c'est un peu cathartique en voyant des morceaux drôles comme, leur site était lent à cause d'un script de blocage de 1,8 Mo, mais 1,7 Mo de cela était une PNG de 2300 × 2300 inclinée qui n'a jamais été affichée à 20 × 20. De plus, je ne pense pas que je savais que Jake était le constructeur d'origine de Sprite Cow! (N'utilisez pas cela car il s'avère que les sprites sont mauvais.)
  
• CSS réel CSS vs Comparaison des performances CSS-in-JS - Tomas Pustelnik examine les implications de performance de CSS-in-JS. Ou, comme j'aime le souligner: CSS-in-React, car c'est toujours ce que c'est puisque tous les autres grands frameworks JavaScript ont leurs propres solutions de style béni. Tomas n'a pas comparé les composants stylisés aux Vanilla CSS écrits à la main, mais à Linaria, que je pense que la plupart des gens considèrent toujours comme CSS-in-JS - sauf qu'au lieu de regrouper les styles en JavaScript, il produit CSS. Je suis d'accord que, quelle que soit une bibliothèque de style pour DX, la production de CSS semble être la voie à suivre pour la production. Encore une autre raison pour laquelle j'aime les modules CSS. Les libs plus nouveaux le font aussi.
  
• Le cas de la demande de 50 ms - Julia Evans a rassemblé ce puzzle interactif pour essayer de comprendre pourquoi une demande de serveur prend plus de temps qu'elle ne devrait. Plus d'une chose back-end que front-end, mais les étapes de dépannage semblent familières. Essayez-le sur votre machine, essayez-le sur ma machine, voyez ce que fait le serveur, etc.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!