Как вы можете надежно отслеживать использование CSS?

#asp.net #css #visual-studio-2010

#asp.net #css #visual-studio-2010

Вопрос:

Моя среда — Visual Studio 2010 с Resharper 6.0. У меня большой веб-сайт с множеством файлов CSS со многими стилями.

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

Мое единственное решение — выполнить поиск в файлах в VS, но, очевидно, когда у вас большое количество стилей, это оказывается слишком медленным и громоздким.

У кого-нибудь было подобное затруднительное положение?

РЕДАКТИРОВАТЬ: Стоит упомянуть, что сайт представляет собой CMS, содержащую около 10 000 страниц, поэтому все, что требует просмотра страниц, также может быть немного сложным.

Комментарии:

1. Голосование и добавление в избранное. Надеюсь, кто-нибудь знает хороший инструмент! : D

Ответ №1:

Существует расширение firefox под названием dust me selector, которое делает это. Вы включаете его, а затем переходите на каждую страницу. Он отслеживает все используемые css. Вы создаете новый файл css со всеми отслеживаемыми стилями css.

Комментарии:

1. Жаль, что это не поддерживается для ff 7. 🙁

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

3. Когда вы учитываете такие вещи, как изменения на стороне сервера и клиента в классах, может быть сложно определить каждый элемент, но, я думаю, вы могли бы стремиться к примерно 90% из них.

Ответ №2:

Расширение Web Essentials Visual Studio имеет функцию BrowserLink, которая позволяет отслеживать неиспользуемый css на вашем сайте во время просмотра сайта.

Комментарии:

1. Да, я знаю, но я хотел бы разделить записи CSS в нескольких файлах. Webessential может помочь в этом?

2. @coma: я пытаюсь его использовать, кажется интересным.

Ответ №3:

Способ сделать это — запустить ваш сайт в безголовом браузере, таком как PhantomJS, и проверить примененные стили, чтобы удалить те, которые не используются.

К счастью, на node есть хороший инструмент под названием uncss, который делает именно это:

https://github.com/giakki/uncss

Я нашел это здесь:

http://addyosmani.com/blog/removing-unused-css/

О просмотре всех этих страниц, ну, я не знаю, если вы можете сгенерировать все возможные URL-адреса, вы можете автоматизировать процесс.

Попробуйте и дайте мне знать, если это поможет.