Когда мы пишем стили, после того, как CSS страницы был изменен для нескольких версий, некоторые стили могут больше не использоваться, или некоторые стили могут быть переименованы, а оригинальные забыли удалить. Короче говоря, могут быть некоторые бесполезные. контент в стиле страницы. Эти бесполезные траты серверного пространства и потребление пропускной способности также увеличат наши затраты на обслуживание. Итак, есть ли способы очистить эти бесполезные стили? Сегодня давайте взглянем на некоторые из наиболее полезных инструментов.
Селекторы Dust-Me
Dust-Me — очень полезный и простой в использовании плагин Firefox. Он может анализировать все CSS-файлы, вызываемые на вашей странице, и анализировать те, которые на ней не используются.
Поддерживает локальные и удаленные файлы стилей, включая файлы стилей, представленные с помощью тегов <link>, инструкций обработки <?xml-stylesheet?>, операторов @import и т. д. (но не поддерживает блоки <style> и встроенные стили на странице).
Поддержка файлов стилей, представленных в условных комментариях IE;
Вы можете проверить одну страницу или весь сайт;
Поддерживает селекторы CSS1, большинство селекторов CSS2 и CSS3;
Помните, что обычные CSS-хаки, такие как «* html #fuck-ie», будут интерпретироваться как «html #fuck-ie»;
Поддерживает Firefox 3.5 и Firefox 3.0. Фактически, благодаря улучшениям в движке js FF 3.5, производительность FF 3.5 на 50% выше, чем у FF 3.0.
Установка: Нажмите здесь. При этом вы можете скачать исходный код проекта. Чтобы узнать больше, посетите официальную страницу селектора Dust-Me.
Скорость страницы
Page Speed — это инструмент внешнего анализа производительности, предоставляемый Google. Он чем-то похож на YSlow, но предоставляет несколько более уникальных и полезных инструментов, таких как удаление неиспользуемого CSS:
Page Speed, как и YSlow, зависит от Firebug. Подробную информацию и установку можно найти здесь.
Проверка избыточности CSS
CSS Redundancy Checker — это бесплатное онлайн-приложение, которое может проверять все страницы, использующие определенный CSS-файл, на предмет бесполезных стилей. Вы можете проверить использование определенного стиля на нескольких страницах одновременно. Недостатком этого инструмента является то, что, хотя он может проверять несколько HTML-страниц одновременно, он может проверять только один файл CSS за раз, и вам придется вводить его вручную:
IntelliJ ИДЕЯ
IntelliJ IDEA Это довольно мощная IDE, похожая на DreamWeaver, но в Китае она мало используется. Программное обеспечение включает в себя инструмент анализа кода «на лету», который может анализировать неиспользуемые классы и идентификаторы в файлах CSS.
Сеть выражений
Expression Web, инструмент разработки веб-сайтов нового поколения от Microsoft, до сих пор используется многими людьми. Его функция CSS Report может проверять неиспользуемый CSS, который необходимо очистить (я действительно никогда не использовал EW для разработки веб-сайтов. Надеюсь, дети, которые используют это программное обеспечение, смогут это сделать). помогите, посмотрите это).
Заключение
Конечно, могут быть и другие инструменты, которые здесь не упомянуты. Если вы что-то об этом знаете, вы можете поделиться этим со всеми.
Кроме того, мы обычно записываем стили всего веб-сайта в один или несколько файлов стилей, а затем вызываем их все на странице или вызываем в модулях. Тогда стили из определенного CSS-файла могут использоваться не на определенной странице, а на определенной странице. используются на определенной странице. Он используется на других страницах, поэтому при использовании этих инструментов для обнаружения избыточных стилей в файлах CSS необходимо соблюдать осторожность. Очистка стилей может повлиять на другие страницы, поэтому результаты проверки, предоставляемые Page Speed. применяется только к одной странице, не подходит для всего веб-сайта, вместо этого используйте Dust-Me или CSS Redundancy. Используя Checker, вы можете проверять весь сайт или несколько страниц сайта одновременно, что позволяет избежать ошибок.
PS: Большое спасибо за работу Knowledge Capsules.