La nuova Interactivity API di WordPress

A partire dalla versione 6.5, il team di WordPress ha introdotto, per gli sviluppatori, la nuova Interactivity API: un sistema standardizzato di direttive progettato per la realizzazione dell’interattività lato front-end con i blocchi di WordPress. L’obiettivo principale dell’API è fornire agli sviluppatori un metodo efficiente e semplice per la gestione dell’interattività del front-end tramite i blocchi di Gutenberg, facilitando la creazione di esperienze utente dinamiche e coinvolgenti.

Perché usare la WordPress Interactivity API?

Innanzitutto, è importante sapere che questa nuova API non va a rompere né è in contrasto con tutto quello che è stato già fatto. Infatti, la sua adozione rimane facoltativa e, soprattutto, è possibile adottarla gradualmente. Questo significa che i blocchi interattivi che non utilizzano questa API possono coesistere, in un progetto, con quelli che la utilizzano.

Approccio dichiarativo

L’Interactivity API adotta un approccio dichiarativo, che consente agli sviluppatori di definire cosa deve accadere piuttosto che come implementarlo, come avviene per i moderni framework di sviluppo quali React, Vue, Svelte o Alpine. Usando un approccio dichiarativo, l’interfaccia utente si aggiorna automaticamente in base allo stato corrente e alle sue modifiche. Come sviluppatori, dobbiamo dichiarare lo stato necessario, le azioni che modificano lo stato e quali parti del DOM dipendono da quali parti dello stato.

Totale integrazione con le API WordPress esistenti e gli standard web

L’Interactivity API è concepita per integrarsi perfettamente con l’ecosistema WordPress e gli standard del web. Le direttive, implementate come attributi HTML, si adattano perfettamente ai blocchi dinamici e PHP, garantendo il rispetto degli standard web. Inoltre, l’API è retrocompatibile con il sistema di hook di WordPress e supporta l’API di traduzione principale.

Prestazioni elevate e leggerezza

Per garantire prestazioni elevate, l’API utilizza Preact.js, una libreria JavaScript leggera e performante, compatibile con l’API di React.

Rendering lato server e idratazione

L’Interactivity API supporta il rendering lato server dei blocchi, consentendo a WordPress di generare l’HTML iniziale con lo stato interattivo corretto, fornendo un rendering iniziale più veloce. Dopo il rendering iniziale, lato client, l’Interactivity API si occupa automaticamente di abilitare aggiornamenti e interazioni dinamiche senza richiedere ricaricamenti completi della pagina. Questo approccio, si sa, combina il meglio di entrambi i mondi: i vantaggi SEO e prestazionali del rendering tradizionale lato server di WordPress e le interfacce utente dinamiche e reattive offerte dai moderni framework JavaScript.

Comunicazione tra i blocchi

L’Interactivity API offre un sistema standard tramite il quale i blocchi possono comunicare facilmente tra loro. Con uno standard, questa comunicazione è gestita di default. Se blocchi diversi usano approcci diversi, la comunicazione tra blocchi diventa più complessa e quasi impossibile quando sviluppatori separati creano blocchi.

Curiosità

L’API Interactivity era stata inclusa in WordPress 6.4 come API privata che poteva essere utilizzata solo da alcuni blocchi del Core.

A partire dalla versione 6.5 è stata data la possibilità agli sviluppatori di utilizzarla (il blocco navigazione e immagine ad esempio utilizzano già quest’api).

Infine per riassumere ecco l’immagine ufficiale rilasciata dal team WordPress che riassume i benefici dell’approccio della nuova API.

A presto per i nuovi articoli.