Gzip қысу js / css / html сайтын жеделдету - .htaccess жүйесінде қалай қосуға болады

басып шығару · Время на чтение: 9мин · бойынша · Жарияланды · Жаңартылған

ойнауБұл мақаланы тыңдаңыз

Gzip қысу JS css html.Сәлеметсіздер ме, құрметті оқырмандар! Бүгін біз туралы сөйлесетін боламыз gzip js қысу | css | htmlсайтты жүктеуді жылдамдату үшін. Оны .htaccess файлымен қалай қосуға болады. Сондай-ақ мен сізге неліктен сервер жағында файлды қысуды қосу керек екенін айтамын.

Бұл тақырып сайтты техникалық оңтайландырумен тікелей байланысты. Қарапайым манипуляцияларға жол бере отырып, сайттың жүктелуін айтарлықтай жылдамдатады. Жылдам сайт - бұл іздеу жүйесін жылжытудағы маңызды жетістік.

Мақаланың мазмұны:

.htaccess ішінде Gzip файлын қысуды қосудың мақсаты қандай?

Сайттағы беттердің Gzip қысылуын қалай қосуға болады.

Мен көптеген мақалаларымда айтқанымдай! Бастапқы кезеңде сайт айтарлықтай үлкен салмаққа ие. Және сол. оңтайландыру біздің сайттың салмағын азайту үшін дәл қажет. Қалай болғанда да, біз кодтың көлемін, беттердің салмағын, суреттерді және басқаларды азайтуымыз керек. Жалпы міндет - пайдаланушыға сайттың жеңіл және жылдам жүктелетін нұсқасын беру.
Осылайша біз ақпаратты жылдам береміз. Беттер мен бөлімдер арасындағы ауысу секундтың бір бөлігінде орын алады. Сонымен қатар, келушілер барлық жүктелген дизайн элементтерін және өзара әрекеттесудің басқа интерактивті элементтерін жылдам көреді.

GZIP қысу - тасымалданатын файлдарды үзіліссіз мұрағаттауды қамтамасыз етеді. Осылайша, біз көз сапасының шығынсыз қысылуын аламыз. Барлық деректер пайдаланушының браузерінде орамнан шығарылғаннан кейін бастапқы күйіне келеді. Іске асырудың өзі бірнеше жұмыс алгоритмдеріне байланысты. Оларға LZ77 және Huffman көмегімен негізгі DEFLATE кіреді.

Әрине, мұндай қысу (сығу) идеалды шешім емес. Бірақ Gzip енгізу бізді жылдамдық пен қысу арақатынасы арасындағы тепе-теңдікке әкеледі. Бұл әдіс сайтты жылдамдатудың басқа әдістерінің арасында ең танымал. Оның үстіне серверде жаһандық әдісті енгізу көп уақыт пен тестілеуді қажет етеді. Және бұл қалаған нәтиже бермеуі мүмкін! Осыған байланысты Gzip қысу файлдарды жүктеуді жылдамдатудың ең сенімді әдісі болып табылады.

Gzip қысу - қандай файлдар үшін қолайлы? Ол қандай серверлерде жұмыс істейді?

Іс жүзінде gzip қысу файлдардың үлкен тізімін қамтиды. Бірақ оның кішкене кемшілігі бар! Пайдаланушы сайтқа кірген кезде сервер деректердің үлкен көлемін жылдам қысуы керек. Бұл серверде белгілі бір жүктемеге әкеледі. Бірақ бұл көп жағдайда маңызды емес. Тасымалдан кейін барлық қолдау көрсетілетін файл пішімдері танымал браузерлерде тамаша көрсетіледі.

Олардың негізгілеріне мыналар жатады:

  • мәтін/ашық мәтін/html;
  • text/xml application/xml application/xhtml+xml application/xml-dtd;
  • application/rdf+xml application/rss+xml application/atom+xml image/svg+xml;
  • text/css text/javascript қолданбасы/javascript қолданбасы/x-javascript;
  • font/openttype application/font-otf application/x-font-otf;
  • font/truetype қолданбасы/font-ttf қолданбасы/x-font-ttf.

Gzip файлын қысу негізгі Apache және Nginx серверлерінде қолданылады. Жарамды жұмыс модульдерімен және сервер мүмкіндіктерімен.

Мысалы: Nginx - статикалық үшін қолданылады. Ол статикалық файлдарды жақсы қысады және өңдейді. Қысу ngx_http_gzip_module және ngx_http_gzip_static_module модульдерінің арқасында орын алады. Үздіксіз сығымдау негізгі кеңейтімді «.gz» ауыстыру арқылы жүзеге асырылады.

