Existe-t-il une différence de performance entre background-size: cover et background-size: 100% auto?
Je sais quelle est la différence entre background-size: cover et background-size: 100% auto. Je suis curieux de savoir s'il existe une différence de performance entre les deux et laquelle serait la meilleure?
Il est toujours bon de choisir%, car cela garantit un contenu fluide. Il est bon pour Google et vos utilisateurs de disposer d'une bonne version mobile de votre site.
Je ne pense pas qu'il y aurait une différence dans la performance ou du moins pas une différence que vous pouvez repérer. Vous pouvez le tester en mettant les deux propriétés et en testant la vitesse de votre page avec un outil pour les deux propriétés, mais je suis certain qu'il n'y aurait aucune différence.
À mon avis,% serait mieux que la couverture car il est plus facile pour les navigateurs de le rendre et de le rendre fluide pour les différentes résolutions.
Il existe une différence de performances entre les deux, l'utilisation de background-size: 100%; n'est pas prise en charge pour Android 4.3 Navigateur et versions antérieures. De plus, les valeurs de pourcentage background-size ne sont pas correctement prises en charge pour les images SVG sur Safari.
De plus, iOS Safari a longtemps eu un comportement très bogué avec background-size: cover. Toutes ces informations proviennent de l'excellent site Web puis-je utiliser ... - consultez l'onglet "Problèmes connus" situé sous le graphique.
Pour contourner ce problème, vous pouvez utiliser le plugin jQuery Backstretch . C'est plus lent que CSS, mais le résultat final pourrait être plus satisfaisant pour vous.
Si vous vous en tenez à un motif abstrait, à une image ou en particulier à un dégradé, vous pouvez probablement ignorer les bogues aléatoires car il est beaucoup moins probable que les visiteurs le remarqueront si l’arrière-plan est correctement mis à l’échelle.