Dopo numerosi anni di realizzazione di siti con WordPress penso sia inevitabile iniziare a chiedersi cosa ci sia sotto il cofano: con questo breve articolo cercherò di fare luce su questo importante pezzo dell’ecosistema FOSS (Free and Open Source Software) che permette la creazione di siti, blog e soprattutto quotidiani (che permettono di tenere viva l’informazione).

L’ottimizzazione dello stack di WordPress

Cominciamo con l’elencare gli ingredienti necessari:

Un server Windows oppure Linux (nel prosieguo dell’articolo io ho usato una Ubuntu 21.04 per testare la configurazione) anche virtualizzato (io ho usato VirtualBox, sempre FOSS)
Un Webserver (e qui potete sbizzarrirvi tra quelli FOSS come Nginx, Apache, etc. oppure quelli commerciali come Litespeed)
Un database (qui non è obbigatorio andare su MySQL perché MariaDB va molto bene anch’esso ed è Open Source)
PHP (al momento in cui scrivo PHP è alla 8.x e WordPress gira ma non è garantita la compatibilità con i numerosi temi e plugin) – (tra l’altro l’aumento di prestazioni tra la 7.x e una 8.x è del 2% circa su operazioni comuni)
Un sistema di caching come Redis
Fine-tuning a manetta

È chiaro che installarsi tutta questa roba a mano porta via tanto tempo (specialmente per quanto riguarda l’ultimo punto); sarebbe molto comodo avere un qualcosa che automatizzi una parte del lavoro.

La buona notizia è che esistono diversi stack “precotti” per WordPress in giro, la cattiva è che non tutti sono così buoni.

In questo articolo daremo un’occhiata a due dei principali stack per WordPress: Bitnami e WordOps (concentrandoci maggiormente su quest’ultimo); poi aggiungeremo un modulo di Google a Nginx come ulteriore hack.

Prerequisiti

Vi serve una macchina (Windows, Linux o Mac) su cui possa girare VirtualBox (scaricabile da qui; non dimenticate di scaricare e installare anche l’Extension Pack (che però ha una licenza più restrittiva)) ed un minimo di dimestichezza con la configurazione di una macchina virtuale… nel proseguo dell’articolo proverò a dare qualche informazione aggiuntiva per facilitarvi il lavoro.

Bitnami

Cominciamo da Bitnami: Bitnami è commerciale e lo trovate già pronto sulle principali cloud; esso fa parte di VMWare (cosa che lo candida a restare un prodotto stabile nel tempo).

Bitnami mette a disposizione vari modi per installare WordPress (Docker, VM, Installer che però è deprecato, etc.): ai fini di quest’articolo basterà scaricare la loro virtual machine già pronta e importarla in VirtualBox.

La procedura è abbastanza banale ma date comunque un’occhiata all’ottima documentazione per non perdervi dettagli come la generazione della password al primo avvio e cose simili (qui il Getting Started per VirtualBox).

WordOps

WordOps è un fork del progetto EasyEngine v. 3; è tutto software FOSS. I suoi componenti sono i seguenti:

L’ultima release stabile di Nginx con il supporto a TSL 1.3 e alla compressione Brotli (più efficiente della gzip)
PHP-FPM
MariaDB 10.5 con vari tuning
Redis 6.0
Vari tuning sia ai software soprastanti che al kernel (come il TCP BBR)
Netdata
PHPMyAdmin
Git
WP-CLI

Potete leggere la lista completa di features qui.

L’installazione di WordOps è veramente semplice; sto dando per scontato che abbiate una installazione di una distro linux “pulita” (appena installata e aggiornata, senza altro software installato).

Copiando dalla home del sito il comando necessario per avere una installazione completa di WordOps:

wget -qO wo wops.cc && sudo bash wo

Mentre se volessi mettere up un sito sul dominio example.com con PHP 7.3 e Redis darei solamente:

sudo wo site create example.com --php73 --wpredis

Pagespeed

Google Pagespeed è un software FOSS sviluppato da Google. Esso ci permette di fare varie cosette interessanti ma noi lo useremo quasi escusivamente per autoconvertire le immagini nel formato WebP senza intervenire con plugin su WordPress.

Allora dovremo:

compilare sia il webserver (Nginx) che il modulo (Pagespeed)
poi prenderemo il modulo e lo andremo a mettere nel posto giusto
fatto questo dovremo aggiungere la corretta configurazione al sito oppure non funzionerà nulla 😉

Tutti gli step sono descritti benissimo in questo tutorial che ho usato io stesso: https://www.howtoforge.com/how-to-install-nginx-with-google-pagespeed-on-ubuntu-20-04/.

Mentre per quanto riguarda la configurazione (che vi ricordo va caricata in /var/www/example.com/conf/nginx/ per il dominio example.com) potreste usare questa:

#Configurazione

#Scarica le librerie js da google
pagespeed EnableFilters canonicalize_javascript_libraries;

# Rimuove spazi unnecessari
pagespeed EnableFilters collapse_whitespace;

# adds a response header that matches each meta tag with an http-equiv attribute
pagespeed EnableFilters convert_meta_tags;

# Elimina immagini ripretute
pagespeed EnableFilters dedup_inlined_images;

# Extend Cache
pagespeed EnableFilters extend_cache;
pagespeed EnableFilters extend_cache_pdfs;

# Hint Resource Preloading
pagespeed EnableFilters hint_preload_subresources;

# Include JavaScript Source Maps
pagespeed EnableFilters include_js_source_maps;

# CSS
pagespeed EnableFilters inline_import_to_link;
pagespeed EnableFilters move_css_above_scripts;
pagespeed EnableFilters move_css_to_head;
pagespeed EnableFilters prioritize_critical_css;
pagespeed EnableFilters rewrite_css;
pagespeed EnableFilters fallback_rewrite_css_urls;
pagespeed EnableFilters rewrite_style_attributes_with_url,rewrite_css,rewrite_images;

# Local Storage Cache
pagespeed EnableFilters local_storage_cache;

# Minify JavaScript
pagespeed EnableFilters rewrite_javascript;

# DNS pre-fetch
pagespeed EnableFilters insert_dns_prefetch;

#Trim URLS
pagespeed EnableFilters trim_urls;

# Ottimizzazione Immagini
pagespeed EnableFilters recompress_images;
pagespeed EnableFilters convert_to_webp_animated;
pagespeed EnableFilters insert_image_dimensions;

Passo e chiudo

Direi che vale sicuramente la pena di provare WordOps anche per vedere come si comporta in una situazione reale; la documentazione è buona e, con l’aggiunta di Pagespeed, le performance migliorano decisamente 😉 .

Flavio Albano

Civil Engineer by mistake of youth, Seo Engineer by vocation. Antifascist. Antiracist. He/Him. μολὼν λαβέ! Want more? Google Me!

Lo stack di WordPress? Ottimizziamolo con WordOps!

Indice