Чи є хороші підходи, які допоможуть визначити невикористані визначення css в проекті? Було витягнуто купу файлів CSS, і зараз я намагаюся трохи прибрати речі.
Чи є хороші підходи, які допоможуть визначити невикористані визначення css в проекті? Було витягнуто купу файлів CSS, і зараз я намагаюся трохи прибрати речі.
Відповіді:
Погляньте на розширення Firefox Dust-Me за адресою https://addons.mozilla.org/en-US/firefox/addon/dust-me-selectors/ .
Інструменти для розробників Chrome мають аудит вкладку , на якій можуть відображатися невикористані селектори CSS.
Запустіть аудит, потім у розділі Ефективність веб-сторінки див. Видалення невикористаних правил CSS
Я щойно знайшов цей сайт - http://unused-css.com/
Виглядає добре, але мені потрібно буде ретельно перевірити його "чистий" CSS, перш ніж завантажувати його на будь-який із моїх сайтів.
Також, як і у всіх цих інструментах, мені потрібно було б перевірити, чи він не знімав ідентифікатори та класи без стилю, а використовуються як селектори JavaScript.
Наведений нижче вміст взято з http://unused-css.com/, тому їм вдячний за рекомендації щодо інших рішень:
Латишський Sehgal написав програму Windows для пошуку та видалення невикористаних класів CSS. Я не перевіряв цього, але з опису ви повинні вказати шлях ваших html-файлів та одного CSS-файлу. Потім програма перелічить незадіяні селектори CSS. З екрану екрана схоже, що немає можливості експортувати цей список або завантажити новий чистий файл CSS. Схоже, що служба обмежена одним файлом CSS. Якщо у вас є кілька файлів, які ви хочете очистити, вам доведеться їх очищати один за одним.
Dust-Me Selectors - це розширення для Firefox (для версії 1.5 або новішої версії), яке знаходить невикористані селектори CSS. Він витягує всі селектори з усіх таблиць стилів сторінки, яку ви переглядаєте, а потім аналізує цю сторінку, щоб побачити, який із цих селекторів не використовується. Далі дані зберігаються таким чином, що при тестуванні наступних сторінок селектори можуть бути перекреслені зі списку у разі їх виникнення. Цей інструмент, як передбачається, зможе проглянути весь веб-сайт, але, на жаль, я міг би змусити його працювати. Крім того, я не вірю, що ви можете налаштувати та завантажити файл CSS із видаленими стилями.
Topstyle - це програма для Windows, включаючи купу інструментів для редагування CSS. Я не тестував його багато, але, схоже, він має можливість видаляти невикористані селектори CSS. Це програмне забезпечення коштує 80 доларів.
Liquidcity CSS cleaner - це сценарій php, який використовує регулярні вирази для перевірки стилів однієї сторінки. Він розповість вам про класи, які недоступні в коді HTML. Я не перевіряв це рішення.
Дедвейт - це інструмент покриття CSS. Враховуючи набір таблиць стилів та набір URL-адрес, він визначає, які селектори використовуються насправді та списки, які можна "безпечно" видалити. Цей інструмент є рубіновим модулем і працюватиме лише з веб-сайтом рейок. Невикористані селектори потрібно видалити вручну з файлу CSS.
Гелій CSS - це інструмент javascript для виявлення невикористаного CSS на багатьох сторінках веб-сайту. Спочатку потрібно встановити файл JavaScript на сторінку, яку ви хочете протестувати. Потім вам потрібно викликати функцію гелію, щоб почати очищення.
UnusedCSS.com - веб-додаток із зручним інтерфейсом. Введіть URL-адресу сайту, і ви отримаєте список CSS-селекторів. Для кожного селектора число вказує, скільки разів використовується селектор. Ця послуга має кілька обмежень. Заява @import не підтримується. Ви не можете налаштувати та завантажити новий чистий файл CSS.
CSSESS - це закладка, що допомагає знаходити невикористані селектори CSS на будь-якому сайті. Цей інструмент досить простий у використанні, але він не дозволить вам налаштувати та завантажити чисті файли CSS. У ньому буде вказано лише невикористані файли CSS.
Google Page Speed може зробити це для вас (він насправді робить набагато більше, ніж просто розповідати, який CSS не використовується). На FireFox він доступний як додаток FireBug. Тоді є і онлайн-версія.
Кращий CSS Minifier у C # скидає зайві стилі;
Ви також хочете використовувати для цього Dust-Me.
Майте на увазі, якщо є вміст, який наразі не видно пилу, ви можете викинути потрібні вам стилі.
EDIT: посилання було розірвано, але архів.org має і сторінку, і код.
Розширення Firebug, щоб переглянути, які правила CSS використовуються.
Використання CSS - це розширення для Firebug (таким чином, щоб встановити Firebug), що дозволяє знати правила використання стилів CSS. Він ідентифікує CSS, який ви використовуєте та не використовуєте. Це дає змогу вказати, які непотрібні деталі можна видалити. Ви обов'язково повинні використовувати цей додаток, щоб зберегти ваші CSS файли якомога легше.
Схоже, хтось оновив селектори DustMe, щоб знову працювати з Firefox під новою назвою - "CSS Roundup" http://blog.brothersmorrison.com/?p=198
Використовуйте Панель інструментів для розробників Internet Explorer , s Вид> Матчі вибору CSS : перегляд звіту про всі встановлені правила стилю та скільки разів вони використовуються на поточній сторінці.
Перегляньте сторінкуSpeed Google для Firefox . Це робить це, і ціле навантаження більше.
Очевидно, розробляється також плагін Chrome.