Мініфікатар CSS

Што такое мініфікатар CSS?

Мініфікатар CSS прызначаны для скарачэння файлаў CSS на вэб-сайтах. Гэта паняцце, якое выкарыстоўваецца ў якасці англійскага эквіваленту (CSS Minifier), уключае размяшчэнне ў файлах CSS. Пры падрыхтоўцы CSS галоўная мэта складаецца ў тым, каб адміністратары вэб-сайтаў або кодэры правільна прааналізавалі радкі. Такім чынам, ён складаецца з такой колькасці радкоў. Ёсць непатрэбныя радкі каментарыяў і прабелы паміж гэтымі радкамі. Вось чаму файлы CSS становяцца вельмі доўгімі. Усе гэтыя праблемы ўстараняюцца мініфікатарам CSS.

Што робіць мініфікатар CSS?

Разам са зменамі, унесенымі ў файлы CSS; памеры памяншаюцца, непатрэбныя радкі выдаляюцца, непатрэбныя радкі каментарыяў і прабелы выдаляюцца. Больш за тое, калі ў CSS уключана больш за адзін код, гэтыя коды таксама выдаляюцца.

Існуюць розныя плагіны і прыкладанні для гэтых аперацый, якія большасць карыстальнікаў можа выконваць уручную. Спецыяльна для людзей, якія выкарыстоўваюць сістэму WordPress, гэтыя працэсы можна аўтаматызаваць з дапамогай убудоў. Такім чынам, выключаецца магчымасць памылак і атрымліваюцца больш эфектыўныя вынікі.

Людзі, якія не выкарыстоўваюць WordPress для CSS або не жадаюць аддаваць перавагу існуючым убудовам, таксама могуць выкарыстоўваць онлайн-інструменты. Спампоўваючы CSS у онлайн-інструменты праз Інтэрнэт, існуючыя файлы ў CSS памяншаюцца шляхам унясення змяненняў. Пасля завяршэння ўсіх працэсаў дастаткова загрузіць існуючыя файлы CSS і загрузіць іх на сайт. Такім чынам, такія аперацыі, як CSS Minify або shrinking, будуць паспяхова выкананы, і ўсе магчымыя праблемы, якія могуць узнікнуць праз CSS для сайта, будуць ліквідаваны.

Чаму вам трэба скарачаць файлы CSS?

Наяўнасць хуткага вэб-сайта не толькі робіць Google шчаслівым, але і дапамагае вашаму вэб-сайту займаць больш высокі рэйтынг у выніках пошуку, а таксама забяспечвае лепшы карыстацкі досвед для наведвальнікаў вашага сайта.

Памятайце, што 40% людзей нават не чакаюць 3 секунд, пакуль ваша галоўная старонка загрузіцца, а Google рэкамендуе сайты загружацца не больш за 2-3 секунды.

Сціск з дапамогай мініфікатара CSS мае шмат пераваг;

• Меншыя файлы азначаюць, што агульны памер загрузкі вашага сайта памяншаецца.
• Наведвальнікі сайта могуць загружаць і атрымліваць доступ да вашых старонак хутчэй.
• Наведвальнікі сайта атрымліваюць такі ж вопыт карыстання без неабходнасці спампоўваць файлы большага памеру.
• Уладальнікі сайтаў адчуваюць меншыя выдаткі на прапускную здольнасць, таму што па сетцы перадаецца менш даных.

Як працуе мініфікатар CSS?

Пажадана стварыць рэзервовую копію файлаў вашага сайта перад іх памяншэннем. Вы нават можаце пайсці яшчэ далей і паменшыць свае файлы на пробным сайце. Такім чынам вы пераканаецеся, што ўсё працуе, перш чым уносіць змены ў ваш жывы сайт.

Таксама важна параўноўваць хуткасць старонкі да і пасля памяншэння файлаў, каб вы маглі параўнаць вынікі і даведацца, ці паўплывала памяншэнне.

Вы можаце прааналізаваць хуткасць сваёй старонкі з дапамогай GTmetrix, Google PageSpeed ​​​​Insights і YSlow, інструмента тэсціравання прадукцыйнасці з адкрытым зыходным кодам.

Зараз давайце паглядзім, як выканаць працэс скарачэння;

1. Ручной мініфікатар CSS

