El Widget de Chat Construido para
Desarrolladores Next.js
Añade chat en vivo a tu app Next.js sin paquetes npm, configuraciones de build o penalizaciones de Lighthouse. Una etiqueta script. Listo.
Por Qué los Desarrolladores Next.js Eligen Este Widget
Cero Impacto en Build
Sin paquetes npm. Sin configuración de webpack. Sin sobrecarga en tiempo de build. Solo una etiqueta script que se carga de forma asíncrona.
Compatible con Lighthouse
3 KB comprimido, carga asíncrona, sin layout shift. Tus Core Web Vitals se mantienen verdes.
Privacidad Primero
Sin cookies. Sin rastreo. Compatible con GDPR por defecto. Perfecto para apps Next.js conscientes de la privacidad.
Instalación
Añade a tu layout.tsx o _app.tsx. Eso es todo.
import Script from 'next/script'
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
{children}
<Script
src="https://cdn.thechatwidget.com/widget.js"
data-site-id="YOUR_SITE_ID"
strategy="lazyOnload"
/>
</body>
</html>
)
}import Script from 'next/script'
export default function App({ Component, pageProps }) {
return (
<>
<Component {...pageProps} />
<Script
src="https://cdn.thechatwidget.com/widget.js"
data-site-id="YOUR_SITE_ID"
strategy="lazyOnload"
/>
</>
)
}Usando strategy="lazyOnload" garantiza cero impacto en la carga inicial de la página.
Cómo se Compara
La mayoría de los widgets de chat perjudican el rendimiento de tu app Next.js. Este no.
| Característica | The Chat Widget | Intercom | Crisp |
|---|---|---|---|
| Tamaño del Bundle | 3 KB | ~100 KB | ~180 KB |
| Paquete npm Requerido | No | Opcional | Opcional |
| Impacto en Lighthouse | Ninguno | -5 to -15 pts | -10 to -20 pts |
| Cookies | Ninguno | Sí | Sí |
| Precio Inicial | Gratis | $39/mo | $25/mo |
Preguntas Frecuentes
¿Funciona con Next.js App Router?
Sí. El widget se carga mediante una etiqueta script usando el componente Script integrado de Next.js, por lo que funciona perfectamente con App Router y Pages Router.
¿Afectará mi puntuación de Lighthouse?
No. Con 3 KB y strategy="lazyOnload", el widget se carga después de que la página sea interactiva. Cero impacto en LCP, FID o CLS.
¿Necesito instalar un paquete npm?
No. No hay paquete que instalar, ni dependencias que gestionar, ni configuración de build. Solo añade la etiqueta Script y listo.
¿Funciona con Vercel?
Sí. El widget se sirve desde una CDN global con caché en edge, por lo que se carga rápido en despliegues de Vercel en todo el mundo.
¿Puedo personalizar la apariencia del widget?
Sí. Puedes personalizar la posición, colores y mensaje de bienvenida a través de tu panel. No se requieren cambios de código.
¿Listo para añadir chat a tu app Next.js?
Plan gratuito disponible. No se requiere tarjeta de crédito. La configuración toma 60 segundos.