현재 10 만 페이지 웹 사이트에서 작업 중이며, 현재 디자인은 5 년 넘게 유지되었으며, 연속 업데이트로 인해 4 개의 12,000+ CSS 파일이 생성되었습니다.
CSS가 다루기 어려워졌고, 많은 스타일이 복제되었으며 실제로 얼마나 많은 스타일이 사용되고 있는지 알기가 거의 불가능합니다.
우리는 축소 할 수 있지만 이것은 실제로 문제를 해결하는 것이 아니라 불가피한 재 작업을 지연시키는 것입니다.
그래서 세 가지 질문은 거기 도구 에 대한 거기는 ...
답변:
http://unused-css.com/ 당신이 요구하는 것들 중 일부를 수행합니다.
Latish Sehgal 은 사용하지 않는 CSS 클래스를 찾아 제거하기 위해 Windows 응용 프로그램을 작성했습니다. 나는 그것을 테스트하지 않았지만 설명에서 html 파일과 하나의 CSS 파일의 경로를 제공해야합니다. 그런 다음 프로그램은 사용되지 않은 CSS 선택기를 나열합니다. 스크린 샷에서이 목록을 내보내거나 새로운 클린 CSS 파일을 다운로드 할 수있는 방법이없는 것 같습니다. 또한 서비스가 하나의 CSS 파일로 제한된 것처럼 보입니다. 정리할 파일이 여러 개인 경우 하나씩 정리해야합니다.
Dust-Me Selectors 는 사용하지 않는 CSS 선택기를 찾는 Firefox 확장 (v1.5 이상)입니다. 보고있는 페이지의 모든 스타일 시트에서 모든 선택기를 추출한 다음 해당 페이지를 분석하여 사용되지 않는 선택기를 확인합니다. 그런 다음 데이터를 저장하여 후속 페이지를 테스트 할 때 선택기가 발견 될 때 목록에서 벗어날 수 있습니다. 이 도구는 전체 웹 사이트를 거미줄로 만들 수 있지만 안타깝게도 작동시킬 수 있습니다. 또한 스타일을 제거한 CSS 파일을 구성하고 다운로드 할 수 있다고 생각하지 않습니다.
Liquidcity CSS cleaner 는 정규식을 사용하여 한 페이지의 스타일을 확인하는 PHP 스크립트입니다. HTML 코드에서 사용할 수없는 클래스를 알려줍니다. 이 솔루션을 테스트하지 않았습니다.
Deadweight 는 CSS 범위 도구입니다. 스타일 시트와 URL 세트가 제공되면 실제로 사용되는 선택기 및 "안전하게"삭제할 수있는 목록이 결정됩니다. 이 도구는 루비 모듈이며 rails 웹 사이트에서만 작동합니다. 사용하지 않는 선택기는 CSS 파일에서 수동으로 제거해야합니다.
헬륨 CSS는 웹 사이트의 많은 페이지에서 사용되지 않는 CSS를 발견하기위한 자바 스크립트 도구입니다. 먼저 테스트하려는 페이지에 javascript 파일을 설치해야합니다. 그런 다음 청소를 시작하려면 헬륨 기능을 호출해야합니다.
UnusedCSS.com은 사용하기 쉬운 인터페이스를 갖춘 웹 응용 프로그램입니다. 사이트의 URL을 입력하면 CSS 선택기 목록이 나타납니다. 각 선택기의 숫자는 선택기가 몇 번이나 사용되는지 나타냅니다. 이 서비스에는 몇 가지 제한이 있습니다. @import 문은 지원되지 않습니다. 새로운 클린 CSS 파일을 구성하고 다운로드 할 수 없습니다.
CSSESS 는 모든 사이트에서 사용하지 않는 CSS 선택기를 찾는 데 도움이되는 책갈피입니다. 이 도구는 사용하기 쉽지만 깨끗한 CSS 파일을 구성하고 다운로드 할 수는 없습니다. 사용하지 않는 CSS 파일 만 나열합니다.