Скарачэнне файлаў уручную патрабуе значнай колькасці часу і намаганняў. Такім чынам, у вас ёсць час, каб выдаліць асобныя прабелы, радкі і непатрэбны код з файлаў? Напэўна, не. Акрамя часу, гэты працэс скарачэння таксама дае больш месца для чалавечых памылак. Такім чынам, гэты метад не рэкамендуецца для памяншэння файлаў. На шчасце, ёсць шмат бясплатных онлайн-інструментаў мініфікацыі, якія дазваляюць капіяваць і ўстаўляць код з вашага сайта.

CSS minifier - гэта бясплатны онлайн-інструмент для мінімізацыі CSS. Калі вы капіруеце і ўстаўляеце код у тэкставае поле «Увод CSS», інструмент мінімізуе CSS. Ёсць варыянты загрузкі мінімізаванага вываду ў выглядзе файла. Для распрацоўшчыкаў гэты інструмент таксама забяспечвае API.

JSCompress , JSCompress - гэта інтэрнэт-кампрэсар JavaScript, які дазваляе сціскаць і памяншаць файлы JS да 80% ад іх першапачатковага памеру. Скапіруйце і ўстаўце свой код або загрузіце і аб'яднайце некалькі файлаў для выкарыстання. Затым націсніце «Сціснуць JavaScript - Сціснуць JavaScript».

2. Мініфікатар CSS з убудовамі PHP

Ёсць некалькі выдатных убудоў, як бясплатных, так і прэміум-класа, якія могуць паменшыць вашыя файлы без выканання крокаў уручную.

• Аб'яднаць,
• мінімізаваць,
• абнавіць,
• Убудовы WordPress.

Гэты плагін робіць больш, чым памяншае ваш код. Ён аб'ядноўвае файлы CSS і JavaScript, а затым мінімізуе файлы, створаныя з дапамогай Minify (для CSS) і Google Closure (для JavaScript). Мініфікацыя выконваецца праз WP-Cron, каб не паўплываць на хуткасць вашага сайта. Калі змесціва файлаў CSS або JS змяняецца, яны адлюстроўваюцца паўторна, таму вам не трэба ачышчаць кэш.

JCH Optimize мае некалькі даволі добрых функцый для бясплатнага плагіна: ён аб'ядноўвае і памяншае CSS і JavaScript, памяншае HTML, забяспечвае сціск GZip для аб'яднання файлаў і рэндэрынг спрайтаў для фонавых малюнкаў.

CSS Minify . Вам трэба толькі ўсталяваць і актываваць, каб мінімізаваць свой CSS з дапамогай CSS Minify. Перайдзіце ў Налады > CSS Minify і ўключыце толькі адзін параметр: Аптымізацыя і мінімізацыя кода CSS.

Fast Velocity Minify З больш чым 20 000 актыўных установак і рэйтынгам пяць зорак, Fast Velocity Minify з'яўляецца адным з самых папулярных варыянтаў для памяншэння файлаў. Каб выкарыстоўваць яго, вам трэба толькі ўсталяваць і актываваць.

Перайдзіце ў раздзел «Настройкі» > «Мінімізацыя хуткай хуткасці». Тут вы знойдзеце шэраг варыянтаў канфігурацыі плагіна, уключаючы пашыраныя выключэнні JavaScript і CSS для распрацоўшчыкаў, параметры CDN і інфармацыю аб серверы. Налады па змаўчанні працуюць нармальна для большасці сайтаў.

Убудова выконвае скарачэнне інтэрфейсу ў рэжыме рэальнага часу і толькі падчас першага некэшаванага запыту. Пасля апрацоўкі першага запыту той жа статычны файл кэша адпраўляецца на іншыя старонкі, якія патрабуюць таго ж набору CSS і JavaScript.

3. Мініфікатар CSS з убудовамі WordPress

Мініфікатар CSS - гэта стандартная функцыя, якую вы звычайна знойдзеце ва ўбудовах кэшавання.

• WP Rocket,
• Агульны кэш W3,
• WP SuperCache,
• Самы хуткі кэш WP.

Мы спадзяемся, што рашэнні, якія мы прадставілі вышэй, прасвятлілі вас, як зрабіць мініфікатар CSS, і вы зразумелі, як прымяніць яго на сваім сайце. Калі вы рабілі гэта раней, якія іншыя метады вы выкарыстоўвалі, каб паскорыць свой сайт? Напішыце нам у раздзеле каментарыяў на Softmedal, не забудзьцеся падзяліцца сваім вопытам і прапановамі па паляпшэнні нашага кантэнту.