Aller au contenu
snorklee
Connexion Démarrer gratuitement
Fonctionnalités Trafic IA Tarifs Manifeste Aide Audit Contact Connexion Démarrer gratuitement

Installazione Next.js

Next.js dispone di un componente <Script> ottimizzato per caricare script di terze parti senza bloccare il rendering. Questo è il metodo consigliato.

App Router (Next 13+)

In app/layout.tsx:

import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html lang="it">
      <body>
        {children}
        <Script
          id="snorklee"
          src="https://snorklee.com/w.js"
          data-site="IL_TUO_ID_SITO"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}

Pages Router (Next 12 e precedenti)

In pages/_document.tsx o pages/_app.tsx:

import Script from 'next/script';

// nel componente radice, dopo gli altri script
<Script
  id="snorklee"
  src="https://snorklee.com/w.js"
  data-site="IL_TUO_ID_SITO"
  strategy="afterInteractive"
/>;

Note

  • Strategia afterInteractive: lo script si carica dopo l'idratazione, senza bloccare il rendering iniziale.
  • L'attributo id è richiesto da Next per la deduplicazione.
  • Per le route dinamiche, lo snippet viene inserito una sola volta (nel layout); le transizioni client-side sono tracciate automaticamente dal nostro listener popstate/pushState.