Esistono buoni approcci per aiutare a identificare le definizioni CSS inutilizzate in un progetto? Sono stati inseriti un sacco di file CSS e ora sto cercando di ripulire un po 'le cose.
Esistono buoni approcci per aiutare a identificare le definizioni CSS inutilizzate in un progetto? Sono stati inseriti un sacco di file CSS e ora sto cercando di ripulire un po 'le cose.
Risposte:
Dai un'occhiata all'estensione di Firefox Dust-Me su https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/ .
Chrome Developer Tools ha una scheda Audit che può mostrare selettori CSS inutilizzati.
Eseguire un controllo, quindi, in Prestazioni pagina Web, consultare Rimuovere le regole CSS inutilizzate
Ho appena trovato questo sito - http://unused-css.com/
Sembra buono ma avrei bisogno di controllare a fondo il suo CSS "pulito" emesso prima di caricarlo su uno dei miei siti.
Inoltre, come con tutti questi strumenti, avrei bisogno di verificare che non eliminasse gli ID e le classi senza stile ma che fossero usati come selettori JavaScript.
Il contenuto di seguito è tratto da http://unused-css.com/, quindi ringrazia loro per aver consigliato altre soluzioni:
Latish Sehgal ha scritto un'applicazione Windows per trovare e rimuovere classi CSS inutilizzate. Non l'ho provato ma dalla descrizione, devi fornire il percorso dei tuoi file html e un file CSS. Il programma elencherà quindi i selettori CSS non utilizzati. Dallo screenshot, sembra che non ci sia modo di esportare questo elenco o scaricare un nuovo file CSS pulito. Sembra anche che il servizio sia limitato a un file CSS. Se hai più file che vuoi pulire, devi pulirli uno per uno.
Dust-Me Selectors è un'estensione di Firefox (per v1.5 o successive) che trova selettori CSS inutilizzati. Estrae tutti i selettori da tutti i fogli di stile sulla pagina che stai visualizzando, quindi analizza quella pagina per vedere quali di quei selettori non sono utilizzati. I dati vengono quindi archiviati in modo che durante il test delle pagine successive, i selettori possano essere cancellati dall'elenco quando vengono rilevati. Questo strumento dovrebbe essere in grado di eseguire lo spider di un intero sito Web, ma sfortunatamente potrei farlo funzionare. Inoltre, non credo che tu possa configurare e scaricare il file CSS con gli stili rimossi.
Topstyle è un'applicazione Windows che include una serie di strumenti per modificare i CSS. Non l'ho testato molto, ma sembra che abbia la possibilità di rimuovere selettori CSS inutilizzati. Questo software costa 80 USD.
Il pulitore CSS di Liquidcity è uno script php che utilizza espressioni regolari per controllare gli stili di una pagina. Ti dirà le classi che non sono disponibili nel codice HTML. Non ho provato questa soluzione.
Deadweight è uno strumento di copertura CSS. Dato un set di fogli di stile e un set di URL, determina quali selettori sono effettivamente utilizzati e gli elenchi che possono essere "sicuri" eliminati. Questo strumento è un modulo ruby e funziona solo con il sito Web di Rails. I selettori inutilizzati devono essere rimossi manualmente dal file CSS.
Helium CSS è uno strumento javascript per scoprire CSS inutilizzati su molte pagine di un sito web. Devi prima installare il file javascript nella pagina che vuoi testare. Quindi, è necessario chiamare una funzione di elio per iniziare la pulizia.
UnusedCSS.com è un'applicazione web con un'interfaccia facile da usare. Digita l'URL di un sito e otterrai un elenco di selettori CSS. Per ciascun selettore, un numero indica quante volte viene utilizzato un selettore. Questo servizio ha alcune limitazioni. L'istruzione @import non è supportata. Non è possibile configurare e scaricare il nuovo file CSS pulito.
CSSESS è un bookmarklet che ti aiuta a trovare selettori CSS inutilizzati su qualsiasi sito. Questo strumento è abbastanza facile da usare ma non ti consente di configurare e scaricare file CSS puliti. Elenca solo i file CSS inutilizzati.
Google Page Speed può farlo per te (in realtà fa molto di più che dirti quale CSS non è in uso). Su FireFox, è disponibile come componente aggiuntivo FireBug. Quindi c'è anche una versione online.
Un migliore CSS Minifier in C # dump di stili ridondanti;
Ti piacerebbe anche usare Dust-Me con questo.
Tieni presente che se ci sono contenuti che al momento non sono visibili per rispolverarmi, potresti buttare fuori gli stili di cui hai bisogno.
EDIT: il collegamento è stato interrotto ma archive.org ha sia la pagina che il codice.
Estensione Firebug per visualizzare quali regole CSS sono effettivamente utilizzate.
L'utilizzo CSS è un'estensione per Firebug (quindi necessario per avere Firebug installato) che consente di conoscere le regole di stile CSS inutilizzate. Identifica il CSS che usi e non usi. Ti consente di indicare quali parti non necessarie possono essere rimosse. Dovresti assolutamente usare questo componente aggiuntivo per mantenere i tuoi file CSS il più leggeri possibile.
Sembra che qualcuno abbia aggiornato i Selettori DustMe per lavorare di nuovo con Firefox con un nuovo nome - "CSS Roundup" http://blog.brothersmorrison.com/?p=198
L'uso di Internet Explorer Developer Toolbar , s Visualizza> CSS Selettore Partite : Visualizzare un report di tutte le regole di stile set e quante volte vengono utilizzati nella pagina corrente.
Dai un'occhiata a PageSpeed di Google per Firefox . Lo fa e molto altro ancora.
Apparentemente anche un plug-in di Chrome è in fase di sviluppo.