Quelle sera la charge du navigateur plus rapide une 1000px x 1px image ou 1px par 1000px l'image

Question

Il semble que puisque l'image est juste un morceau de données qu'il sera le même, mais je ne suis pas concluante parce que je ne sais pas comment le navigateur rend effectivement l'image.

En outre, ce format d'image pour une image d'une seule couleur charge le plus rapide?

Answer 1

En outre, ce format d'image pour une image d'une seule couleur charge le plus rapide?

Si vous allez charger une seule couleur, il est probable que l'utilisation d'un élément avec background: #HEX; sera un peu plus rapide, que vous ne serez pas besoin de charger l'image réelle.

Edit # 1:

Je créé deux jpg images en noir, 1000x1 et 1x1000 -. À la fois fini de la même taille (399 octets)

De plus, je crée une image .png-1000x1, ainsi qu'un 1000x1 gif image (à la fois rempli de noir) - tour à tour sur les tailles étaient les suivantes:

PNG-image: 96 bytes
GIF-image: 63 bytes

Vainqueur: Le GIF image, avec 33 octets moins de données que le PNG-image. Si vous chargez 1000 images comme celles utilisées dans le test, les frais généraux en utilisant le format PNG sera de 33 000 bytes (ou 32.22 kilobytes si vous préférez ce format).