Как оптимизировать мою таблицу стилей, удалив несоответствующие и / или ненужные селекторы CSS

Question

Я унаследовал огромную таблицу стилей со многими тысячами селекторов, и я уверен, что многие из них не нужны и никогда не соответствуют элементам на сайте. В интересах оптимизации я хотел бы удалить те осиротевшие селекторы / правила.

Существуют ли какие-либо инструменты, которые позволили бы мне сравнить CSS со всем сайтом, чтобы определить, какие селекторы требуются, а какие нет?

На сайте есть AJAX-компоненты, поэтому написание сценария curl / wget для обхода сайта, а затем циклического обхода каждого селектора и grep для совпадения также неосуществимо (хотя это было бы забавно ...)

Все предложения приветствуются.

Спасибо, JD

Answer 1

Существует плагин Firefox под названием "Dust-Me Selectors".

https://addons.mozilla.org/en-US/firefox/addon/5392/

"Извлекает все селекторы из всех таблиц стилей на странице, которую вы просматриваете, затем анализирует эту страницу, чтобы определить, какие из этих селекторов не используются. Затем данные сохраняются, чтобы при тестировании последующих страниц селекторы вычеркнул список, как они встретились ".

Это довольно ручной процесс, но он может быть тем, что вы ищете.

Answer 2

Вы можете попробовать один из многих онлайн-оптимизаторов, таких как этот:

http://www.cleancss.com/

Robson Compressor, очевидно, лучше всего справляется с объединением и удалением избыточных селекторов.

http://iceyboard.no -ip.org / projects / css_compressor

Некоторые из онлайн-оптимизаторов имеют возможность удалять неиспользуемые селекторы.

Answer 3

проверка CSS Coverage (расширение для Firebug) http://perishablepress.com/press/2010/06/21/how-to-micro-optimize-your-css/

На мой взгляд, лучше, чем dust-me selectcor