CSS devrait-il précéder ou suivre JavaScript dans le développement Web moderne ?

Le CSS doit-il toujours précéder JavaScript ?
[Une question courante dans le développement Web]

Introduction :
Auparavant, on pensait que placer CSS avant JavaScript était optimal pour les performances Web. Cependant, avec les navigateurs modernes et les récents progrès technologiques, cela pourrait ne plus être le cas.

Résultats des tests :
L'auteur a effectué des tests approfondis en utilisant différents navigateurs et scénarios, en comparant les performances des pages où CSS a été placé avant ou après JavaScript. Les résultats ont révélé que :

Sur les navigateurs de bureau :

• Lorsque CSS est retardé, placer JavaScript avant CSS offre un gain de performances trivial.

Sur les navigateurs mobiles :

• Les tests de l'auteur sur Android 4 a montré que l'analyse spéculative ne semblait pas être prise en charge, ce qui peut affecter les performances du placement CSS.

Conclusions :
Sur la base des résultats des tests, l'auteur suggère que :

Bureau Navigateurs :

• Placer des feuilles de style externes après les scripts externes, uniquement lorsque les performances de l'ancien navigateur ne sont pas un problème, offre les meilleures performances. (Environ 85 % des navigateurs de bureau prennent en charge l'analyse spéculative.)

Navigateurs mobiles :

• La conclusion pour les navigateurs mobiles peut varier en fonction du navigateur et système d'exploitation utilisés. Cependant, il est probable que dans la plupart des cas, placer CSS avant JavaScript puisse quand même apporter un avantage en termes de performances.

Considérations supplémentaires :
L'auteur note qu'il existe divers arguments pour placer les scripts dans l'en-tête plutôt qu'à la fin du corps, mais cette discussion se concentre spécifiquement sur le placement du CSS par rapport à JavaScript dans le head.

Conclusion :
Dans les navigateurs de bureau modernes, placer CSS après JavaScript ne nuit pas aux performances et peut apporter des gains dans certaines circonstances. Donner la priorité aux scripts n’affecte pas les performances sur la majorité des navigateurs mobiles. Cependant, il est important de prendre en compte le public cible spécifique et la prise en charge du navigateur lors de la prise de cette décision.

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!