{"id":7182,"date":"2026-05-27T16:33:00","date_gmt":"2026-05-27T14:33:00","guid":{"rendered":"https:\/\/rafaelpatron.com\/blog\/?p=7182"},"modified":"2026-05-27T16:33:00","modified_gmt":"2026-05-27T14:33:00","slug":"seo-spa-come-aumentare-prestazioni","status":"publish","type":"post","link":"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/","title":{"rendered":"SEO per Single Page Application nel 2026: Core Web Vitals e framework moderni"},"content":{"rendered":"<p>Next.js 15 \u00e8 uscito a ottobre 2024 con React 19 supportato di default e architettura Turbopack stabilizzata. Astro 5 \u00e8 stato rilasciato a dicembre 2024 con Content Layer API che ha riscritto il modo in cui il framework gestisce i contenuti. Core Web Vitals nel 2024 ha sostituito FID con INP come metrica primaria di interattivit\u00e0. Tre cambiamenti tecnici che insieme hanno spostato il quadro operativo della SEO per Single Page Application in modo rilevante. Le scelte tecniche che facevamo nel 2022 portano oggi penalty di performance e indicizzazione. Il problema vero \u00e8 che molti progetti continuano a essere costruiti con stack obsoleti, riproponendo gli stessi errori.<\/p>\n<p>Il punto di partenza concreto resta uno: senza Server-Side Rendering o Static Site Generation, una SPA classica nel 2026 perde la partita prima ancora di scendere in campo.<\/p>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_86 counter-flat ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Indice dei contenuti<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#spa-ssr-ssg-isr-nel-2026\" >SPA, SSR, SSG, ISR nel 2026<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#nextjs-15-nel-2026\" >Next.js 15 nel 2026<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#astro-5-e-lapproccio-islands\" >Astro 5 e l&#8217;approccio islands<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#core-web-vitals-nel-2026-con-inp\" >Core Web Vitals nel 2026 con INP<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#rendering-per-crawler-ai-nel-2026\" >Rendering per crawler AI nel 2026<\/a><\/li><li class='ez-toc-page-1'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/rafaelpatron.com\/blog\/seo\/seo-spa-come-aumentare-prestazioni\/#errori-specifici-che-vedo-nei-progetti-spa-italiani\" >Errori specifici che vedo nei progetti SPA italiani<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"spa-ssr-ssg-isr-nel-2026\"><\/span>SPA, SSR, SSG, ISR nel 2026<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Una SPA pura (rendering client-side completo) era la moda del 2018-2020. React, Vue, Angular renderizzati direttamente nel browser. Per Google e per gli altri crawler, il problema strutturale \u00e8 che il contenuto viene generato dopo che il bot ha gi\u00e0 letto la pagina. Googlebot esegue JavaScript dal 2019, ma con limiti: latency aggiuntiva nel rendering, budget di crawl pi\u00f9 stretto, indicizzazione differita a un secondo passaggio.<\/p>\n<p>Per i crawler dei motori AI generativi il problema \u00e8 amplificato. ChatGPT-User, OAI-SearchBot, PerplexityBot eseguono JavaScript in modo meno consistente di Googlebot. Per molti contenuti SPA il content estratto \u00e8 solo l&#8217;HTML iniziale senza il dynamic content. Significa che la pagina viene letta vuota, e il sito \u00e8 di fatto invisibile ai motori generativi.<\/p>\n<p>SSR (Server-Side Rendering) risolve il problema renderizzando l&#8217;HTML lato server prima della consegna al browser. Il crawler riceve HTML completo, l&#8217;utente vede contenuto immediato, lo JavaScript poi idrata l&#8217;interattivit\u00e0. Next.js, Nuxt, SvelteKit, Remix supportano SSR nativamente.<\/p>\n<p>SSG (Static Site Generation) renderizza tutto a build-time. Risultato: file HTML statici servibili da CDN, performance massima, indicizzazione perfetta. Trade-off: i contenuti non cambiano in real-time, ogni modifica richiede un rebuild. Adatto a blog, documentation, marketing site.<\/p>\n<p>ISR (Incremental Static Regeneration) \u00e8 il compromesso intelligente che Next.js ha introdotto. Genera staticamente all&#8217;inizio, rigenera incrementalmente quando un contenuto specifico cambia. La maggior parte dei contenuti restano statici (veloci, indicizzabili), solo i contenuti aggiornati passano per la rigenerazione.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"nextjs-15-nel-2026\"><\/span>Next.js 15 nel 2026<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Next.js 15 ha consolidato l&#8217;App Router come default. Il vecchio Pages Router resta supportato per compatibilit\u00e0, ma i progetti nuovi partono dall&#8217;App Router. Le novit\u00e0 che impattano la SEO direttamente: streaming SSR, server components stabili, metadati con generateMetadata function, supporto per React 19 e per i Server Actions.<\/p>\n<p>Il punto operativo \u00e8 che <strong>App Router permette di scegliere rendering strategy per route<\/strong>. Una pagina marketing \u00e8 static. Una pagina di prodotto in catalogo \u00e8 ISR. Una pagina dashboard utente \u00e8 dynamic. La scelta \u00e8 per route, non per applicazione. Significa che un singolo progetto Next.js pu\u00f2 ottimizzare ogni sezione con la strategia di rendering pi\u00f9 adatta.<\/p>\n<p>Turbopack, il nuovo bundler che ha sostituito Webpack per gli ambienti dev e (sempre pi\u00f9) per i build production, ha tagliato i tempi di build del 30-50% sui progetti medi. Per chi gestisce siti grandi, \u00e8 un guadagno operativo concreto sul ciclo di sviluppo.<\/p>\n<p>L&#8217;errore tipico che vedo nei progetti Next.js \u00e8 l&#8217;uso eccessivo dei &#8220;use client&#8221; directive. Marcare tutto come client component vanifica i benefici dei server components e riporta il progetto verso un&#8217;architettura client-heavy poco SEO-friendly. La regola pratica \u00e8: usa server components di default, marca client solo dove l&#8217;interattivit\u00e0 JS \u00e8 necessaria.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"astro-5-e-lapproccio-islands\"><\/span>Astro 5 e l&#8217;approccio islands<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Astro ha un approccio diverso, particolarmente interessante per i siti content-heavy. Renderizza tutto a HTML statico per default, attiva JavaScript solo per le &#8220;islands&#8221; interattive specifiche. Risultato: bundle JavaScript a zero per la maggior parte delle pagine, performance LCP eccellente, indicizzazione perfetta.<\/p>\n<p>Astro 5 ha introdotto Content Layer API che permette di gestire contenuti da fonti diverse (markdown, CMS headless, database, API esterne) in modo unificato. Per progetti di blog, documentation, marketing site, Astro \u00e8 spesso la scelta migliore del 2026.<\/p>\n<p>Il limite di Astro \u00e8 la curva di adozione: chi viene da React puro deve adattarsi a un modello differente. Per applicazioni con molta interattivit\u00e0 JS (dashboard, app web complete) Astro non \u00e8 la scelta giusta. Per siti dove il contenuto \u00e8 il prodotto, \u00e8 quasi sempre la scelta pi\u00f9 asciutta.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"core-web-vitals-nel-2026-con-inp\"><\/span>Core Web Vitals nel 2026 con INP<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>INP (Interaction to Next Paint) ha sostituito FID (First Input Delay) come Core Web Vital primario di interattivit\u00e0 a marzo 2024. La differenza \u00e8 sostanziale. FID misurava solo la latency della prima interazione. INP misura la latency di ogni interazione lungo la sessione, considerando la peggiore. Soglie:<\/p>\n<ul>\n<li>Buono: INP sotto 200ms<\/li>\n<li>Da migliorare: tra 200ms e 500ms<\/li>\n<li>Scarso: oltre 500ms<\/li>\n<\/ul>\n<p>Per le SPA, INP \u00e8 la metrica pi\u00f9 punitiva. Le interazioni complesse (filtri, ricerche, navigazione interna) tendono a richiedere lavoro JavaScript pesante, e su mobile a medio range il problema esplode. Le tecniche di ottimizzazione INP nel 2026 girano attorno a: code splitting aggressivo, lazy loading dei componenti non visibili, debouncing delle interazioni con effetti laterali pesanti, uso di Web Workers per logica complessa, evitare re-render non necessari nei framework reactive.<\/p>\n<p>LCP (Largest Contentful Paint) resta importante. Soglia: sotto 2,5 secondi. Sui mobile italiani con connessione 4G media, raggiungere LCP sotto 2,5s richiede ottimizzazioni: immagini lazy-loaded con priorit\u00e0 per quella above-the-fold, font preload, critical CSS inline, riduzione del JavaScript bloccante.<\/p>\n<p>CLS (Cumulative Layout Shift) \u00e8 meno problematico per le SPA moderne, ma resta un punto da curare. Soglia: sotto 0,1. Le immagini senza dimensioni esplicite, gli ads injection, i font fallback con metriche diverse sono le cause pi\u00f9 comuni di CLS alto.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"rendering-per-crawler-ai-nel-2026\"><\/span>Rendering per crawler AI nel 2026<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>I crawler dei motori AI generativi hanno comportamenti diversi rispetto a Googlebot. ChatGPT-User non esegue sempre JavaScript. PerplexityBot fa fetch pi\u00f9 aggressivi ma con timeout pi\u00f9 stretti. ClaudeBot rispetta robots.txt ma \u00e8 meno tollerante con il client-side rendering.<\/p>\n<p>La pratica operativa per chi vuole essere visibile ai motori AI nel 2026 \u00e8: <strong>servire HTML completo al primo render<\/strong>. Significa SSR o SSG, mai SPA pura. Significa anche evitare contenuto critico iniettato via JavaScript dopo il primo paint. Il contenuto deve essere nel HTML che il bot legge nella prima request.<\/p>\n<p>Schema markup \u00e8 altro punto importante. Article, BreadcrumbList, FAQ, Product, Organization, Person. I motori AI pescano i dati strutturati come segnali di trust e contesto. Un sito con schema markup completo viene citato pi\u00f9 frequentemente di un sito senza, a parit\u00e0 di altri segnali.<\/p>\n<p>Robots.txt deve essere esplicito sui bot AI. La maggior parte dei siti italiani che ho audito nel 2025-2026 ha robots.txt che non considera GPTBot, ClaudeBot, PerplexityBot, OAI-SearchBot. La decisione strategica \u00e8: permettere o bloccare? Bloccare significa rinunciare alla visibilit\u00e0 nei motori generativi. Permettere significa fornire contenuti al training dei modelli. Non \u00e8 una scelta tecnica, \u00e8 una scelta editoriale che ogni publisher deve fare consapevolmente.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"errori-specifici-che-vedo-nei-progetti-spa-italiani\"><\/span>Errori specifici che vedo nei progetti SPA italiani<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Tre errori che si ripetono nei progetti che ho audito tra 2024 e 2026.<\/p>\n<p>Il primo \u00e8 il rendering interamente client-side per siti content-heavy. Magazine online, e-commerce, marketing site costruiti come SPA pure. Risultato: traffico organico inferiore del 40-70% rispetto a quello che il contenuto meriterebbe, perch\u00e9 Google indicizza tardi e i motori AI non indicizzano affatto.<\/p>\n<p>Il secondo \u00e8 l&#8217;over-engineering. Progetti che usano Next.js + GraphQL + headless CMS + Redux + 15 librerie quando un Astro con markdown porterebbe gli stessi risultati con un decimo della complessit\u00e0. La complessit\u00e0 tecnica si traduce in fragilit\u00e0 operativa, performance peggiore, costi di sviluppo pi\u00f9 alti.<\/p>\n<p>Il terzo \u00e8 il monitoraggio Core Web Vitals solo via Lighthouse o PageSpeed Insights. Sono test in modalit\u00e0 lab, ottimistici. I dati reali vengono dal CrUX e dal field monitoring (Web Vitals via JavaScript injection). Sulla base dei dati lab molti siti pensano di stare bene mentre nel mondo reale fanno scarso.<\/p>\n<p>Per chi vuole una vista pi\u00f9 ampia sulle <a href=\"https:\/\/rafaelpatron.com\/blog\/answer-engine-optimization-manuale-2026\/\">strategie AIO<\/a> e su come le architetture web influenzano la visibilit\u00e0 nei motori generativi, vale la pena considerare la performance tecnica come parte integrante della strategia di posizionamento, non come dettaglio operativo separato. La <a href=\"https:\/\/aipia.it\/formazione\/\">formazione tecnico-professionale<\/a> di chi opera nel settore richiede un&#8217;integrazione di competenze SEO classiche, AIO, e architettura web che molti corsi convenzionali non offrono ancora.<\/p>\n<p>Le SPA del 2026 ben fatte sono quelle che hanno scelto consapevolmente di non essere SPA in senso classico. SSR, SSG, ISR sono le opzioni vincenti. Client-side rendering puro \u00e8 una scelta che ha senso solo per applicazioni con dashboard pesanti dove l&#8217;indicizzazione non \u00e8 il KPI principale. Per qualsiasi altro caso, l&#8217;architettura va ripensata.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Next.js 15, Astro, Core Web Vitals con INP: come ottimizzare SPA per crawler tradizionali e AI bot nel 2026, senza compromessi sulla performance.<\/p>\n","protected":false},"author":10,"featured_media":5871,"comment_status":"","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_wds_title":"SEO per SPA 2026: Next.js, Astro, INP e Core Web Vitals","_wds_metadesc":"Single Page Application e SEO nel 2026: Next.js 15, Astro 5, Core Web Vitals con INP, rendering per crawler AI. Pratica operativa.","_wds_focus-keywords":"seo spa 2026","_wds_canonical":"","wds_primary_category":0,"footnotes":"","_wds_robots-noindex":"0","_wds_robots-nofollow":"0","_wds_opengraph-title":"","_wds_opengraph-description":"","_wds_twitter-title":"","_wds_twitter-description":""},"categories":[105],"tags":[533,531,532,66,530,529],"class_list":["post-7182","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo","tag-astro","tag-core-web-vitals","tag-nextjs","tag-seo","tag-single-page-application","tag-spa"],"_links":{"self":[{"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/posts\/7182"}],"collection":[{"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/comments?post=7182"}],"version-history":[{"count":1,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/posts\/7182\/revisions"}],"predecessor-version":[{"id":7283,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/posts\/7182\/revisions\/7283"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/media\/5871"}],"wp:attachment":[{"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/media?parent=7182"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/categories?post=7182"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rafaelpatron.com\/blog\/wp-json\/wp\/v2\/tags?post=7182"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}