Стандартты конфигурацияның мысалы:

gzip қосулы; gzip_min_length 1000; gzip_types мәтін/қарапайым қолданба/xml;

Apache - ең көп сұралатын сервер. Әрине, ондағы қысу өршіл және теңшелетін болады. Бұл сервердегі Gzip қысу mod_deflate модулі арқылы орындалады. Пайдаланушының браузеріне жіберілмес бұрын қысуды қамтамасыз ету арқылы.

Стандартты конфигурацияның мысалы:

# GZIP қосу - қысуды қосу AddOutputFilterByType DEFLATE мәтіні/кәдімгі AddOutputFilterByType DEFLATE мәтін/html AddOutputFilterByType DEFLATE мәтін/xml AddOutputFilterByType DEFLATE text/csssssputy AddOutputFilterByType DEFLATE text/csssspe AddFLOTFilterByType terByType DEFLATE қолданбасы/xhtml+xml AddOutputFilter ByType DEFLATE қолданбасы/rss+xml AddOutputFilterByType DEFLATE қолданбасы/ javascript AddOutputFilterByType DEFLATE қолданбасы/x-javascript

Сервердегі жүктемені азайту үшін баяу алгоритммен қысу:

RewriteEngine қосулы AddEncoding gzip .gz RewriteCond %{HTTP:Accept-encoding} gzip RewriteCond %{REQUEST_FILENAME}.gz -f RewriteRule ^(.*)$ $SAL]z [tp30T1,gz.

PHP - аз танымал нұсқа. Бірақ оның zlib модулі арқылы қысуды ұйымдастыру мүмкіндігі де бар. Бұл әдіс ұсынылмайды, өйткені ол өте баяу.

Стандартты конфигурацияның мысалы:

$originalFile = __DIR__ . '/jquery-1.11.0.min.js'; $gzipFile = __DIR__ . '/jquery-1.11.0.min.js.gz'; 1TP30OriginalData = file_get_contents(1TP30OriginalFile); $gzipData = gzencode($originalData, 9); file_put_contents($gzipFile, $gzipData); var_dump(файл өлшемі($originalFile)); // int(96380) var_dump(файл өлшемі($gzipFile)); // int(33305)

Әрине, Apache + Nginx + PHP серверлерін бірге пайдалану да мүмкін. Осылайша, серверлер арасында белгілі бір жүктемені бөлу қамтамасыз етіледі. Бірақ бұл өте қиын тапсырма, оны қарапайым пайдаланушылар жасамауы керек.

Мен Apache/Nginx/PHP барлық негізгі артықшылықтарын пайдалана отырып, серверімді өзім конфигурацияладым. Осылайша, Nginx статиканы өңдейді, Apache қалғанын PHP арқылы өңдейді. Нәтиже өте оң. Бірақ бұл әдісті ұйымдастыруға көп уақыт жұмсалды.

.htaccess файлында Gzip қысуды қалай қосуға болады

Шындығында, мұны істеу қиын емес. Оның үстіне, мен бұл файл туралы айттым.

Негізгі ережелер өзгеріссіз қалады:

  1. Өңдеу алдында түпнұсқа .htaccess файлын сақтауды ұмытпаңыз. 500 қатесі болған жағдайда, қалпына келтіруге болатын нәрсе болады.
  2. Жолдар арасында бос орындар болмауы керек.
  3. Біз барлық пікірлерді # белгісінен кейін жазамыз.
  4. Енгізгеннен кейін кодтың тұтастығын тексеруді ұмытпаңыз.

Стандартты .htaccess ережелер конфигурациясының бірнеше мысалдары жоғарыда айтылған. Бірақ менің ойымша, бұл жеткіліксіз, сондықтан мен өз мысалымды келтіремін. Бұл ережелер жинағы осы сайтта жұмыс істейді, сіз көріп отырғандай, ешқандай проблемалар жоқ.

Бұл ретте қысу жылдам жүреді, сайт тежегішсіз тез жүктеледі. Бұл кодты .htaccess файлыңызға қою жеткілікті. Егер сіздің жеке серверіңіз болса, онда сіз бәрін өзіңіз білесіз деп ойлаймын.

Негізгі аудитория үшін пайдалану нұсқаулары:

  1. Біз кез келген танымал ftp клиентімен серверге барамыз;
  2. Сайттың түбіріне өтіңіз (каталог);
  3. .htaccess файлы сайттың негізгі каталогында орналасқан;
  4. Біз оны мәтіндік редактормен ашамыз, жалпы Sublime Text 3 жақсырақ;
  5. Әрі қарай, файлдың ең соңында төменде көрсетілетін кодты қойыңыз.
  6. Сізден кодты тексеруді сұраймыз, өйткені сайтта көшіруден қорғау бар (кодтың соңында сайтқа сілтеме болуы мүмкін).
# GZIP қосу AddOutputFilterByType DEFLATE мәтін/қарапайым AddOutputFilterByType DEFLATE мәтін/мәтін AddOutputFilterByType DEFLATE мәтін/html AddOutputFilterByType DEFLATE мәтін/қарапайым AddOutputFilterByType DEFLATEF text/deFLATEFy AddOutputFilterByType AddOutputFilterByType DEFLATE сурет/gif AddOutputFil terByType DEFLATE сурет/jpeg AddOutputFilterByType DEFLATE сурет/jpg AddOutputFilterByType DEFLATE сурет/ PNG AddOutputFilterByType DEFLATE сурет/gif AddOutputFilterByType DEFLATE сурет/flv AddOutputFilterByType DEFLATE сурет/ico AddOutputFilterByType DEFLATE сурет/swf AddOutputFilterByType қолданбасы/DEFLATEB AddOutputFilterByType қолданбасы/DEFLATEx қосымшасы /xhtml+xml AddOutputFilterByType DEFLATE қолданбасы/xml AddOutputFilterByType DEFLATE қолданбасы/x-javascript AddOutputFilterByType DEFLATE қолданбасы / javascript AddOutputFilterByType DEFLATE қолданбасы/json AddOutputFilterByType DEFLATE video/3gpp AddOutputFilterByType DEFLATE бейне/3gpp2 AddOutputFilterByType DEFLATE бейне/x-flv AddOutputFilterByType DEFLATEB AddOutputFilterByType DEFLATE video/jpeg AddOutputFilterByType DE FLATE бейне/x-m4v AddOutputFilterByType DEFLATE видео/mp4 AddOutputFilterByType DEFLATE бейне /ogg AddOutputFilterByType DEFLATE бейне/webm AddOutputFilterByType DEFLATE бейне/жылдам AddOutputFilterByType DEFLATE аудио/x-mpegurl AddOutputFilterByType DEFLATE аудио/midi AddOutputFilterByDEFLATEB AddOutputy/AudioutputFilterB AddFLutpeB DEFLATE аудио/mp4 AddOutputFilterByType DEFLATE аудио/ mpeg AddOutputFilterByType DEFLATE аудио/webm AddOutputFilterByType DEFLATE аудио/негізгі AddOutputFilterByType DEFLATE аудио /x-wav AddOutputFilterByType DEFLATE аудио/wav BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4.0[678] no-gzip BrowserMatch bMSIE !no-gzip !-gzip/html mod_gzip_on Иә mod_gzip_item_include файлы \.js$ mod_gzip_item_include файлы \.css$

Қажетті элементтерді жақшаға қоспасаңыз, қате пайда болады. Сіздің сайтыңыз жұмысын тоқтатады және сізге 500 ішкі сервер қатесін береді. Сондай-ақ кодтан «<>» жақшаға алынуы тиіс» мәтінін алып тастау керек. Осыдан кейін .htaccess файлын сақтау керек.

Жаңа ережелерді дәл қолдану үшін серверді қайта іске қосқан дұрыс. Барлық осы әрекеттерден кейін сіздің сайтыңыз әлдеқайда жылдам жұмыс істейді. Бетті жүктеу жылдамдығы айтарлықтай артады.

Веб-сайтты жүктеу жылдамдығын және Gzip қысуын тексеріңіз

Біз сервер жағынан қысуды қосқаннан кейін. Орындалған жұмыстың сәттілігін тексеруге болады! Мұны бірнеше танымал онлайн құралдармен жасауға болады. Оларды қарастырайық:

PageSpeed Insights - сайтты тексерудің негізгі және ең танымал онлайн құралы. 2018 жылы Google жасаған соңғы өзгерістерден кейін. Сайтты егжей-тегжейлі талдау үшін деректердің кең тізімін береді.

PageSpeed ​​​​Insights туралы көбірек біліңіз.

Не істей алады:

  1. Сайт жылдамдығының жалпы рейтингі;
  2. Мазмұнды жүктеу уақытын анықтайды;
  3. Жалпы жылдамдық индексі және өзара әрекеттесу уақыты;
  4. Оңтайландыру бойынша ұсыныстар береді;
  5. Толық өнімділік ақпаратын көрсетеді;
  6. Gzip қысуының қосылғанын немесе қосылмағанын көрсетеді;
  7. Хэшингтің қосылғанын немесе қосылмағанын көрсетеді;
  8. Қатені түзету үшін көптеген ақпарат береді.

PageSpeed веб-сайт жылдамдығының көптеген мәселелерін шешуге көмектеседі. Осы құралдың арқасында менің сайтымның көптеген қателері түзетілді.

Pingdom құралдары сонымен қатар танымал онлайн веб-сайтты талдау құралдарының бірі болып табылады. Сайтты бағалаудың әртүрлі критерийлері бойынша жеткілікті толық ақпарат береді. Жүктеуді не бәсеңдететінін табу оңай.

pingdom құралы дегеніміз не?

Сізге не береді:

  1. Сайттың жалпы өнімділігін бағалау;
  2. Сайттың дерекқорына сұраныстардың саны;
  3. Бетті жүктеу жылдамдығы;
  4. Мазмұн түрі бойынша мазмұн өлшемі;
  5. Сервер жауаптары 200/301/302/404/503 және т.б.;
  6. Домендер бойынша жалпы сұраулар;
  7. Жағдайды графикалық бейнелеу және т.б.;

Сайт жылдамдығы туралы көп ақпарат береді. Бірақ Google сияқты егжей-тегжейлі нұсқаулар бермейді.

WordPress үшін GZIP қысу плагиндері

Біртүрлі көрінгенімен, WordPress CMS жүйесіндегі сайттардың иелеріне көп алаңдаудың қажеті жоқ. Мұның себебі - сайтта қысуды қосу үшін әртүрлі плагиндер. Сізге тек өзіңізге ұнайтын плагинді орнату қажет. Содан кейін плагин параметрлерінде қысуды белсендіріңіз және қосыңыз. Сонда ол сіз үшін барлық жұмысты жасайды. Мен ең танымал бірнеше сипаттаймын.

PageSpeed Ninja WordPress үшін ең жақсы өнімділік плагині болып табылады. Google PageSpeed Insights арқылы табылған мәселелерді бір рет басу арқылы түзетіп, веб-сайттарыңызды жұмыс үстелдері мен мобильді құрылғыларда жылдам жасауға болады. Сайтта қысуды жылдам қосуға мүмкіндік береді.

Wordpress-те Google PageSpeed ​​ұпайыңызды арттырыңыз.

WP ең жылдам кэш сонымен қатар ең танымал хэшинг плагиндерінің бірі болып табылады. Онда топтастырылған параметрлердің үлкен саны бар, олардың біреуі қысуды қамтиды.

WP Fastest Cache - WordPress плагині.

Комета кэш Мен бұл плагинді өзім қолданамын. Басқа плагиндермен үйлескенде ол тамаша нәтиже береді. Сондай-ақ оның параметрлерінің бірі gzip қысуын қамтиды.

Comet Cache әрбір беттің кэшін жасайды.

Жалпы, Wordpress үшін барлық негізгі кэштеу плагиндері сайтта GZIP қысуын қосуға мүмкіндік береді. Ең аз жүктеме үшін толыққанды көп функционалды плагиндерді ұсынамын.

Қорытындылай келе, мен мынаны айтайын: қысуды қосуды ұмытпаңыз. Бұл өнімділікке өте жақсы әсер етеді және іздеуде сайтты көтереді. Бұл мақала сізге осыған көмектеседі деп үміттенемін.

Осы мақаланы оқу:

Оқығаныңыз үшін рахмет: SEO HELPER | NICOLA.TOP

Бұл пост қаншалықты пайдалы болды?

Бағалау үшін жұлдызшаны басыңыз!

Орташа рейтинг 5 / 5. Дауыс саны: 276

Әзірге дауыс жоқ! Осы жазбаға бірінші болып баға беріңіз.

Сізге де ұнауы мүмкін...

1 Жауап

  1. Илья айтты:

    Мен бірден кодты көшіріп, қойдым, ол 500 қатесін тудырды. Енді нені мұқият оқып шығу керектігін түсіндім. Сізде көшіруден қорғау бар екенін көріп тұрмын. Ал мазмұнның арқасында қолайлы және жұмыс істейді.

Пікір үстеу

Э-пошта мекенжайыңыз жарияланбайды. Міндетті өрістер * таңбаланған

12 + 6 =