Slide 1

Slide 1 text

preencoded.png WP Performance: hosting, best practice e miglioramenti nativi per tutti Obiettivo: esplorare le performance native migliorate di WordPress, i vantaggi di hosting ottimizzati e le best practice per siti performanti. Francesco Grasso Senior Software Engineer – YITH – Newfold Digital

Slide 2

Slide 2 text

preencoded.png Perchè ”performance matters” Miglioramento del rank ( posizionamento ) sui motori di ricerca Miglioramento delle conversioni Riduzione delle risorse necessarie e carbon footprint

Slide 3

Slide 3 text

preencoded.png Hosting e Cache Server Cache Come funziona: Memorizza pagine statiche per velocizzare il caricamento. Configurazione su hosting comuni: • NGINX: Utilizzare fastcgi_cache e definire percorsi per la cache in nginx.conf. • Apache: Abilitare mod_cache e configurare CacheEnable per directory specifiche. Benefici: riduce il carico sul database e sul server PHP, migliora i tempi di risposta per pagine ad alta frequenza di accesso.

Slide 4

Slide 4 text

preencoded.png Hosting e Cache Object Cache •Come funziona: Le query frequenti vengono salvate in memoria per essere riutilizzate senza bisogno di interrogare nuovamente il database. •Strumenti: Utilizzo di Redis o Memcached per gestire la cache. •Benefici: • Riduzione del carico sul database, specialmente durante picchi di traffico. • Miglioramento dei tempi di risposta per richieste ripetute. •Configurazione: Plugin come Redis Object Cache possono essere utilizzati per integrare facilmente la cache negli ambienti WordPress.

Slide 5

Slide 5 text

preencoded.png Hosting e Cache Cache tramite CDN Accelera la consegna di contenuti statici. •Come funziona: I file statici (immagini, CSS, JS) vengono memorizzati nei server del Content Delivery Network più vicini agli utenti. •Servizi: Cloudflare, AWS CloudFront. •Benefici: • Riduzione della latenza. • Maggiore affidabilità in caso di traffico elevato.

Slide 6

Slide 6 text

preencoded.png Miglioramenti Recenti di WordPress Formati immagine moderni WordPress supporta nativamente WebP e AVIF. Lazy loading di default Le immagini e iframe vengono caricati solo quando sono visibili nell'area di visualizzazione. Traduzioni con file PHP Offrono tempi di caricamento ridotti e maggiore efficienza nei server con opcache attivo. Ottimizzazioni del Core Rimozione di codice legacy e caricamento condizionale delle risorse.

Slide 7

Slide 7 text

preencoded.png Cos'è il Lazy Load? Definizione Tecnica che carica immagini e iframe solo quando sono visibili nel viewport dell'utente. Benefici • Riduce il tempo di caricamento iniziale della pagina. • Minore consumo di banda per contenuti non visualizzati. • Miglioramento del ranking SEO grazie a tempi di caricamento più rapidi. • Aumento dello score in strumenti come Google PageSpeed Insights. Implementazione in WordPress Lazy load è abilitato di default dalla versione 5.5. Personalizzabile tramite filtri per escludere elementi specifici.

Slide 8

Slide 8 text

preencoded.png Traduzioni Performanti in PHP Definizione I file di traduzione in PHP sono caricati direttamente come codice eseguibile, mentre i file .po/.mo richiedono parsing aggiuntivo. Benefici Velocità: Le traduzioni in PHP sono fino al 40% più veloci rispetto ai file .mo. Efficienza server: Sfruttano l'OpCache per migliorare ulteriormente i tempi di risposta. Come attivarle 1. Aggiornare WordPress alla versione 6.1 o successiva. 2. Convertire i file .mo esistenti in file PHP utilizzando il comando WP-CLI. 3. Verificare che il tema/plugin utilizzi i file PHP per le traduzioni.

Slide 9

Slide 9 text

preencoded.png Block Editor e Performance 1 Output HTML ottimizzato Rispetto ai page builder tradizionali 2 Caricamento condizionale delle risorse Per blocchi specifici 3 Compatibilità con tecniche moderne Lazy loading, formati immagine moderni Il Block Editor di WordPress offre significativi miglioramenti delle performance rispetto ai tradizionali page builder, grazie a un output HTML ottimizzato, al caricamento condizionale delle risorse per blocchi specifici e alla compatibilità con tecniche moderne come il lazy loading e i formati immagine avanzati.

Slide 10

Slide 10 text

preencoded.png Risorse Condizionali e Critical CSS Caricamento Risorse Condizionali Tecnica per caricare CSS e JS solo per i blocchi utilizzati nella pagina corrente. Benefici: Riduzione del peso della pagina e miglioramento dei tempi di caricamento. Implementazione Utilizzo del sistema di asset registration nativo di WordPress per caricare file in modo condizionale. Critical CSS Tecnica che inietta gli stili CSS essenziali per il rendering iniziale direttamente nell'header della pagina. Benefici: Migliora il Largest Contentful Paint (LCP) e riduce il tempo percepito di caricamento.

Slide 11

Slide 11 text

preencoded.png Risorse Condizionali e Critical CSS function enqueue_block_specific_assets() { if ( has_block( 'core/gallery' ) ) { wp_enqueue_style( 'gallery-block-styles' ); } } add_action( 'wp_enqueue_scripts', 'enqueue_block_specific_assets' );

Slide 12

Slide 12 text

preencoded.png Ottimizzazioni Aggiuntive Identificare Risorse Non Necessarie Strumenti per l'ottimizzazione: Query Monitor e Asset CleanUp Plugin. function dequeue_unnecessary_scripts() { if (!is_page('contatti')) { wp_dequeue_script('plugin-contact-form-js'); } } add_action('wp_enqueue_scripts', 'dequeue_unnecessary_scripts'); Disabilitare Funzionalità Non Necessarie • Rimozione di filtri Duotone • Script per emoji • Stili Gutenberg • Feed RSS non necessari Conclusione Riepilogo: Hosting e cache come base, Performance Lab e block editor per ottimizzazioni native, tecniche per personalizzare le performance. Grazie per l'attenzione!

Slide 13

Slide 13 text

preencoded.png Ottimizzazioni Aggiuntive remove_filter('render_block', 'wp_render_duotone_support’); remove_action('wp_head', 'print_emoji_detection_script', 7); wp_dequeue_style('wp-block-library’); remove_action('wp_head', 'feed_links_extra', 3); remove_action('wp_head', 'feed_links', 2); Disabilitare Funzionalità Non Necessarie

Slide 14

Slide 14 text

preencoded.png Performance Lab Plugin Che cos'è? Plugin ufficiale del Performance Team di WordPress, progettato per migliorare le performance native del CMS. Perché usarlo? Supporto a formati immagine moderni (WebP/AVIF) per una migliore compressione, con un miglioramento dei tempi di caricamento fino al 30% rispetto a JPEG e PNG. Funzionalità chiave Ottimizzazione Critical CSS, controlli avanzati sulle immagini, lazy loading ottimizzato, analisi di problemi di performance dalla dashboard. Funzionalità in beta Rilevamento di immagini sovradimensionate, miglioramenti nelle API REST.

Slide 15

Slide 15 text

preencoded.png WP Performance: un futuro più veloce •Hosting e cache come base per una buona infrastruttura. •Performance Lab e block editor per ottimizzazioni native e continue. •Strumenti e tecniche per personalizzare le performance del tuo sito WordPress rimuovendo le risorse non necessarie scenario per scenario. Grazie per l'attenzione!