¿La imagen de descarga del navegador se ejecutará dos veces si se usa tanto en el archivo src de una imagen como en la imagen de fondo de un div?

Debido a razones que son necesarias pero difíciles de explicar aquí, estoy configurando tanto una imagen absolutamente posicionada como una imagen de fondo en un div.¿La imagen de descarga del navegador se ejecutará dos veces si se usa tanto en el archivo src de una imagen como en la imagen de fondo de un div?

Quiero asegurarme de que una vez que el navegador haya capturado estas imágenes (son muy grandes) no las vuelva a capturar.

Supongamos que la imagen bg.jpg en el siguiente código es 500KB. ¿El siguiente código hace que el navegador descargue la imagen en su totalidad dos veces para un total de 1000 KB?

<style> 
    header { 
     background: url(img/bg.jpg) center center fixed transparent; 
    } 
</style> 

<header> 
    <img src="img/bg.jpg" width="500" height="500"> 
</header>

EDITAR: Gracias a todos por sus excelentes respuestas. Solo quería volver a verificar y asegurarme de que no causaba que el usuario volviera a descargar estas imágenes de gran tamaño.

Fuente

2012-08-01 Jesse Atkinson

creo que se descargará una vez y lo pondrá en efectivo. La segunda imagen se reabrirá del efectivo. –

@ MiljanPuzović Solo por el bien de la corrección, quieres decir "caché" no "efectivo" – binaryfunt

@BrianFunt Gracias, eso fue hace 3 años, mi inglés fue horrible :) –

Los navegadores son bastante inteligentes cuando se trata de almacenar en caché. Solo debe solicitarlo una vez.

Además, cuando le pide una imagen al servidor, generalmente envía con la solicitud de la imagen, un par de encabezados que le dicen al servidor ... Hola, quiero esta imagen, pero ya tengo una que tiene estos atributos que me lo dijiste la última vez que me lo enviaste.

El servidor puede responder con una 200 que significa que es diferente contenido 304 es decir la que tiene es la misma, por lo que no voy a enviarlo de nuevo, utilizar el que tienes ..

Uno de estos métodos usa un ETAG header, pero hay algunos más.

Su servidor debe ser compatible con esto, pero la mayoría lo hace.

Además, el interweb se compone de un montón de cachés, que también se verá en este tipo de valores de cabecera y esas cosas para usted volver .. Es por eso que la web escalas tan bien ;-)

Fuente

2012-08-01 00:49:23 grillp

No, el navegador lo almacenará en caché. Sin embargo, dependiendo de la configuración del usuario, el navegador puede solicitar la imagen nuevamente la próxima vez que se solicite, como por ejemplo, si el usuario borra su caché entre las visitas a la página.

Fuente

2012-08-01 00:45:19 j08691

pero hará otra solicitud 'http' para verificar la validez de la memoria caché si no estoy equivocado. – bPratik

@bPratik: no el navegador verificará el caché antes de realizar la solicitud. – j08691

Consulte la siguiente cita de http://developer.yahoo.com/performance/rules.html/#js_dupes. ¿La misma lógica no se aplica a otro contenido estático? _ "Las solicitudes HTTP innecesarias suceden en Internet Explorer, pero no en Firefox. En Internet Explorer, si un script externo se incluye dos veces y no es almacenable, genera dos solicitudes HTTP durante la carga de la página. Incluso si el script es cacheable, las solicitudes HTTP adicionales ocurre cuando el usuario vuelve a cargar la página. "_ – bPratik

No, se descargará una vez y luego se colocará en el caché del navegador. La próxima vez que se haga referencia a esa URL buscará la imagen desde la memoria caché en lugar de recuperarla del servidor.

Fuente

2012-08-01 00:46:12 secretformula

¿La imagen de descarga del navegador se ejecutará dos veces si se usa tanto en el archivo src de una imagen como en la imagen de fondo de un div?

Respuesta

Cuestiones relacionadas