# Optimizaciones de imágenes para temas incrustados

**URL:** <https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170>\
**Category:** Support\
**Created:** [18 Febrero, 2021 11:14 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170 "2021-02-18T11:14:00Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![sok777](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@sok777](https://meta.discourse.org/u/sok777)\
**Post date:** [18 Febrero, 2021 11:14 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/1 "2021-02-18T11:14:00Z")

</div>

Hola a todos,  
Estoy incrustando una lista de temas de mis foros en otro sitio web.  
Funciona genial, pero las imágenes que aparecen junto a cada tema no están optimizadas.

Esto ralentiza mucho la velocidad de carga de la página. La imagen tiene un tamaño de unos 100 píxeles, pero aún así carga la imagen de calidad completa desde los foros (alrededor de 1 MB). Una versión optimizada pesa unos 90 KB, es decir, 10 veces menos.

¿Hay alguna forma de obligar a que los temas incrustados carguen la versión optimizada de cada imagen de forma predeterminada?

He revisado el JS incrustado, pero no he encontrado ninguna línea relacionada con las imágenes.  
¡Gracias!

---

<div class="post-metadata">

**Author:** ![sok777](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@sok777](https://meta.discourse.org/u/sok777)\
**Post date:** [17 Febrero, 2021 21:24 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/2 "2021-02-17T21:24:22Z")

</div>

¿Hay alguna forma de hacer que este js cargue realmente una imagen optimizada?

Las imágenes en mi incrustación tienen un tamaño de aproximadamente 100 px, pero las imágenes grandes de la comunidad ralentizan mucho la carga de la página. ¿No es posible cargar la versión optimizada de 375 px?

---

<div class="post-metadata">

**Author:** ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)\
**Post date:** [18 Febrero, 2021 14:45 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/3 "2021-02-18T14:45:36Z")

</div>

Actualmente no hay forma de hacer esto.

---

<div class="post-metadata">

**Author:** ![sok777](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@sok777](https://meta.discourse.org/u/sok777)\
**Post date:** [18 Febrero, 2021 14:59 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/4 "2021-02-18T14:59:06Z")

</div>

Agradezco la respuesta, Robin.

¿Existe alguna forma de probar con el JS para hacer esto?  
De lo contrario, la alternativa que estoy considerando es obtener una lista de publicaciones usando POST y luego crear divs para estos temas por mi cuenta. Aunque no estoy seguro de lo sencillo que sería esto.

---

<div class="post-metadata">

**Author:** ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)\
**Post date:** [18 Febrero, 2021 17:27 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/5 "2021-02-18T17:27:01Z")

</div>

Los temas están incrustados como un iframe, por lo que usar JavaScript será muy difícil. Te resultaría más fácil escribir un plugin o, como mencionaste, llamar directamente a la API para lograr lo que deseas.

Aceptaría una solicitud de incorporación (pull request) en el núcleo para agregar una opción para tamaños de imagen más pequeños si te sientes cómodo con Ruby.

---

<div class="post-metadata">

**Author:** ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)\
**Post date:** [18 Febrero, 2021 20:49 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/6 "2021-02-18T20:49:34Z")

</div>

He trasladado tu otra pregunta a este tema para mantener todo organizado.

---

<div class="post-metadata">

**Author:** ![sok777](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@sok777](https://meta.discourse.org/u/sok777)\
**Post date:** [18 Febrero, 2021 21:37 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/7 "2021-02-18T21:37:25Z")

</div>

No hay problema. Lo siento por la duplicación.

---

<div class="post-metadata">

**Author:** ![sok777](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@sok777](https://meta.discourse.org/u/sok777)\
**Post date:** [18 Febrero, 2021 22:02 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/8 "2021-02-18T22:02:12Z")

</div>

Gracias. Logré hacer eso, pero tengo dificultades para encontrar la versión optimizada de cada foto… Debe haber un enlace fijo para obtener las imágenes optimizadas, ¿verdad?

---

<div class="post-metadata">

**Author:** ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)\
**Post date:** [19 Febrero, 2021 14:34 UTC](https://meta.discourse.org/t/image-optimizations-for-embedded-topics/180170/9 "2021-02-19T14:34:49Z")

</div>

Lo siento, ¿qué enfoque estás adoptando?
