Un nuovo evento personalizzato
hydrationDone è stato introdotto nella preview. Questo evento viene emesso quando la preview del Funnel o del sito web ha completato la propria idratazione, consentendo all'utente di 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 l'idratazione della preview fosse completata. Questo disallineamento temporale poteva causare un flusso di esecuzione errato e compromettere la funzionalità prevista del codice personalizzato.
In precedenza, gli utenti potevano riscontrare problemi in cui i propri script personalizzati venivano eseguiti prima che l'idratazione della preview fosse completata. Questo disallineamento temporale poteva causare un flusso di esecuzione errato e compromettere la funzionalità prevista del codice personalizzato.
Come abbiamo risolto il problema?
- Emettendo l'evento 'hydrationDone' al completamento dell'idratazione della preview, abbiamo eliminato efficacemente questa fonte di conflitto.
- Gli utenti possono aggiungere un listener sull'evento
hydrationDoneed eseguire il codice successivo. Questo è particolarmente utile quando si tenta di manipolare il contenuto del DOM.
Come si utilizza?
- Aggiungi un elemento codice nel builder
- Ascolta l'evento
hydrationDonecome mostrato di seguito
document.addEventListener( "hydrationDone", () => { // Aggiungi il tuo JavaScript personalizzato qui })
- Una volta che il contenuto DOM della preview è caricato e l'evento di idratazione è ricevuto, il codice personalizzato verrà eseguito senza problemi né race condition.
Nota: Potrebbe essere necessario disabilitare l'ottimizzazione del JavaScript se il codice personalizzato dell'utente è critico al caricamento della pagina, poiché ritarda l'evento di idratazione in assenza di interazione da parte dell'utente.
Ecco come dovrebbe apparire il tuo JavaScript/HTML personalizzato: