Што е Lazy Loading и зошто треба да ве интересира во контекст на оптимизација? - Семалт експерт
47% од корисниците на Интернет очекуваат страницата да се вчита во рок од 2 секунди. Што се случува во случај на подолго полнење? Корисникот нема да ја чита содржината на страницата, ниту пак ќе се изврши трансакцијата. Ќе си оди и можеби нема да се врати. Значи, не станува збор за висока конверзија.
Сопственикот на веб-локацијата има само неколку секунди прво да го заинтересира, а потоа да го задржи корисникот на страницата. Доколку по влегувањето на веб-страницата корисникот наиде на некакви компликации, на пр. неточно распоредување на податоци, лошо дизајнирана архитектура на веб-страница или грешка при вчитување на страницата, тој ќе избере друго место на мрежата и веројатно нема да се врати. Затоа решавањето на проблемот со бавното вчитување на страниците, како и јасен и интуитивен интерфејс, се важни прашања во Оптимизација на оптимизација. Дали знаевте дека, според податоците на Google, страницата на која се вчитуваат повеќе од 5 секунди може да доживее намалување до 40% во конверзијата? Доволна причина за префрлување на брзина.
Што е мрзливо вчитување?
Иако самиот концепт на мрзливо вчитување всушност треба да се сфати како бавно вчитување, од перспектива на SEO решенија, има сосема различни конотации. Всушност, тоа не е ништо повеќе од скрипта вметната во кодот на страницата што го контролира вчитувањето на медиумите (слики и видеа) сместени во кодот на страницата. Благодарение на него, мултимедијата се вчитува само кога корисникот оди во одреден дел, а не веднаш откако ќе отиде до целната веб-адреса. Оваа шема на работа го забрзува процесот на вчитување на веб-локацијата и ве поттикнува да ја користите, иако името на самата скрипта може да биде доста погрешно.
Вреди да се спомене дека еден од начините за забрзување на вчитувањето на веб-страницата е асинхроното вчитување на JavaScript скрипти. Знаењето за овој метод е особено важно ако скриптите се на оддалечени сервери. Потребно е долго време да се заменат такви датотеки. Самата скрипта исто така може да ја запре обработката на останатите елементи. Во овој случај, треба да го принудите прелистувачот асинхроно да се вчита.
Резултатите ќе бидат важни од гледна точка на сопственикот на веб-страницата. И овие се многу лесни за читање бидејќи времето за вчитување на вашата веб-страница треба значително да се скрати. Доволно е да се замисли самиот процес на работа на веб-страницата.
Ако имаме работа со обемна веб-локација со голема количина на содржина, вчитувањето на сите мултимедијални датотеки во исто време би било целосно согорување на нејзините ресурси.
Кога ќе се имплементира скриптата за мрзливо вчитување, се извршуваат низите на податоци релевантни за објаснување на одреден проблем или тема што моментално се разгледува на страницата. За корисникот податоците се доставуваат веднаш, а притоа тој нема свест и не сноси никакви последици дека преостанатите графики чекаат да се вчитаат - тоа ќе се случи само кога ќе се заинтересира за нив додека ја скролува страницата.
Зошто скриптата за мрзливо вчитување е добро решение за вашата веб-страница?
Ако всушност анализирајте кој ја посетува вашата веб-страница (можете да ја користите оваа алатка: на Посветена табла за оптимизација ) и како се однесуваат на тоа, знаете дека корисникот не троши секогаш многу време на тоа и не навлегува во структурата на линковите и подстраниците за внимателно да ја разгледа понудата или производите (што е штета). Обично, тој/таа оди директно на целната страница (секако со кампањите на AdWords), посегнува по информации, ја исполнува својата/нејзината потреба и продолжува понатаму. Затоа, нема смисла да ги вчитаат сите други графики кои не се поврзани со целта на неговата посета за време на ова кратко присуство.
Пример
Џек бара мотор. Отсекогаш сонувал за тоа, но никогаш претходно не можел да си ги дозволи трошоците. Конечно, тој собра 20.000 долари и е подготвен да го избере моделот од соништата. Затоа, тој внесува во пребарувачот „добри мотори до 20 илјади долари“.
Појави му се:
- Мулти-пребарувачи со продажни понуди - сортираат модели во нив според избрани параметри. Отвора таб по таб и ги прелистува понудите.
- Веб-страници со содржина - водичи за купување и избор на мотор.
Додека Џек троши многу време на доверливата веб-локација, бидејќи треба да го избере совршеното возило, на страницата со содржина тој веројатно нема да потроши повеќе од 8-10 минути на една страница од статијата и ќе продолжи понатаму.
Најважната работа во овој пример е што не е неопходно да се вчитаат сите фотографии од дадена потстраница на веб-локацијата со содржина за Џек - графичкиот дизајн на статијата е доволен. Не мора да му давате фотографии од сите достапни модели во мулти-пребарувачот. На крајот на краиштата, тој ќе биде искушуван само од неколкумина!
Таквата шема на работа, наречена вчитување слики на барање, е најдоброто решение за одржување на удобноста при користење на веб-страницата и брзината на користење. Ќе добиете време и ќе добиете повисоки оценки за квалитетот на веб-страницата.
Мрзливото вчитување на непотребни ресурси е апсолутно „задолжително“ за секоја веб-локација која сака да ја сервира својата содржина на корисниците за кратко време. Вреди да се запамети дека од јули 2018 година, брзината на веб-локацијата официјално е еден од факторите за рангирање при одредување на позицијата на резултатите од пребарувањето за мобилни телефони на Google, така што при оптимизирање на веб-страницата за оптимизација, треба да обрнете внимание на овој аспект.
Што можете да промените во процесот на вчитување на веб-страницата? Што вели Google?
Брзина на вчитување на веб-страницата не е само елемент кој инспирира задоволство на клиентите. Тоа е исто така еден од факторите за рангирање кои позитивно влијаат на евалуацијата на позиционираната веб-страница. Пред корисникот да го види, прелистувачот треба да преземе неколку чекори на него. Ако нешто тргне наопаку во некоја од фазите на анализа, корисникот ќе мора да чека долго време за да се вчита страницата.
Вашата веб-локација се состои од ресурси како HTML код, CSS код и JS код, кои се одговорни за графичките елементи. За корисникот да добие подготвен приказ, прелистувачот треба да го чита секој приказ. Според тоа, прегледот со многу содржина ќе бара подолго време за вчитување на веб-локацијата и лизгање на целата потстраница. Ова не е најдоброто решение за вас и за корисникот. Корисникот го губи трансферот на телефонот или ја преоптоварува домашната врска со непотребно вчитани ресурси. Како сопственик на веб-локација, исто така страдате од ова кога користите сервер кој има ограничен опсег или изнајмувате ресурси во зависност од количината на сообраќај на страницата.
Да бидеме јасни - повеќето од факторите кои влијаат на брзината на вчитување на веб-локацијата може да бидат допрени од вас и можете да го забрзате овој процес со конкретни активности. Како сопственик на веб-страницата или лице одговорно за нејзината оптимизација, проверете го серверот за хостирање. Треба да има капацитет да одговара на големината на локацијата и обемот на сообраќај на неа. Ова е основата за која треба да се внимава при развивање на веб-страница.
Можете да потрошите многу пари за оптимизирање и трошење многу време за имплементирање, но ако серверот е бавен, веб-страницата нема да се забрза. Затоа, немојте да го барате првиот подобар хостинг провајдер!
Веќе во 2009 година, Амазон покажа дека на секои 0,1 сек. доцнењето во работата на нивната веб-страница предизвикува пад на продажбата од 1%. Тоа значи дека секоја секунда доцнење го чини Амазон „само“ 10% од приходите!
Како да се имплементира скрипта за мрзливо вчитување?
Имплементацијата на скриптата за мрзливо вчитување вклучува правење некои промени во кодот на веб-страницата. За да го направите ова, можете да користите готови CMS приклучоци или приклучоци за JS.
Во скриптата за мрзливо вчитување, не треба да ги вклучувате сликите на врвот на страницата и сите логоа за „слики на херој“. Доколку имплементирате мрзливо вчитување за графики кои беа поставени на врвот на страницата, наместо веднаш да му ги прикаже на корисникот, скриптата дополнително ќе го анализира процесот, што секако ќе доведе до доцнење и значително намалување на квалитетот на UX. Ефектот од таквата оптимизација ќе биде контрапродуктивен.
Некомпетентното спроведување на мрзливото вчитување може да резултира со тоа што корисникот не гледа графика во почетната фаза на прикажување на страницата, а содржината на веб-локацијата ќе биде прикажана погрешно.
Како се имплементира скриптата во кодот?
Внимавајте дека вградените iframes користат и многу податоци и може да ги намалат перформансите на страницата. Затоа, вреди да се погрижите да се вчитаат само кога му се потребни на корисникот. Ова го скратува целокупното време на вчитување на страницата, но исто така го минимизира пропусниот опсег на корисникот и ја намалува потрошувачката на меморија.
За жал, ботовите на пребарувачите претпочитаат страници чиј HTML код може брзо да се индексира. Googlebot може да прикажува JS врз основа на Chrome41, но не секогаш правилно индексира во оваа ситуација. Едноставно кажано, роботите можеби нема да ги забележат овие слики.
Корисни совети
Ако забележите проблеми со вчитувањето на веб-страницата, тогаш:
- користете Gzip компресија, што е метод за компресирање на HTML и CSS датотеки на страната на серверот. Неговата употреба заштедува од 40 до дури 80% од оригиналната големина на датотеката;
- проверка и ажурирање на базата на податоци, која расте при ажурирања и имплементации;
- се грижи за кеширањето на прелистувачот; серверот нема да мора да ги испраќа сите елементи на веб-локацијата секогаш кога корисникот ќе ја посети, бидејќи некои од нив ќе бидат кеширани;
- ослободете се од сите непотребни скрипти и додатоци кои не влијаат на правилното функционирање на веб-страницата.