Ich arbeite derzeit an einer 100.000-Seiten-Website, das aktuelle Design ist seit über 5 Jahren vorhanden und die sukzessiven Updates haben zu vier 12.000+ CSS-Dateien geführt.
Offensichtlich ist das CSS unhandlich geworden, viele der Stile sind dupliziert und es ist fast unmöglich zu wissen, wie viele der Stile tatsächlich verwendet werden.
Wir können das reduzieren, aber das Problem nicht wirklich angehen, nur die unvermeidlichen Nacharbeiten hinauszögern.
Also drei Fragen gibt es Werkzeuge da draußen für ...
Ссылка Hat etwas von dem, was Sie fragen, und sie haben folgendes zu sagen: -
Latish Sehgal hat geschrieben eine Windows-Anwendung, um nicht verwendete CSS-Klassen zu finden und zu entfernen. Ich habe es nicht getestet, aber aus der Beschreibung müssen Sie den Pfad Ihrer HTML-Dateien und eine CSS-Datei angeben. Das Programm listet dann die nicht verwendeten CSS-Selektoren auf. Auf dem Screenshot sieht es so aus, als ob es keine Möglichkeit gibt, diese Liste zu exportieren oder eine neue saubere CSS-Datei herunterzuladen. Es sieht auch so aus, als ob der Dienst auf eine CSS-Datei beschränkt ist. Wenn Sie mehrere Dateien haben, die Sie bereinigen möchten, müssen Sie sie nacheinander säubern.
Dust-Me Selectors ist eine Firefox-Erweiterung (für Version 1.5 oder höher), die nicht verwendete CSS-Selektoren findet. Es extrahiert alle Selektoren aus allen Stylesheets auf der angezeigten Seite und analysiert dann diese Seite, um festzustellen, welche dieser Selektoren nicht verwendet werden. Die Daten werden dann gespeichert, so dass beim Testen nachfolgender Seiten Selektoren bei ihrem Auftreten von der Liste abgeschnitten werden können. Dieses Tool soll in der Lage sein, eine ganze Website zu spinnen, aber ich könnte es leider zum Laufen bringen. Außerdem glaube ich nicht, dass Sie die CSS-Datei mit den entfernten Stilen konfigurieren und herunterladen können.
Liquidcity CSS Cleaner ist ein PHP-Skript, das reguläre Ausdrücke verwendet, um die Stile einer Seite zu überprüfen. Es teilt Ihnen die Klassen mit, die im HTML-Code nicht verfügbar sind. Ich habe diese Lösung nicht getestet.
Deadweight ist ein CSS-Coverage-Tool. Mit einer Reihe von Stylesheets und einer Reihe von URLs wird festgelegt, welche Selektoren tatsächlich verwendet werden und welche Listen "sicher" gelöscht werden können. Dieses Tool ist ein Ruby-Modul und funktioniert nur mit der Rails-Website. Die nicht verwendeten Selektoren müssen manuell aus der CSS-Datei entfernt werden.
Helium CSS ist ein JavaScript-Tool zum Auffinden von nicht verwendetem CSS auf vielen Seiten einer Website. Sie müssen zuerst die JavaScript-Datei auf der Seite installieren, die Sie testen möchten. Dann müssen Sie eine Heliumfunktion aufrufen, um mit der Reinigung zu beginnen.
UnusedCSS.com ist eine Webanwendung mit einer einfach zu bedienenden Benutzeroberfläche. Geben Sie die URL einer Site ein und Sie erhalten eine Liste mit CSS-Selektoren. Für jeden Selektor zeigt eine Zahl an, wie oft ein Selektor verwendet wird. Dieser Service unterliegt einigen Einschränkungen. Die @ import-Anweisung wird nicht unterstützt. Sie können die neue bereinigte CSS-Datei nicht konfigurieren und herunterladen.
CSSESS ist ein Bookmarklet Das hilft Ihnen, unbenutzte CSS-Selektoren auf jeder Site zu finden. Dieses Tool ist ziemlich einfach zu benutzen, aber es lässt Sie keine sauberen CSS-Dateien konfigurieren und herunterladen. Es werden nur nicht verwendete CSS-Dateien aufgelistet.
Wenn Sie Visual Studio verwenden, hilft diese Erweiterung beim automatischen Zusammenführen CSS-Klassen.
Tags und Links javascript css regex