Парады па аптымізацыі мабільных тэлефонаў: 7 спосабаў палепшыць хуткасць мабільнага руху на сайце
- 1. Вымерайце і мінімізуйце час адказу сервера
- 2. Пазбягайце і не мінімізуйце перанакіраванні для паскарэння хуткасці мабільнай старонкі
- 3. Старанна вымераць час туды і назад
- 4. Загрузіце змест вышэй, чым змест
- 5. Пакладзеце JS на дно, а CSS - у верхняй частцы HTML-файлаў
- 6. Аптымізацыя і мінімізацыя файлаў CSS і JS
- 7. Выкарыстоўвайце сціск gzip для памяншэння памеру файла
У перыяд адпачынку, пакупнікі маюць толькі адну крытычную місію. Гэтак жа, як у гэтым старым фільме Jingle ўвесь шлях З удзелам экс-губернатара, былога чэмпіёна па бодзібілдынгу і вядучага вучня Арнольда Шварцэнэгера, яны імкнуцца атрымаць падарунак-забойцу для каханага дзіцяці і хутка схапіць яго за каго-небудзь яшчэ.
Google, Radware і эксперты мабільнай аптымізацыі вызначылі тры секунды як магічны нумар для часу мабільнай загрузкі. На працягу трох секунд пачынаюць адбывацца катастрофы і ўсе віды дрэнных рэчаў: кліенты ўцякаюць на канкуруючыя сайты, змяншаюць канверсіі і пагаршаюцца маркі. Праз тры секунды вы добра, як золата, і вашы кліенты таксама!
Не марнучы нават мілісекунд больш часу, дазвольце мне выкласці 7 ключавых крокаў, распрацаваных камандай аптымізацыі Mobile1st для рэзкага паскарэння хуткасці мабільнай старонкі.
1. Вымерайце і мінімізуйце час адказу сервера
Хуткасць мабільнай старонкі вызначаецца вэб-кадаваннем, але таксама залежыць ад вялікага, тоўстага тэхнічнага інструмента, вядомага як ваш сервер. Відавочна, што чым даўжэй ваш сервер чакае адказу на запыт браузера, тым павольней час загрузкі старонкі. Mobile1st разам з экспертамі ў Google і GTMetrix Рэкамендуем, каб ваш сервер пачынае перадаваць першы байт рэсурсаў на працягу 200 мілісекунд запыту .
Таксама называецца "час чакання" ці "час да першага байта", час, якое праходзіць да адказу з сервера, з'яўляецца першым элементам на вадаспадзе.
Вэб-прадукцыйнасць Сёння дазваляе ўважліва паглядзець на графік вадаспадаў, у якім паказаны ўсе элементы загрузкі вэб-старонкі і іх паслядоўныя тэрміны.
Ёсць тры асноўныя спосабы павышэння часу адказу сервера:
- Паляпшае праграмнае забеспячэнне або канфігурацыю вэб-сервера
- Павышэнне якасці і маштабу паслугі вэб-хостынгу і, у прыватнасці, забеспячэнне адэкватных працэсараў і памяці
- Паменшыць рэсурсы, неабходныя для вэб-старонак
2. Пазбягайце і не мінімізуйце перанакіраванні для паскарэння хуткасці мабільнай старонкі
Перанакіраванне - гэта інструкцыі, якія аўтаматычна прымаюць наведвальнікаў сайта з адной старонкі на іншае месца. Кожны перанакіраванне ўтрымлівае каштоўныя мілісекунды, ствараючы больш павольную загрузку старонкі. Гэта асабліва праблематычна для мабільных прылад, таму што яны часта залежаць ад менш надзейных сетак, чым карыстальнікі настольных ПК.
301s - найбольш распаўсюджаны тып перанакіраванняў старонак - накіроўваць наведвальнікаў сайта з састарэлых вэб-старонак на новыя старонкі, якія маюць розныя URL-адрасы. Хоць часта трэба , 301s могуць паглынаць вялікую частку часу мабільнай загрузкі. Сапраўды, перанакіраванні, верагодна, з'яўляюцца "адзінай найбуйнейшай крыніцай марнаванага часу ў вашым кодзе і могуць значна паўплываць на хуткасць вашай старонкі" паведамляе Варвы ,
Першы крок - проста праверыць колькасць перанакіраванняў на вашым сайце, размясціўшы такія інструменты, як Патрык Секстон перанакіраваць картера ,
3. Старанна вымераць час туды і назад
Вікіпедыя вызначае "час назад" (RTT) як час, неабходнае для запыту перадачы дадзеных з настольнага кампутара або мабільнага прылады ў мэтавы пункт прызначэння, напрыклад, на выдалены кампутар, і поўны вяртанне гэтых дадзеных.
RTT можа быць вымерана шляхам падачы адрасоў. Дакладны інтэрвал RTT залежыць ад шматлікіх фактараў, такіх як крыніца злучэння, носьбіт сувязі, фізічная адлегласць паміж фактычным крыніцай і аддаленай сістэмай, колькасць вузлоў паміж імі, колькасць трафіку, колькасць іншых запытаў, якія апрацоўваюцца серверам і гэтак далей.
Кожны RTT дадае квант часу да вашага агульнага часу загрузкі мабільнага тэлефона. Такім чынам, гэта лепшая практыка, каб паменшыць колькасць паслядоўных паездак, пераканаўшыся, што рэсурсы перадаюцца паралельна і пазбаўляючы лішняга вагі. Акрамя таго, каб пазбегнуць згаданых перанакіраванняў, GlobalDots мяркуе аб'яднанне сцэнарыяў, каб пазбегнуць паўторнага часу, патрабаванага RTT, у прыватнасці, аб'ядноўваючы як мага менш файлаў:
- Знешнія JavaScripts
- Знешні CSS
- Выявы з выкарыстаннем CSS-спрайтаў
4. Загрузіце змест вышэй, чым змест
Ідэя тут простая: ваш сайт павінен загрузіць змесціва, якое мабільны карыстальнік бачыць спачатку перад зместам, які яны могуць убачыць пазней. У прыватнасці, закадуйце вэб-старонкі так, каб ваш сервер пасылае спачатку дадзеныя, неабходныя для адлюстравання зместу вышэй. Нават калі старонка будзе няпоўнай, карыстач адчуе змест як мага хутчэй. У тэстах хуткасці мабільнай старонкі, Google Сапраўды, у першую чаргу выклікаюцца старонкі, якія не загружаюцца вышэй фальца, рэкамендуючы «прыярытэты бачнага зместу».
5. Пакладзеце JS на дно, а CSS - у верхняй частцы HTML-файлаў
JavaScript прыносіць інтэрактыўнасць на ваш інтэрнэт-старонкі (напрыклад, кнопкі і іх адказы або дадзеныя, якія ўводзяцца ў формы, дынамічны стыль і анімацыя). JS-скрыпты прадухіляюць паралельную загрузку. Калі код JS загружаецца, браўзэр не пачне рабіць іншыя загрузкі. Каб паскорыць загрузку старонкі, перамяшчайце сцэнары JS у ніжняй частцы старонкі, калі гэта магчыма. Гэта дазволіць HTML-змесціва адлюстроўвацца перад загрузкай JavaScript, што дазваляе адлюстроўваць мабільны наведвальнік лічыльнік ці іншае паведамленне.
CSS, або каскадныя табліцы стыляў, падрабязна пра тое, як элементы HTML будуць адлюстроўвацца на вэб-старонцы. Калі вы размяшчае табліцы стыляў у пачатку дакумента па праграмаванні, вашы старонкі, хутчэй за ўсё, загружаюцца. Размяшчаючы CSS напярэдадні, браўзэр можа як мага хутчэй адлюстроўваць усё, што ў яго ёсць.
6. Аптымізацыя і мінімізацыя файлаў CSS і JS
Усё большая колькасць дадзеных і залішняя вага старонак азначаюць, што вашы старонкі проста ў сярэднім загружаюцца больш часу. Таму вэб-распрацоўшчык, які стаіць перад сабой, павінен ведаць, што яны павінны аптымізаваць і мінімізаваць актывы. У верхняй частцы спісу - аптымізацыя і мінімізацыя файлаў CSS і JS.
"Мініфікацыя" выключае залішнія або проста не мае значэння дадзеныя, не закранаючы таго, як адлюстроўваецца старонка. Розныя інструменты, як Google адзначае, можа дапамагчы фільтраваць ваш код і ліквідаваць такія звальненні.
Найбольш вядомыя:
7. Выкарыстоўвайце сціск gzip для памяншэння памеру файла
У адрозненне ад памяншэння, для сціску дадзеных патрабуецца крок без сціску, перш чым ён можа быць адлюстраваны. Так, код быў паменшаны з першапачатковага памеру і, такім чынам, перадае хутчэй у браўзэр, але дадатковы этап дэкампрэсіі дадае да часу загрузкі мабільнага тэлефона.
На момант напісання гэтага артыкула gzip з'яўляецца спосабам сціску выбару сярод вэб-распрацоўнікаў. Gzipping паменшыць вагу старонкі і павялічыцца Хуткасць мабільнай старонкі , Gzipping звычайна скарачае вагу старонкі на 70% і ў цяперашні час падтрымліваецца пераважнай большасцю браўзэраў.
Зніжэнне часу загрузкі мабільнага тэлефона ніжэй парога за тры секунды - гэта важнае заданне. Прыняць гэтыя сем крокаў і іншыя рэкамендуемыя метады для дасягнення гэтай крытычнай мэты пры павышэнні паказчыкаў, якія прывядуць да поспеху вашага бізнесу. Пытанні? Пытанні? Мабільная каманда па аптымізацыі тут на мабільным 1-м стаіць, каб дапамагчы.
Mobile1st прапануе паслугі мабільнай аптымізацыі для павелічэння даходаў / пераўтварэнняў вашага мабільнага сайта за кошт зніжэння хуткасці адмовы ад кошык, зніжэння хуткасці загрузкі старонкі, паляпшэння мабільнага UX і SEO, аналізу мабільнай аналітыкі і г.д. Наша каманда экспертаў у галіне мабільных тэлефонаў аналізуе і паляпшае ваш сайт праз 35+ фактараў, ідэі A / B правяраюць і могуць нават (па жаданні) унесці змены ў дызайн / код.
Звяжыцеся з экспертам Mobile1st зараз!
Пытанні?
