Muro social 
Feed Analytics 
Has ejecutado PageSpeed Insights. El informe se ha teñido de rojo. ¿Y cuál es el culpable? Tus contenidos incrustados de redes sociales, señalados como los responsables de las bajas puntuaciones. Ahora todos los artículos que encuentras dicen lo mismo: simplemente elimínalos.
He hablado con muchos propietarios de sitios web que se encuentran precisamente en esta situación. Les encanta su feed. Es una prueba social que les ayuda a conseguir conversiones. Pero les da miedo que sea la causa de que su sitio web vaya lento, y preferirían no eliminarlo.
Así que realicé las pruebas yo mismo. Un sitio de WordPress: incrustaciones sin formato frente a un feed de plugin, medido con PageSpeed Insights, Chrome DevTools y Pingdom.
Las cifras me sorprendieron incluso a mí. En una prueba, al eliminar el código incrustado, el peso de la página se redujo en casi un 90 % y el tiempo de bloqueo pasó de 4.510 ms a cero.
Te voy a explicar por qué se ha marcado tu feed, cuánto cuesta y cómo mantenerlo mientras superas los Core Web Vitals. Hay una forma difícil y otra fácil, y voy a hablar de ambas.
- Respuesta rápida: ¿Tienes que borrar tu feed de redes sociales?
- Por qué PageSpeed ha marcado tu feed (no es lo que piensas)
- Por qué «bórralo y ya está» no es la solución adecuada
- Cuánto cuesta realmente tu feed de redes sociales (lo hemos calculado)
- La forma difícil frente a la forma fácil de solucionar esto
- Cómo las campañas de Smash Balloon contribuyen a cada indicador
- ¿Funciona esto también con otras fuentes de Smash Balloon? (Sí, la solución es la misma)
- Mantén tu feed. Supera los Core Web Vitals. Empieza ya.
Respuesta rápida: ¿Tienes que borrar tu feed de redes sociales?
No. No tienes que borrar nada.
El feed nunca fue el verdadero problema. El problema es el código incrustado sin procesar que has pegado. Ese iframe o oEmbed de terceros carga un reproductor completo antes de que nadie haga clic en nada.
Sustituye ese código de incrustación sin procesar por un feed nativo de WordPress. Carga las imágenes de forma diferida y retrasa la carga del reproductor, de modo que tu página se cargue más rápido, incluso aunque tus incrustaciones funcionen a la perfección.
Esto es lo que protege cada corrección:
- Prescinde del iframe, aplica la carga diferida a las imágenes y utiliza el formato WebP. Esta es la mejora cuantificable. Reduce el peso de la página y acelera el «Largest Contentful Paint», precisamente el punto en el que fallaban las incrustaciones sin procesar.
- Reserva espacio para cada imagen. Esto mantiene estable tu diseño y evita el desplazamiento acumulativo del diseño.
- Aplaza la carga del reproductor externo hasta que alguien haga clic. De este modo, se evita que el navegador se ralentice, por lo que la página sigue respondiendo con rapidez y no se cuelga mientras se carga.
Hay una forma difícil y otra fácil de hacerlo. Te mostraremos las dos. La forma fácil es la mejor.
Por qué PageSpeed ha marcado tu feed (no es lo que piensas)
¿Por qué PageSpeed ha señalado precisamente tu feed de redes sociales? Porque no te has limitado a añadir un feed. Has añadido un reproductor multimedia completo.
Esta es la parte que la mayoría de la gente pasa por alto. Ese código oEmbed de Instagram o la incrustación de YouTube no se limita a mostrar una foto discretamente. Carga el reproductor completo de la plataforma, los scripts y el iframe en el momento en que se carga la página.
No cuando alguien hace clic. Antes de que nadie haga nada.
Así que el navegador deja de cargar tu página y va primero a recuperar el código de Instagram o YouTube. Esa recuperación consume muchos recursos. Y ocurre en el peor momento posible.
En mi propia prueba con Pingdom en una página de WordPress, nueve vídeos incrustados de YouTube sin procesar descargaron unos 7,5 MB de código del reproductor antes de que nadie pulsara el botón de reproducción.
Eso suponía aproximadamente el 92 % del peso de la página. Solo eran jugadores que estaban ahí, cargándose.
Eso es lo que influye en tu «Largest Contentful Paint», que no es más que la rapidez con la que se carga tu contenido principal. El reproductor se cuela delante de tu contenido real y hace que el visitante tenga que esperar.
Ahora imagina una página con más de un elemento incrustado. Cada uno de ellos repite todo el contenido.
Todo ese código también satura el hilo principal, el único canal que utiliza tu navegador para responder a los clics y toques. Cuando se satura, hay otras dos cosas que se ven afectadas:
- Tu «Interaction to Next Paint», es decir, la rapidez con la que reacciona la página cuando alguien pulsa sobre ella.
- Tu «Cumulative Layout Shift», que se refiere a los elementos que se desplazan cuando aparece contenido tardío.
Así que PageSpeed no se equivoca. Detecta que la página es lenta. Simplemente señala «el feed», cuando el verdadero problema es el reproductor de terceros integrado en él.
El «feed» es la parte que te interesa. La carga del reproductor es la parte que no te interesa.
Por qué «bórralo y ya está» no es la solución adecuada
Esta es la parte en la que tienes razón. Los vídeos incrustados en formato RAW son realmente lentos. Mi propia prueba lo ha demostrado, y a continuación te mostraré las cifras.
Piensa en lo que te aporta tu feed. Es una prueba social. Muestra a personas reales utilizando tu producto, opiniones reales y publicaciones reales. Eso genera confianza, y la confianza impulsa las ventas.
Eliminarlo para superar una prueba de velocidad es un mal negocio. Conseguirías una puntuación ecológica, pero perderías lo que te ayuda a convertir.
Así que la verdadera disyuntiva nunca fue «conservarlo» o «borrarlo». Esa es una falsa disyuntiva.
La verdadera elección es esta:
- Un código incrustado sin procesar se inserta en el reproductor pesado de la plataforma y hace que tus métricas bajen.
- Un feed de plugin nativo muestra las mismas entradas, pero carga las imágenes de forma diferida y retrasa la carga del reproductor.
El mismo contenido. La misma prueba social. Una velocidad muy diferente que ofrece a tus visitantes una mejor experiencia.
Sigue leyendo. Todas las soluciones a partir de aquí se basan en ese único cambio.
Cuánto cuesta realmente tu feed de redes sociales (lo hemos calculado)
Ya conoces la teoría. Ahora, estas son las cifras.
Realicé una prueba real en una página web pública de WordPress utilizando incrustaciones sin procesar en una versión y un feed de plugin en la otra. Realicé las mediciones con PageSpeed Insights, Chrome DevTools y Pingdom.
Esto es lo que provocaron en esa página nueve códigos de incrustación de YouTube sin procesar y cómo lo modificó el feed del plugin:
| Lo que he medido | Códigos incrustados sin procesar | Canal de plugins |
|---|---|---|
| Código de YouTube cargado | 8,8 MB (el 92 % del peso de la página) | 457 KB (una reducción de aproximadamente el 95 %) |
| Tiempo total de bloqueo | 4.510 ms | 0 ms |
| Índice de velocidad móvil | 15.1s | 4.9s |
| Puntuación de PageSpeed para dispositivos móviles | 49 | 72 |
| Puntuación de PageSpeed para ordenadores de sobremesa | 52 | 99 |
Fíjate en esa primera fila. Se han cargado casi 8,8 MB de código del reproductor de YouTube antes de que nadie pulsara el botón de reproducción.
Eso suponía aproximadamente el 92 % de toda la página. El plugin lo redujo en un 95 % aproximadamente, hasta los 457 KB.
El «Tiempo total de bloqueo» pasó de 4.510 ms a cero. Ese es el tiempo que la página permanece bloqueada, sin poder responder a ningún toque. Está directamente relacionado con el «Tiempo de interacción hasta el siguiente renderizado».
A continuación, comprobé toda la página en Pingdom para confirmarlo. Los resultados coincidían. La página incrustada sin procesar ocupaba 8,4 MB y generaba 176 solicitudes.
En comparación, la página de feeds del plugin de WordPress ocupaba 1,1 MB y requería 42 solicitudes.
Dos herramientas distintas, probadas en la misma página, que arrojaron los mismos resultados.
Instagram mostró el mismo resultado a menor escala. Una incrustación en iframe que funcionaba alcanzó un tiempo de «Largest Contentful Paint» en móvil de 3,2 s. Eso no es aceptable.
Sin embargo, el mismo número de publicaciones de Instagram incrustadas en el feed de un plugin tardó 2,3 s en cargarse.
Te lo cuento todo con total transparencia, para que puedas confiar en lo demás. Hay un par de cosas que hay que matizar.
- Algunas incrustaciones sin procesar mostraron un LCP de vídeo más bajo en el laboratorio. Se trataba de un artefacto. El navegador utilizado para la prueba no pudo mostrar la miniatura. Para los visitantes reales, el LCP sería más alto.
- La cifra de LCP de Instagram corresponde a una única prueba, así que considérala una referencia útil, no una conclusión definitiva.
- Esta es una página de prueba. Las cifras variarán en función de tu tema, tu proveedor de alojamiento y tu contenido.
Te estoy indicando los puntos débiles a propósito. La cuestión no es una cifra perfecta, sino la magnitud de la diferencia y que las dos herramientas coincidan en ella.
¿Quieres comprobar tu propia web? Ejecuta PageSpeed Insights, abre Chrome DevTools y prueba la página en Pingdom. Son las mismas tres herramientas que he utilizado yo. Puedes volver a calcular todos los valores anteriores.
La forma difícil frente a la forma fácil de solucionar esto
Así que quieres mantener la señal y aprobar el examen. Hay dos formas de conseguirlo.
Una es manual. Todas las correcciones se realizan a mano. La otra es un complemento que realiza esas correcciones por ti.
Ambas opciones funcionan. Pero no suponen el mismo esfuerzo. Déjame mostrarte lo que realmente cuesta cada una.
El método manual: programarlo tú mismo a mano
¿Quieres arreglarlo tú mismo, a mano? Puedes hacerlo. Es que hay mucho código y, en realidad, nunca se acaba.
Esta es una breve explicación de lo que significa «hacerlo tú mismo». Tendrías que ir abordando cada uno de estos pasos, uno por uno:
- Elimina el código oEmbed. Quita el código de incrustación sin procesar que carga el reproductor pesado.
- Aloja tú mismo las miniaturas. Descarga cada imagen y publícala en tu propio sitio web.
- Añade el ancho y la altura a cada imagen. De este modo, se reserva el espacio necesario para que tu diseño no se desplace.
- Crea una fachada. Muestra una imagen falsa del reproductor y carga el reproductor real de YouTube solo cuando alguien haga clic.
- Carga las imágenes de forma diferida. Indica al navegador que omita las imágenes hasta que aparezcan en la pantalla al desplazarse.
- Convierte cada imagen a WebP manualmente. Este es el formato más ligero que me dio buenos resultados en mi prueba.
Esa es la configuración. Ahora viene la parte de la que nadie te avisa.
Tienes que mantenerlo todo. Cada vez que Instagram o YouTube cambian su sintaxis, tu código puede dejar de funcionar. Y entonces tienes que volver a ello y arreglarlo otra vez.
Es un trabajo válido. Es un trabajo honrado. Pero tendrás que estar pendiente de él para siempre.
La forma más sencilla: un plugin de feeds nativo de WordPress
Esta es la opción más sencilla. Utiliza un plugin de feeds nativo de WordPress, como Smash Balloon, y él se encargará de todos los pasos anteriores por ti.
No hace falta programar nada. El complemento elimina el código de incrustación, aloja las imágenes en su propio servidor y las carga de forma diferida, reserva el espacio, sirve el formato WebP y retrasa la aparición del reproductor hasta que se haga clic. Todo ello, de forma autónoma.
Esa es toda la lista de manuales, gestionada automáticamente. Aunque no seas un experto en tecnología, podrás configurarlo.
Y no eres el primero en probarla. Smash Balloon cuenta con más de 1,75 millones de usuarios activos y tiene una valoración de 4,9 estrellas sobre 5.
Ese tipo de adopción dice mucho. Muchos propietarios de sitios web ya han optado por la vía más sencilla, y ha dado buenos resultados. A continuación, te voy a mostrar exactamente cómo protege cada métrica.
Cómo las campañas de Smash Balloon contribuyen a cada indicador
Entonces, ¿cómo puede un solo complemento proteger estas tres métricas a la vez? Se centra precisamente en lo que las perjudica: la carga de peso inicial.
Cada corrección se corresponde con una métrica. Aquí tienes la versión sencilla.
| Mecanismo | Para qué sirve |
|---|---|
| No se carga ningún reproductor de terceros ni ningún iframe de forma previa | Elimina el código pesado del reproductor antes de que nadie haga clic |
| Optimización de imágenes WebP | Muestra imágenes más ligeras que se descargan más rápido |
| Carga diferida y almacenamiento en caché inteligente | Carga las imágenes solo cuando es necesario y, a continuación, las almacena en la caché |
Fíjate en la primera fila. Ese único cambio lo dice todo sobre mi prueba.
Nueve vídeos incrustados de YouTube sin procesar descargaron unos 8,8 MB de código del reproductor antes de que nadie pulsara el botón de reproducción.
El feed del plugin omitió eso y mostró miniaturas en su lugar. El tamaño de YouTube se redujo aproximadamente un 95 %, hasta los 457 KB.
Cuanto menos haya que cargar, más destaca tu contenido principal. Así es como superas la métrica «Largest Contentful Paint».
La segunda parte son las propias imágenes. Smash Balloon Instagram Feed Pro muestra tus fotos en formato WebP, que es más ligero. Las imágenes más ligeras se cargan más rápido y, de nuevo, eso mejora tu LCP.
La tercera parte se refiere a la sincronización y la reutilización. Las imágenes se cargan a medida que el visitante se desplaza por la página, no todas a la vez. Las imágenes almacenadas en caché se cargan rápidamente en la siguiente visita.
Por eso los datos del laboratorio evolucionaron de esa manera. El feed no se aligeró por arte de magia. Se aligeró porque el reproductor nunca se cargaba hasta que alguien lo solicitaba.
Las mismas publicaciones que ven tus visitantes. La misma prueba social que has creado. Pero con mucho menos peso detrás.
¿Funciona esto también con otras fuentes de Smash Balloon? (Sí, la solución es la misma)
¿Esto solo funciona para Instagram? No. Es la misma solución para todos los feeds de Smash Balloon.
En el caso de YouTube, el complemento asociado es YouTube Feed Pro. Mismo funcionamiento, mismo resultado: primero las miniaturas y luego el reproductor cuando se solicite.
La causa principal nunca cambia. Un código «raw embed» carga desde el principio el pesado reproductor de la plataforma.
Por otro lado, YouTube Feed Pro muestra miniaturas y retrasa la reproducción del reproductor hasta que alguien haga clic.
Recuerda que, según las pruebas, YouTube es el que peor resultado ha obtenido de todos.
Nueve incrustaciones sin procesar de YouTube descargaron unos 8,8 MB de código del reproductor antes de que nadie pulsara el botón de reproducción. El tiempo total de bloqueo se situó en 4.510 ms.
El uso de YouTube Feed Pro cambió por completo esta situación. Mostraba los mismos vídeos como miniaturas y solo cargaba el reproductor al hacer clic. El consumo de recursos de YouTube se redujo aproximadamente un 95 % y el tiempo total de bloqueo descendió a 0 ms.
Y eso no es todo. Todos los complementos para feeds de Smash Balloon se han diseñado pensando en la velocidad y en una carga rápida. Esto incluye Facebook, Instagram, TikTok, YouTube y X (antes Twitter).
Empieza ya a acelerar tu feed
Consigue los plugins de Smash Balloon para tu feed y deja que mantengan tus Core Web Vitals en verde, mientras tu prueba social se mantiene justo donde tú quieres.
Preguntas frecuentes
Si elimino el código de inserción, ¿pierdo el feed de mi página?
No, al eliminar el código incrustado no se pierde el feed de tu página. Lo sustituyes por un bloque de feed de un plugin o por un shortcode utilizando una herramienta como Smash Balloon. Las mismas entradas, en el mismo sitio, pero mucho más ligero.
¿Acaso añadir un complemento no ralentizará aún más mi página web?
No todos los complementos ralentizan tu sitio web, por lo que añadir el adecuado no lo ralentizará aún más. Una incrustación sin procesar carga directamente el reproductor completo de la plataforma. Un complemento carga las imágenes de forma diferida y retrasa la carga de ese reproductor, razón por la cual mi prueba redujo el peso de la página en casi un 87 %.
¿Cómo puedo saber si el problema realmente está en mi fuente de datos?
Puedes comprobar en unos minutos si el problema está en tu feed. Ejecuta PageSpeed Insights y fíjate en dos cosas: el elemento LCP y las transferencias de red más grandes. Si el elemento señalado es tu código incrustado, o si los bytes más grandes corresponden a los scripts del reproductor, ahí está el problema.
¿Tengo que modificar el código para ajustar la velocidad de mis feeds de redes sociales?
No, no hace falta que toques el código. Solo tienes que instalar el plugin, conectar tu cuenta y pegar un bloque. Aunque no seas un experto en tecnología, eso es todo lo que hay que hacer.
Mantén tu feed. Supera los Core Web Vitals. Empieza ya.
Esto es lo único que vale la pena recordar. Tu feed nunca fue el problema. El problema era la incrustación sin procesar, que cargaba el reproductor completo de la plataforma antes de que nadie hiciera clic.
Sustituye ese código incrustado por un complemento de feed de redes sociales como Smash Balloon y comprueba cómo mejora la velocidad de tu sitio web, mientras que tu prueba social sigue estando justo donde debe estar.
Así que no hace falta que borres tu feed. Guárdalo y deja que se cargue en modo ligero.
La opción más sencilla es el paquete «All Access». Incluye todos los complementos de Smash Balloon para feeds, así que, tanto si estás en Instagram, YouTube, Facebook, TikTok o X, lo tienes todo cubierto.
Hazte con el paquete «All Access», cambia tu código de inserción y verás cómo tu informe de PageSpeed pasa a verde.
