O Widget de Chat Construído para
Desenvolvedores Next.js
Adicione chat ao vivo ao seu app Next.js sem pacotes npm, configurações de build ou penalizações do Lighthouse. Uma tag script. Pronto.
Por Que Desenvolvedores Next.js Escolhem Este Widget
Zero Impacto no Build
Sem pacotes npm. Sem configuração de webpack. Sem sobrecarga no tempo de build. Apenas uma tag script que carrega de forma assíncrona.
Compatível com Lighthouse
3 KB compactado, carregamento assíncrono, sem layout shift. Seus Core Web Vitals permanecem verdes.
Privacidade Primeiro
Sem cookies. Sem rastreamento. Compatível com GDPR por padrão. Perfeito para apps Next.js conscientes da privacidade.
Instalação
Adicione ao seu layout.tsx ou _app.tsx. É isso.
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" garante zero impacto no carregamento inicial da página.
Como Compara
A maioria dos widgets de chat prejudica o desempenho do seu app Next.js. Este não.
| Recurso | The Chat Widget | Intercom | Crisp |
|---|---|---|---|
| Tamanho do Bundle | 3 KB | ~100 KB | ~180 KB |
| Pacote npm Necessário | Não | Opcional | Opcional |
| Impacto no Lighthouse | Nenhum | -5 to -15 pts | -10 to -20 pts |
| Cookies | Nenhum | Sim | Sim |
| Preço Inicial | Grátis | $39/mo | $25/mo |
Perguntas Frequentes
Funciona com Next.js App Router?
Sim. O widget carrega via uma tag script usando o componente Script integrado do Next.js, então funciona perfeitamente com App Router e Pages Router.
Afetará minha pontuação do Lighthouse?
Não. Com 3 KB e strategy="lazyOnload", o widget carrega após a página ser interativa. Zero impacto em LCP, FID ou CLS.
Preciso instalar um pacote npm?
Não. Não há pacote para instalar, nem dependências para gerenciar, nem configuração de build. Apenas adicione a tag Script e pronto.
Funciona com Vercel?
Sim. O widget é servido de uma CDN global com cache em edge, então carrega rápido em implantações do Vercel em todo o mundo.
Posso personalizar a aparência do widget?
Sim. Você pode personalizar a posição, cores e mensagem de boas-vindas através do seu painel. Nenhuma mudança de código necessária.
Pronto para adicionar chat ao seu app Next.js?
Plano gratuito disponível. Nenhum cartão de crédito necessário. A configuração leva 60 segundos.