Foros del Web » Creando para Internet » HTML »

Cargar imagen paralelamente

Estas en el tema de Cargar imagen paralelamente en el foro de HTML en Foros del Web. Estimados, buenas noches. Necesito la opinion de algun experto en la materia, para emplear l mejor practica para el siguiente caso. Necesito que unas determinadas ...
  #1 (permalink)  
Antiguo 09/06/2011, 21:35
Avatar de titocba  
Fecha de Ingreso: agosto-2008
Ubicación: Cordoba
Mensajes: 256
Antigüedad: 8 años, 9 meses
Puntos: 4
Cargar imagen paralelamente

Estimados, buenas noches.
Necesito la opinion de algun experto en la materia, para emplear l mejor practica para el siguiente caso.

Necesito que unas determinadas imagenes que tengo en el servidor de mi web se ya esten cargadas cuando yo las demande. Osea cuando las solicite desde un estilo css estas ya esten disponibles y no perder el tiempo de las descargas de la misma.
Aclaro, no es viable usar sprite de imagenes.


Saludos y muchas gracias desde ya
  #2 (permalink)  
Antiguo 10/06/2011, 02:59
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 6 años, 2 meses
Puntos: 192
Respuesta: Cargar imagen paralelamente

Entiendo que este es un tema que se discute mucho y hay varias aproximaciones. Todas las que conozco (que no sea usar un sprite) son con JavaScript. La única que conozco que no utiliza javascipt me parece muy mala práctica. Esta última consiste en agregar esto en nuestro HTML:


Código HTML:
Ver original
  1. <img class="cargame" src="images/imagen_que_quiero_cargar1.jpg" />
  2. <img class="cargame" src="images/imagen_que_quiero_cargar2.jpg" />
  3. ...

Y luego con CSS:
Código CSS:
Ver original
  1. .cargame{display:none;}

Es decir, ponemos imágenes explícitas en el HTML pero con CSS las ocultamos. Éste método es muy poco recomendable por una razón conceptual y porque no funciona en todos los navegadores (Opera y Chrome, por ejemplo, no cargarán la imagen si está oculta).

Las opciones con JavaScipt que conozco y que alguna vez he usado:

1.- Usar un script para jQuery llamado preloadCssImages.jQuery_v5.js. Tienes sus ventajas, pero tampoco lo recomendaría... me parece demasiado.

2.- El método más sencillo y compatible:

Código Javascript:
Ver original
  1. imagenPreCargada = new Image();
  2. imagenPreCargada.src = 'images/imagen_que_quiero_cargar1.jpg';

Si querés usar más de una imagen, podés hacer un array y luego recorrerlo:

Código Javascript:
Ver original
  1. $arr_imagenes = ['images/imagen_1.jpg', 'images/imagen_2.jpg', 'images/imagen_2.jpg', 'images/imagen_3.jpg', ];
  2. for (i=0;i<$arr_imagenes.length;i++){
  3.     tempImg = new Image();
  4.     tempImg.src = $arr_imagenes[i];
  5. }

Y la mejor forma, usar sprites de imágenes :P
__________________
nahueljose.com.ar
  #3 (permalink)  
Antiguo 10/06/2011, 06:22
Avatar de angel1993  
Fecha de Ingreso: octubre-2009
Mensajes: 752
Antigüedad: 7 años, 7 meses
Puntos: 22
Respuesta: Cargar imagen paralelamente

tambien puedes meter las imagenes en un Div con overflow hidde logicamente y le pones de tamaño 1x1 de este modo toricamente las imagenes estan visibles solo que se cortan, nunca lo he probado, pero creo que no tendras problemas.
__________________
@angelxab Twiiter
  #4 (permalink)  
Antiguo 10/06/2011, 11:10
Avatar de Tedel  
Fecha de Ingreso: enero-2011
Ubicación: Lima
Mensajes: 2.722
Antigüedad: 6 años, 4 meses
Puntos: 440
Respuesta: Cargar imagen paralelamente

En tres pasos:

1. Crea un subdominio
2. Pon tus imágenes allí
3. Modifica tus códigos para que tomen las imágenes del subdominio.

Explicación:

Cuando pones las imágenes en un folder dentro de tu dominio, lo que hace el navegador es descargar según su límite, por lo general 8.

Cuando pones las imágenes en un subdominio, lo que hace el navegador es descargar según su límite, por lo general 8, de cada subdominio porque lo asume como si fuere desde otra web. Lo que puede traducirse en hasta 24 descargas simultáneas (asumiendo dos subdominios).

Recomendación: Usa máximo dos subdominios.
Recomendación dos: Optimiza tus imágenes al máximo.
__________________
Soy el autor de Heptagrama y tengo un servicio "todo incluido" de marketing web.

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:29.