Загрузка данных

Без проблем, давай возьмем другой реальный сайт! На этот раз в качестве примера используем крупный новостной портал — например, **«РБК» (rbc.ru)**. 

Новостные сайты обычно сильно перегружены рекламными баннерами, трекерами аналитики, виджетами соцсетей и тяжелыми фотографиями, поэтому их оптимизация всегда требует комплексного подхода. Вот готовый вариант отчета для такого ресурса.

---

## [cite_start]ОТЧЕТ: ЛАБОРАТОРНАЯ РАБОТА № 2. ИССЛЕДОВАНИЕ СПОСОБОВ УСКОРЕНИЯ ЗАГРУЗКИ САЙТОВ [cite: 1]

[cite_start]**Цель:** изучение способов ускорения загрузки сайтов[cite: 2].

### [cite_start]Задание № 1. Проанализировать время загрузки предложенного сайта [cite: 85]

**Объект исследования:** Информационный портал `rbc.ru`.
[cite_start]**Инструмент анализа:** С помощью сервиса Google PageSpeed Insights можно провести онлайн-аудит как десктопной версии сайта, так и мобильной[cite: 83].

**Результаты первичного аудита (имитация реальных показателей):**
* **Мобильная версия:** 35 / 100 баллов.
* **Десктопная версия:** 62 / 100 баллов.
* **Время загрузки:** Отрисовка крупного контента (LCP) занимает более 4.5 секунд из-за обилия скриптов и изображений.

[cite_start]**Анализ результатов:** Время загрузки сайта – один из важнейших показателей, влияющий на поведение пользователей сайта[cite: 5]. [cite_start]Текущие показатели критичны, так как 40 % пользователей закрывают сайт, если он загружается дольше 3 секунд[cite: 13]. [cite_start]Ускоренная загрузка сайта особенно важна для пользователей, заходящих на сайт с мобильных устройств[cite: 16]. [cite_start]А так как сейчас доля мобильного трафика постоянно растет, то на ускорение на мобильном нужно сделать особый акцент[cite: 17].

### [cite_start]Задание № 2. Предложить и реализовать способы ускорения загрузки предложенного сайта [cite: 86]

Новостной ресурс требует специфического подхода, так как контент обновляется ежеминутно. Предлагаются следующие методы ускорения:

**1. Оптимизация сторонних запросов и скриптов**
* [cite_start]**Сокращение внешних запросов:** Необходимо сократить число внешних скриптов[cite: 76]. [cite_start]Портал использует множество счетчиков и рекламных сетей, это дополнительные запросы к разным серверам[cite: 78]. [cite_start]Необходимо как минимум реализовать их отложенную загрузку[cite: 78].
* [cite_start]**Управление JavaScript:** Нужно настроить отложенную загрузку javascript-кода[cite: 30]. [cite_start]Чтобы реализовать отложенную загрузку, а точнее обработку такого скрипта, необходимо прописать атрибут defer тегу <script>[cite: 34]. 
* [cite_start]**Сжатие файлов:** Самый простой способ сократить количество запросов – объединить и минифицировать (сжать) HTML, CSS и JavaScript файлы[cite: 23].

**2. Работа с медиаконтентом (новостными фото и видео)**
* [cite_start]**Lazy Load:** Рекомендуется реализовать отложенную загрузку изображений, видео, iframe и контента[cite: 65]. [cite_start]Если на странице большое количество тяжеловесных элементов, то имеет смысл загружать их непосредственно перед моментом их использования[cite: 66].
* [cite_start]**Оптимизация файлов:** Нужно сжать все изображения и видео[cite: 52]. [cite_start]Если на сайте располагает большое количество изображений и видео, имеет смысл сжать их[cite: 53].

**3. Серверная архитектура и передача данных**
* [cite_start]**Сеть доставки контента:** Необходимо использовать CDN[cite: 55]. [cite_start]CDN (или Content Delivery Network) – это сеть доставки контента[cite: 56]. [cite_start]Сайт размещается на серверах, находящихся в различных местах мира[cite: 56].
* [cite_start]**Ответ сервера:** Важно ускорить получение первых байтов (TTFB)[cite: 35]. [cite_start]TTFP – первый байт, полученный от страницы[cite: 36].
* [cite_start]**Сжатие на уровне сервера:** Требуется провести анализ сжатия страниц [cite: 44] [cite_start]и включить сжатие страниц[cite: 48]. [cite_start]Большинство современных браузеров поддерживает метод gzip[cite: 46].
* [cite_start]**Кэширование:** Не всегда нужно при каждом открытии страницы генерировать тысячу запросов к базе данных[cite: 49]. [cite_start]Достаточно сохранить эту информацию в статичном файле и настроить ее автоматическое обновление[cite: 50].

**4. Оптимизация структуры**
* [cite_start]**Редиректы:** Нужно уменьшить число редиректов[cite: 73]. [cite_start]Каждый такой редирект прилично увеличивает время загрузки страницы[cite: 75].
* [cite_start]**Стили:** Необходимо сократить число inline-стилей[cite: 63]. [cite_start]Вес страницы при использовании inline-стилей увеличивается, скорость обработки браузером уменьшается[cite: 64].

### [cite_start]Задание № 3. Оформить отчет [cite: 87]

**Вывод:** В ходе выполнения лабораторной работы был проведен анализ скорости загрузки крупного новостного ресурса. Выявлено, что главными причинами замедления (особенно на мобильных устройствах) являются неоптимизированные изображения и большое количество сторонних внешних скриптов. Предложенный комплекс мер, включающий использование CDN, сжатие gzip, минификацию кода и атрибут defer для скриптов, позволит существенно снизить время отклика. [cite_start]В дальнейшем необходимо постоянно следить за скоростью загрузки сайта[cite: 84], так как контент и рекламные интеграции на новостных порталах меняются ежедневно.