Les moteurs de sélection CSS favorisent-ils la lecture de droite à gauche ?

Moteurs de sélection CSS : lecture de droite à gauche

Dans le monde du CSS, il est généralement admis que les sélecteurs comme .name fonctionner plus rapidement que div.name. Cependant, certaines découvertes récentes affirment le contraire, suggérant que la plupart des moteurs de sélection lisent de droite à gauche. Cela soulève des questions sur les implications en termes de performances et sur le raisonnement derrière cette approche.

Évaluation de droite à gauche

Bien qu'il soit vrai que l'hypothèse selon laquelle .name est plus rapide peut être défectueux, les performances globales dépendent fortement de la mise en œuvre du navigateur et de la structure spécifique du document. Néanmoins, la plupart des moteurs de sélection CSS modernes suivent une approche d'évaluation de droite à gauche.

Selon Boris Zbarsky, le développeur de Gecko, les navigateurs fonctionnent généralement en sélectionnant un élément et en évaluant tous les sélecteurs candidats pour déterminer s'il correspond. , plutôt que d'identifier les éléments correspondants pour un sélecteur donné. Cette approche de droite à gauche simplifie le processus de parcours entre les combinateurs, tels que > ou , au sein des sélecteurs.

Parcours au sein des sélecteurs simples

Cependant, il est important de différencier que l'évaluation de droite à gauche ne s'étend pas jusqu'au niveau du sélecteur simple au sein chaque sélecteur composé. Par exemple, dans le sélecteur complexe div.name[data-foo="bar"]:nth-child(5):hover::after, le navigateur ne vérifie pas nécessairement les conditions dans l'ordre suivant : survol, nombre d'enfants, données. attribut, classe de nom et type.

Au lieu de cela, des sélecteurs simples spécifiques, comme les identifiants, peuvent être priorisés pour des raisons de performances. Cela est évident dans l'implémentation de Gecko, où les règles avec les identifiants sont d'abord vérifiées pour optimiser le processus de correspondance.

Résumé

La direction de lecture du moteur de sélection CSS est généralement correcte. à gauche, mais les détails spécifiques de la façon dont cela est implémenté peuvent varier selon les navigateurs. De plus, l'évaluation de droite à gauche s'applique uniquement aux combinateurs au sein des sélecteurs composés, et non jusqu'au niveau du sélecteur simple individuel.

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!