Уроки
-
Введение
-
Поисковая оптимизация
- Битые ссылки
- Карта сайта
- Микроразметка
- Robots.txt
- Ссылки
- Текст
- Дубликаты
- Базовое
- Картинки
-
Скорость
- Минификация
-
Сокращение запросов
-
Переизбыток мелких картинок
Несгруппированные CSS файлы
Несгруппированные JavaScript файлы
Переизбыток шрифтов
Наличие сквозных CSS, JS файлов
Наличие монохромного шрифта
Загрузка дубликатов файлов
Использование JS фасадов
Перенаправление JavaScript кодом
Добавление ленивой загрузки
Редирект с/на www версию
- Шрифты
- Время загрузки
- Настройки сервера
- Картинки
- Первое содержимое
- Мобильность
- Баги
-
Удобство
- Соцсети
- Browserconfig.xml
- Манифест веб-приложения
- Фавиконы
- Почта
- Базовое
- Читаемость текста
-
Безопасность
- Шифрованное соединение
- Эксплойты
- Уязвимости
Общее время загрузки
Загрузка файлов страницы происходит в следующем порядке:
- Загрузка HTML кода.
- Загрузка ресурсов, указанных в коде. Это картинки, CSS, JavaScript код и другие файлы.
- Второй этап загрузки ресурсов. Например, если в CSS коде в качестве фона указано изображение, то оно загрузится на этом этапе. Код JavaScript исполняется в синхронном, однопоточном режиме. Он может загрузить другие файлы, но это считается дурным тоном, так как ведёт к проблемам многопоточного программирования.
- Срабатывает событие onpageready. В этот момент браузер перестаёт показывать иконку о том, что страница загружается. Это и считается загрузкой страницы. В момент срабатывания этого события браузер гарантирует, что HTML код страницы и все файлы первых двух этапов загрузки полностью загружены, а JavaScript код исполнен.
- Загрузка отложенных ресурсов. У события onpageready может быть множество обработчиков. Часть из них запускают бизнес логику вроде генерации интерактивных функций. Какие-то обработчики могут отправлять данные и загружать файлы. Но если ваш сайт — не какой-то сложный программный онлайн-продукт, то вся бизнес-логика отрабатывает за доли секунды, а сетевые запросы производятся асинхронно. Поэтому считается, что страница в этот момент готова к работе и интерактивна.
Главный способ ускорить сайт - это перенос всего, чего только можно с первых трёх этапов загрузки на последний:
- Загружайте код капчи, карт, онлайн консультант и других сторонних сервисов не через размещение тега
<script>
в HTML коде страницы, а путём добавления обработчика события onpageready. - Большие куски контента также лучше подгрузить отложено. Например, в карточке товара могут быть рекомендации похожих товаров. Поскольку пользователь прокрутит страницу и увидит рекомендации самое ранее через 10 секунд, то есть смысл подгрузить эти данные отдельным запросом. Сделать это можно также в коде обработчика события onpageready.
- Медиафайлы, как картинки видео и аудио лучше вообще загружать по запросу. Картинки, когда пользователь прокручивает экран и находится на расстоянии 1-2 экранов от них. Видео и аудио, когда пользователь нажимает кнопку воспроизведение.
Если загрузка страницы длиться 30 секунд и более, то значит на ней присутствуют блокирующие окончательную загрузку файлы. Один или несколько файлов не получается загрузить и браузер ждёт 30 секунд, прежде чем откажется от их загрузки и переведёт статус страницы в состояние «готово».
Есть замечания или дополнения? Напишите нам на почту admin@quick-site-upgrade.com.
Проверьте ваш сайт