È stato introdotto un nuovo evento personalizzato hydrationDone nell'anteprima. Questo evento viene emesso quando l'anteprima del funnel/sito web ha completato la sua idratazione, così puoi eseguire codice personalizzato specifico dopo l'idratazione.

Perché è necessario?

In precedenza, gli utenti potevano riscontrare problemi in cui i propri script personalizzati venivano eseguiti prima che la nostra idratazione dell'anteprima fosse completata. Questo disallineamento temporale poteva causare un flusso di esecuzione errato e ostacolare il funzionamento previsto del codice personalizzato.

Come abbiamo risolto?

  1. Emettendo l'evento hydrationDone al termine dell'idratazione completa dell'anteprima, abbiamo eliminato efficacemente questa fonte di conflitto.
  2. Gli utenti possono aggiungere un listener sull'evento hydrationDone ed eseguire il codice successivo. Questo è particolarmente utile se si desidera manipolare il contenuto del DOM.

Come si usa?

  • Aggiungi un elemento codice nel builder
  • Ascolta l'evento hydrationDone come mostrato di seguito
document.addEventListener(
  "hydrationDone",
  () => {
     // Aggiungi qui il tuo JavaScript personalizzato
})
  • Una volta che il contenuto DOM dell'anteprima è caricato e l'evento di idratazione è ricevuto, il codice personalizzato verrà eseguito senza problemi o race condition.

Nota: Potrebbe essere necessario disabilitare l'opzione "Optimise javascript" se il codice personalizzato dell'utente è critico al caricamento della pagina, poiché ritarda l'evento di idratazione in assenza di interazione utente.

Ecco come dovrebbe apparire il tuo JavaScript/HTML personalizzato:

Schermata 1 — Evento di idratazione nel codice personalizzato nei Funnel