File Merger: ottimizzare CSS e JS

Il File Merger di SEOFuxx esamina un sito web e unisce i file CSS e JavaScript locali che selezioni.

Cosa fa attualmente il merger

Scansiona l'URL che indichi alla ricerca di file .css e .js locali e mostra tutti i risultati come elenco da spuntare. Dalla tua selezione nasce un file CSS e uno JS, se vuoi subito minimizzati (interruttore Minimizza i file).

Passo dopo passo

  1. Apri File Merger nella navigazione
  2. Inserisci il tuo dominio (ad es. https://tuo-sito.it)
  3. Clicca su Analizza sito web
  4. Scegli i file da unire
  5. Lascia attivo Minimizza i file se vuoi file il più piccoli possibile
  6. Clicca su Unisci file
Il File Merger con campo URL e il pulsante Analizza sito web
Il File Merger con campo URL e il pulsante Analizza sito web

File risultanti

Dopo l'unione sono pronti due file:

  • global.js
  • global.css

I link per il download stanno subito sotto, nello strumento.

Integrazione sul tuo sito

  1. Carica global.js e global.css sul tuo server
  2. Sostituisci i precedenti inserimenti singoli con i nuovi file
  3. Poi svuota la cache del browser e del server

Ecco come appare l'inserimento:

<link rel="stylesheet" href="/assets/global.css?v=1" />
<script src="/assets/global.js?v=1"></script>

Note importanti

Ordine in JavaScript

In JavaScript conta l'ordine. jQuery e altre librerie devono essere caricate prima dei plugin che ne hanno bisogno.

Risorse esterne

Il merger lavora solo con file locali. Ciò che arriva da un CDN non viene incluso in modo affidabile.

Dopo ogni aggiornamento del frontend

Se i tuoi file CSS o JS cambiano, devi rifare l'unione, altrimenti il tuo sito serve la versione vecchia.

Risoluzione dei problemi

Layout o funzioni rotti dopo l'unione

  • Controlla prima l'ordine dei JS
  • Escludi per prova dall'unione un file sospetto
  • Svuota la cache e testa di nuovo

File non trovato

  • I percorsi verso global.js e global.css sono corretti?
  • I file si trovano davvero sul server web?

Consiglio

Misura prima e dopo con PageSpeed Insights o Lighthouse. Così vedi se lo sforzo è valso la pena.

Questo contenuto ti è stato utile?

·