Hace unos meses, @Johani lanzó un excelente componente de tema para cargar imágenes de forma diferida (lazy load). Esto significa que las imágenes solo se cargan a medida que aparecen en la vista al hacer scroll, en lugar de cargarse tan pronto como aparecen en cualquier parte de la página, incluso si aún no son visibles para el usuario.
Esto es algo muy útil en foros donde los temas contienen muchas imágenes, especialmente para usuarios con conexiones de ancho de banda limitado.
Si conoces algunos de los detalles más técnicos de Discourse, podrías preguntar: “Oye, @eviltrout, ¿no hace Discourse esto ya de alguna manera? Haces scroll infinito y los mensajes se cargan y descargan de la memoria a medida que el usuario hace scroll”. ¡Sí, es cierto! Pero generalmente lo hacemos en “trozos”, y en algunos tableros de imágenes un solo mensaje podría tener docenas de imágenes grandes. ¿Por qué cargarlas todas a la vez si aún no son visibles?
En las versiones más recientes de Discourse, ahora cargamos de forma diferida las imágenes grandes, sin necesidad de componentes o plugins adicionales. Si haces scroll muy rápido, verás una versión borrosa de baja resolución de una imagen grande como marcador de posición. Se verá algo así:
detalles técnicos: generamos una imagen muy, muy pequeña de 10x10 píxeles con 32 colores y la almacenamos como un URI de datos en el mensaje, que el navegador escala al tamaño correcto; esto termina ocupando alrededor de ~300 bytes
One thing I’m looking into is applying this to non-lightboxed images, such as those included via oneboxing links.
One issue is it’s a little tricky to know when to apply the logic, since we don’t know the filesize of the destination image. Originally my plan was to append the filesize of images, but it turns out that is quite tricky since we don’t always have a downloaded copy of the image available.
I think I’ll have to come up with a magic width x height, maybe 300x300px or so, and if the image has dimensions larger than that it’ll be lazy loaded. We do have those dimensions available regardless of onebox or upload.
Web bloat I find this article to be a good one on the subject of slow connections, do bear in mind that it has a very minimalistic theme, so don’t judge it by it’s cover so to speak. It might not quite be applicable here, but it’s always good to keep in mind.
I sometimes wish there were ways with Web APIs to detect if someone is on a connection where they pay a lot for bandwidth or one that’s slow.
Yeah I am not sure what the downside will be of going all the way down to 50x50, as long as we do not hit emojis it should be good. Even at 50x50 we may still save 25x if you don’t end up looking at the image
That is completely unrelated. Max allowed image size is controlled in site settings. We already lightbox and thumbnail all images that are posted above a certain size. This is about topics with dozens or hundreds of images in them, not the size of any single image.
Man, I thought I was going crazy. This feature is great for low bandwidth, but now i’m seeing this lazy loading all over the place when I am scrolling our forum. I have so much bandwidth and I’m on a computer. Maybe there should be some sort of buffer around areas you can’t see that load right before you scroll to them? Maybe only for mobile?
Is there anyway that the admin can still play with CSS to modify the lazy loading behavior? The somewhat unintended consequence is that some users are now saying that pictures load on demand more slowly compared to before. I was wondering if its possible to modify the CSS such that instead of either loading all pictures in the next e.g. 20 posts (prior behavior) or pictures only in the current post (current behavior), that we do something in the middle, e.g. load pictures in the next e.g. 3-5 posts.
He estado teniendo problemas con la carga diferida cada vez más últimamente; veo esto al menos una vez al día. Es difícil de reproducir, pero me pregunto si hay algo que pueda hacer para solucionar este problema cuando ocurra. Lo único relacionado en los registros es esto:
Es muy difícil de reproducir. Entré en modo seguro y tuve que navegar por unas 30 publicaciones antes de encontrar finalmente una que no funcionaba. Esta vez no hay errores relacionados en los registros. Estoy tratando de evitar el tiempo de inactividad de probar cada complemento, por eso espero que pueda haber algunas pistas en otro lugar para determinar cuál podría ser el culpable. Gracias, Jeff.
