Hola matake, soy de Bolivia,
Justamente casi la misma inquietud me preocupaba estos dias en un proyecto:
- realmente no se cual de esos dos metodos funciones más rapido.
- me voy por otra solucion.
- imagina que tengo 2 columnas de un catalogo de productos por 20 filas.
- lo que voy a hacer es que solo carguen las imagenes que sean visibles en pantalla
- si digamos el usuario no llega a ver el final de la pagina, esas imagens de el catalogo no se van a cargar, en su lugar habra una imagen de un reloj cargando ¿me dejo entender?
- ¿en que beneficia? pues ahorras ancho de banda.
- pero seria mejor tener esas imagenes en un CDN para que la experiencia de el usuario sea de lo mejor, igual no se como andara funcionando en un hosting compartido normal(si funcionan pero dependera de la saturacion de tu servidor)
- tu duda acerca de varias consultas al servidor es un poco tonta segun mi parecer, porque la consulta es minima y luego lo que importa es la imagen del catalgo que va a cargar que sera de 20kb a 120 kb por ejemplo(la peticion al servidor),
- ...entonces no te preocupes por la peticion de consulta al servidor si puedes ahorrarte 500KBs en imagenes que quizas no se vera el usuario. (la interaccion entre usuario y tu pagina sera mejor)
Aqui hay un ejemplo de lo que venia diciendo, catalogo de imagenes cargandose segun vayas viendo:
-
https://wrapbootstrap.com
La solución es un plugin para jquery llamado:Jquery Async Image Loader (JAIL)
puedes descargarlo en:
https://github.com/sebarmeli/JAIL trae mas de 10 ejemplos de su uso, con iframes y ajax que decias.
Espero te haya servido, saludos cordiales.