¡Hola!
¡Estoy muy emocionado por esta nueva función! He estado esperando una solución como esta durante mucho tiempo, y los primeros comentarios de nuestros lectores en Tecnoblog han sido excelentes: les encanta tener la comunidad integrada.
Sin embargo, tras algunas pruebas en entornos reales, he detectado varios obstáculos técnicos que debemos superar para que esto se sienta como un sistema de comentarios verdaderamente nativo y, lo más importante, para que sea sostenible en sitios con alto tráfico.
Esto es lo que he encontrado hasta ahora:
1. Rendimiento y carga del servidor
Nuestra carga de servidor aumentó significativamente después de incrustar la aplicación completa. Al revisar Cloudflare, nuestro volumen de solicitudes se multiplicó por 10. Aquí algunas ideas para optimizarlo:
- Carga diferida (Lazy Loading): Implementar la carga diferida para el JavaScript ayuda mucho (ya estoy usando un workaround para esto).
<script type="text/javascript">
DiscourseEmbed = {
discourseUrl: '<?php echo esc_url($discourse_url); ?>',
<?php if ($use_topic_id): ?>
// Modo ID: Tópico guardado en la base de datos, inmune a cambios de URL
topicId: <?php echo intval($topic_id); ?>,
<?php else: ?>
// Modo URL: Fallback cuando la creación vía API falla
discourseEmbedUrl: '<?php echo esc_url($permalink); ?>',
<?php endif; ?>
fullApp: true,
embedHeight: '800px',
};
(function() {
var container = document.getElementById('discourse-comments');
// Verifica si el navegador soporta IntersectionObserver
if ('IntersectionObserver' in window) {
var observer = new IntersectionObserver(function(entries, observer) {
entries.forEach(function(entry) {
if (entry.isIntersecting) {
// Cuando el div entra en pantalla, carga el script
loadDiscourse();
observer.unobserve(entry.target);
}
});
}, { rootMargin: "1500px" }); // Carga 1500px antes de llegar al div
observer.observe(container);
} else {
// Fallback para navegadores antiguos
loadDiscourse();
}
function loadDiscourse() {
var d = document.createElement('script');
d.type = 'text/javascript';
d.async = true;
d.src = window.DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
}
})();
</script>
Aquí puedes ver cómo disminuyó el número de solicitudes después de implementar la carga diferida (y algunas partes del sitio web aún estaban en caché, así que no es el resultado final):
-
Reducción del payload: ¿Podemos reducir los recursos cargados dentro del incrustado? Por ejemplo: noté consultas para URLs de Chat y verificaciones de créditos de IA… ¿son necesarias para la vista incrustada?
-
Frecuencia de solicitudes: Las solicitudes POST en tiempo real son un poco agresivas. ¿Quizás podamos reducir la frecuencia de sondeo para la versión incrustada?
-
Caché: Mejorar la gestión de caché para temas incrustados para manejar picos de tráfico.
2. Caos en las analíticas
Actualmente, el incrustado está ejecutando scripts de Google Analytics/GTM. Esto está duplicando nuestras visitas a la página (una por la publicación y otra por el iframe), lo que distorsiona nuestros datos. Sería ideal que el sistema detectara que está dentro de un iframe y desactivara automáticamente cualquier script de seguimiento (incluidas las analíticas de Discourse).
3. El problema de la altura del iframe
Este es probablemente el mayor obstáculo para la experiencia de usuario (UX). Si una publicación no tiene comentarios, aparece un espacio vacío extraño. Si tiene un hilo largo, el iframe se corta después de los primeros 2 o 3 comentarios, obligando a un “desplazamiento dentro de un desplazamiento”, lo cual es bastante malo, especialmente en móviles.
Para competir realmente con algo como Disqus, necesitamos que la altura sea dinámica (según la cantidad de comentarios) y también tener un botón “Leer más” que expanda el hilo después de cierto número de respuestas.
4. Conflictos de complementos
Dado que el incrustado carga todos los complementos activos, estamos viendo comportamientos extraños. Por ejemplo, “Google One Tap” aparece dentro de la publicación del blog. Cuando un usuario inicia sesión, el iframe se actualiza y lo lleva a la página principal de la comunidad en lugar de al hilo de comentarios. Poder desactivar manualmente complementos específicos para la vista incrustada sería un salvavidas.
5. Fricción en el inicio de sesión
El flujo actual es un poco un asesino de conversiones: el usuario hace clic en iniciar sesión → se abre una nueva pestaña → se inicia la sesión → el usuario queda en la página principal de la comunidad. De vuelta en la publicación del blog, el iframe sigue pareciendo desconectado hasta que el usuario actualiza manualmente toda la página. Es un ciclo confuso que hace que la gente se rinda y se vaya antes de comentar.
Desde que activamos el nuevo incrustado, nuestros registros diarios se han más que duplicado, lo cual es genial. Sin embargo, nuestras métricas de participación no han cambiado en absoluto. De hecho, nuestra relación DAU/MAU ha bajado: tenemos más usuarios conectados, pero no están interactuando. Métricas como “Usuarios activos diarios”, “Nuevos contribuyentes” y “Publicaciones” no han mostrado ningún aumento.
Esto demuestra que la gente quiere unirse a la conversación, pero se pierden en el ciclo de inicio de sesión y abandonan la publicación antes de poder comentar realmente.
6. Interfaz de usuario móvil
En móviles, la ventana de respuesta ocupa toda la pantalla, por lo que pierdes todo el contexto de la conversación a la que estás respondiendo. Se siente un poco claustrofóbico… cualquier cosa que podamos hacer para mantenerla más compacta sería una gran victoria.
Realmente quiero hacer de esto el sistema predeterminado para Tecnoblog (y también para otro sitio que poseemos). ¡Avísame si quieres profundizar en alguno de estos puntos!