Add the #DF24 Developer Keynote to your agenda. Join us in-person on 9/18 at 2:30 p.m. PT or on Salesforce+ at 5 p.m. PT for the must-see session built just for developers.

Elenco di controllo delle best practice di pre-creazione e go-live

Benvenuti nel mondo di Storefront Composable! Questo elenco di controllo riassume i punti chiave che possono avere un forte impatto sulla tempistica del proprio progetto. Concentrandosi su queste quattro best practice si potranno affrontare meglio le complessità della creazione, del lancio e del monitoraggio di un sito PWA (Progressive Web App) di successo ed evitare le insidie più comuni. Utilizzare questa lista per pianificare una distribuzione senza intoppi.

Salvo diversa indicazione, tutti questi punti si applicano ai siti creati al 100% su Composable Storefront o con implementazioni headless in fasi.

Occorre riconoscere il proprio potere in materia di personalizzazione e comprendere l'ambito della personalizzazione richiesta per soddisfare le proprie esigenze aziendali. Ricordare che un sito altamente personalizzato richiede uno sforzo maggiore, come descritto in questi esempi.

  • Acquisire familiarità con la progettazione e le funzionalità disponibili nella nostra Retail React App. Le funzionalità non disponibili nell'app Retail React App vanno create.
  • Utilizzare il più possibile i componenti React esistenti. PWA Kit utilizza React, quindi si ha accesso all'ecosistema di componenti React. Se è richiesto qualcosa di personalizzato, controllare se esiste un componente Chakra ad hoc. In caso contrario, cercare una versione open source. Se non esiste una versione open source, creare il componente in prima persona.
  • Verificare che le nostre API supportino le funzionalità personalizzate richieste e restituiscano i dati desiderati. Se le nostre API non lo fanno, è possibile:
    • Creare un'API personalizzata per restituire i dati; o
    • Estendere la risposta API utilizzando un hook
  • Confermare che i cartridge e le integrazioni del proprio sito funzionino con un'implementazione headless. Per utilizzarli in un sito PWA Kit, è possibile esporre le loro funzionalità utilizzando API o hook personalizzati.

Gettare solide basi per un sito stabile e scalabile seguendo questi passaggi.

  • Decidere il numero di ambienti MRT (Managed Runtime) di produzione. Avere più ambienti dà un maggiore controllo. Ma più ambienti si hanno, più diventa complicato gestirli dal punto di vista operativo. Ad esempio, se si dispone di cinque brand che fanno capo allo stesso ambiente MRT, sarà sempre necessario aggiornarli insieme. Avere meno ambienti significa meno sovraccarico operativo. Vedere Panoramica di Managed Runtime.
  • Decidere se utilizzare la nostra rete eCDN o una rete CDN di terze parti. Vedere Quando utilizzare una CDN di terze parti. Se si decide di utilizzare una rete CDN di terze parti, consultare la documentazione del fornitore per i dettagli.
  • Decidere la propria strategia in materia di URL. La maggior parte dei clienti sceglie di mantenere gli URL esistenti. Pianificare il reindirizzamento di tutti gli URL attuali che non esisteranno sul nuovo sito. Iscriversi agli strumenti di Google Search Console o ad altri strumenti di posizionamento per monitorare l'effetto dell'implementazione sul proprio posizionamento SEO. Vedere Routing.
  • Decidere gli obiettivi, l'ambito e la tempistica per un'implementazione ibrida (headless in fasi). Tenere presente che più a lungo il sito è in modalità ibrida e più tempo va dedicato alla complessità operativa corrispondente. Impostare una data di scadenza per la transizione a un sito 100% Composable. Vedere Implementazioni headless in fasi.

Applicare queste tecniche per ottimizzare l'efficienza e l'esperienza utente del sito.

  • Esaminare il rendering di lato server delle pagine di ingresso (home page, pagine di elenco categorie, pagine di elenco prodotti e pagine di dettagli prodotto) aggiungendo il parametro ?__server_only ai propri URL. Verificare che le pagine renderizzate dal server dispongano di dati sufficienti per i crawler e che il cambiamento di layout tra server e client risulti ridotto (o possibilmente assente). Questo può aiutare a migliorare il posizionamento SEO, confermare che le pagine di ingresso possono essere caricate rapidamente sui dispositivi mobili e migliorare l'esperienza degli acquirenti.
  • Configurare il test delle prestazioni utilizzando Lighthouse CI. Iniziare i test delle prestazioni a metà dell'implementazione. Ciò consente di identificare e correggere eventuali regressioni delle prestazioni (rispetto al sito corrente) molto prima del lancio del sito PWA Kit.
  • Configurare la distribuzione continua del codice in un ambiente MRT non di produzione. Fin dall'inizio del lavoro di sviluppo, iniziare a testare il codice distribuito in MRT per verificare che le funzionalità del sito funzionino come previsto. In questo modo è possibile evitare costose rilavorazioni in un secondo momento. Vedere Utenti automatizzati.

È consigliabile utilizzare uno di questi strumenti per monitorare costantemente le prestazioni del sito. Verificare inoltre che i dati generati da questi strumenti siano corretti sulla base dei risultati previsti.

  • Con Log Center è possibile esaminare errori e metriche. Impostare le notifiche in modo da poter scoprire quando il proprio storefront funziona in modo anomalo e poter indagare.
  • Utilizzare Active Data per monitorare le metriche del sito. Si può così analizzare il comportamento degli acquirenti in modo da poter migliorare la loro esperienza e ottimizzare le offerte di prodotti per favorire maggiori vendite.
  • Reports & Dashboards di B2C Commerce fornisce i dati che possono essere utilizzati per identificare i trend temporali e prendere decisioni aziendali più intelligenti sulla base dei dati di B2C Commerce.

Rivedere il flusso di lavoro per sviluppatori per la creazione di un sito con Composable Storefront. Vedere Guida introduttiva a Composable Storefront.