В това практическо ръководство ще научите какво точно означава ускорение на сайт, как да го измерите и разбира се – как реално да го приложите чрез десетките практически съвети и инструменти, които ще ви споделим!
От първата част на темата за подобряване на скоростта на сайта видяхме какво може да се направи от страна на сървъра и приложението, за да се ускори динамичното генериране на съдържание на страниците.
В този материал ще надградим нещата като засегнем втората основна част от цялостното разбиране за скоростта на един сайт, а именно:
- Времето, за което съдържанието му се генерира от приложението (на сървъра);
- Времето, за което сайтът се зарежда в браузъра.
Ето част от темите в това практическо ръководство:
? СЪДЪРЖАНИЕ:
- Не само съвети за скорост, но и подход за разбирането им
- Потребителското преживяване и скоростта на сайта ви
- Зареждане на страницата в браузъра
- Метрики – оптимизация на техническото време за зареждане
- Етапи от зареждането на страницата в браузъра
- Мобилно и десктоп зареждане на страница
- Измерване на показателите на сайта с Page Speed Insight
- Приложение на съветите за ускоряване на сайта:
- Пренасочвания (редиректи) и скоростта на сайта
- Намаляване на големината и броя на ресурсите, които се зареждат
- Оптимизация на текстовите ресурси (HTML, CSS, JS)
- Оптимизация на зареждането на изображения
- Кеширане в браузъра – добри практики и инструменти
- Оптимизация на зареждането на външни ресурси
- Оптимизация на JavaScript и CSS ресурсите
- Заключение: да обобщим най-важното накратко
От експертите на Суперхостинг БГ за клуб MASTERHACK | © lifehack.bg
Ако при генерирането на съдържание има забавне, това ще се отрази на времето за зареждане. Затова препоръчителният начин за оптимизиране на скоростта, който ще доведе до оптимални резултати, е:
? Да се извърши отвътре-навън.
Това означава:
- Първо, да сме оптимизирали генерирането на съдържание (back-end);
- След това да преминем към оптимизиране на зареждането на това съдържание в браузъра (front-end).
Важно е ускоряването на сайта да се извърши първо чрез съветите от първата част, защото ако приложението има бавни скриптове или бавни заявки към базата данни, ускоряването от втората част няма да даде очакваните положителни резултати. Дори да сме премахнали всички бавни външни ресурси от страницата или да сме намалили големината на изображенията, страницата ще продължи да зарежда бавно.
Преди съветите за ускоряване на сайт…
За да ускорим сайта си, първа трябва да разберем скоростта.
Съветите за ускоряване на зареждането в браузъра са много и не всички са приложими или нужни за всеки един сайт.
Безцелното прилагане на всеки един съвет по списък, който намерим в уеб, не е оптимален подход за извършване на оптимизацията.
Възможно е да загубим времето си, ако не знаем защо трябва да приложим даден съвет и какви ще са резултатите от прилагането му.
Затова следващото изречение е много важно:
Вместо общо изреждане на съвети в списък, първо ще ви предложим подход за разбирането им.
Ще се опитаме да предоставим отговорите на Как? и Защо?
А Какво? ще успеете да разберете в края на статията.
Може да се сблъскате с високата стена от техническтермини, която трябва да прескочите, за да разберете смисъла на отделните съвети за ускоряване.
? Зареждане на страницата в браузъра
Преди да се насочите към списъците със съвети в статиите за ускоряване на зареждането, разберете какво означава „зареждане” на страницата в браузъра и как то се измерва и анализира. Трябва да имате предвид, че разбирането за „скорост на зареждане на сайта в уеб“ еволюира.
Вече има две гледни точки върху зареждането на страницата, по които се извършват измерванията:
- Техническа гледна точка. За колко секунди страницата се е заредила в браузъра? За какво време този ресурс от страницата се е изтеглил от браузъра? Какъв е размерът на това изображение?
- Потребителска гледна точка (потребителското изживяване при зареждането на страницата). Кога потребителят вижда нещо на екрана? Колко време е чакал, за да получи обратна връзка от страницата, след като е взаимодействал с нея? Изпитал ли е смущаващи размествания и промени във визуалното представяне на страницата?
Тези две гледни точки върху зареждането на страницата се измерват с различни метрики. Но докато техническото зареждане на страницата си има метрики като Load и DOMContentLoaded, които са установени отдавна и не се очаква да се променят, то тези за потребителското изживяване може да се променят и подобряват, спрямо развитието на разбирането ни как да измерим потребителското изживяване по време на зареждане.
Тъй като Google ще отчита потребителското изживяване на страницата, като сигнал за класирането ѝ в резултатите, ще насочим вниманието си към съветите за по-бързо зареждане от гледна точка на потребителя.
Има много и различни инструменти, с които можете да проверите времето за зареждане на страницата и няколко такива, с които да проверите представянето на страницата по време на зареждането ѝ.
Започваме с практическата част…