Glossario

Glossario: Single-page application

Le Single-Page Application (o più comunemente SPA) sono delle applicazioni o dei siti web interamente costruiti su un’unica pagina.

Nel momento in cui si visita la pagina, il sito carica fin da subito tutte le risorse necessarie per la navigazione: il codice HTML, il JavaScript e i CSS.

Tipicamente queste pagine vengono sviluppate con vari framework JavaScript come AngularJS o React. Questo fa sì che il sito reagirà ad ogni azione come se fosse un’applicazione desktop, dato che tutti i file sono già stati compilati nel PC.

La pagina potrà cambiare il suo contenuto dinamicamente, ma l’URL rimarrà sempre la stessa.

In sostanza, queste pagine offrono una navigazione molto rapida e, di conseguenza, un’ottima user experience 🙂

Come vengono create le single-Page Application?

Queste applicazioni vengono solitamente sviluppate con uno dei seguenti Framework JavaScript:

  • AngularJS
  • Ember.JS
  • ExtJS
  • Knockout.js
  • Meteor.js
  • React
  • Vue.js

Problemi delle SPA

La fluidità di queste applicazioni rende la navigazione molto più rapida e più soddisfacente. Tuttavia, ci sono anche dei lati negativi da tener conto:

  • il primo caricamento della pagina risulta più lento del solito, in quanto vengono caricati subito tutti gli elementi necessari alla navigazione
  • la web analytics deve essere adattata ad hoc, dato che tutto il contenuto del sito verrà visualizzato senza cambi di pagine

Primo Caricamento

Si può ammortizzare il peso del caricamento di pagina, inserendo dei lazy load all’interno del sito oppure facendo caricare alcuni contenuti dopo che l’utente compie una certa azione. Insomma, si può posticipare il caricamento di alcuni elementi.

Questa tecnica viene spesso applicata alle immagini e ai video, dato che sono file abbastanza pesanti.

Web analytics

Il fatto che esista una singola pagina può comportare dei problemi anche alla web analytics, in quanto scatterà soltanto il Page View all’accesso del sito.

Questo accade perché vengono caricati solo dei frammenti di dati, quindi il tracking non vedrà nessun cambiamento.

Ma secondo te mi sono fatto fermare da questo intoppo? Neanche per sogno!

Ho escogitato un #Barbatrucco grazie a Google Tag Manager, ovviamente! Scoprilo nella mia guida: Come Tracciare le Single Page Application con Google Tag Manager

A presto e… Buon Tag!

Matteo Zambon

Recent Posts

Attribuzioni errate in GA4: cause e soluzioni al problema

Negli ultimi mesi hai notato in Google Analytics 4 un calo improvviso e inspiegabile nelle…

3 mesi ago

Come creare una Dashboard Ecommerce per analizzare i dati degli acquisti Nuovi e di Ritorno

Se ti trovi su questa guida è perché hai compreso che solo attraverso la Data…

4 mesi ago

Consent Mode v2 e calo dei dati delle audience e del traffico in Google Ads: cause e soluzioni

Da quando hai configurato la Consent Mode v2 (CM v2) hai notato cali improvvisi o…

6 mesi ago

Data Leak Google: Chrome e le implicazioni per la Privacy e la Digital Analytics

Premesso che non è possibile conoscere l'esatto funzionamento né di Chrome, né degli algoritmi di…

6 mesi ago

Come creare Report in GA4 per analizzare campagne advertising e marketing con UTM

Da quale canale di marketing arriva il maggior numero di conversioni? Quale campagna di marketing…

6 mesi ago