Тема 1: Вводная часть: SSR, CSR, SPA и Hydration. В чем разница и как их отличить за 5 секунд?

Чтобы не тупить над пустым супом из BeautifulSoup, ты должен понимать, КТО и ГДЕ собирает страницу. Есть всего три стула. На какой сядешь — так парсер и напишешь.

1. SSR (Server-Side Rendering) — "Классика"

Это старая школа (Django, PHP, WordPress).

Как работает: Твой скрипт делает запрос. Сервер на бэкенде собирает HTML, вставляет туда цены, картинки, текст и отплевывает тебе готовый документ.
Аналогия: Ты заказал пиццу. Тебе привезли горячую пиццу в коробке. Открыл — ешь.
Для парсера: Рай. Ты получаешь всё и сразу в первом же ответе.
Инструмент: httpx + lxml (или BeautifulSoup).
Признак: Открыл Ctrl+U (исходный код), нажал Ctrl+F, вбил цену — нашел.

2. CSR (Client-Side Rendering) — "Современный Ад"

Это React, Vue, Angular в чистом виде.

Как работает: Твой скрипт делает запрос. Сервер отдает почти пустой HTML: Браузер получает этот скелет, качает жирный JS-файл, запускает его, и этот JS начинает стучаться на сервер за данными (API), чтобы отрисовать карточки товаров.
```
<body>
    <div id="app"></div>
    <script src="bundle.js"></script> 
</body>
```
Аналогия: Ты заказал пиццу. Тебе привезли коробку с сырым тестом, помидорами и поваром-итальянцем. Повар начинает готовить пиццу у тебя на кухне.
Для парсера: Если ты просто скачаешь HTML (requests.get), ты получишь пустую коробку (<div id="app">). Данных там нет.
Инструмент:
- Путь джедая: Искать API (те самые запросы, которые делает повар).
- Путь танка: Эмулировать браузер (Playwright), чтобы JS отработал.
Признак: Открыл Ctrl+U, вбил цену — не нашел. В коде только скрипты.

3. SPA (Single Page Application)

Это подвид CSR. Сайт загружается один раз, а дальше при кликах на ссылки страница не перезагружается полностью, меняется только контент.

Для парсера: Это значит, что URL в адресной строке может меняться, а HTML — нет. Тут парсинг через API — единственный адекватный путь.

4. Hydration (Universal Rendering) — "Скрытое Сокровище"

Это технологии типа Next.js или Nuxt.js. Они пытаются усидеть на двух стульях: чтобы и роботы (SEO) видели текст, и юзерам было интерактивно.

Как работает: Сервер отдает готовый HTML (как в SSR), НО... чтобы React на клиенте "ожил" (гидратировался) и не перерисовывал всё заново, сервер вшивает ВСЕ ДАННЫЕ в страницу в виде JSON.
Аналогия: Тебе привезли готовую пиццу, а на дне коробки приклеен чек со списком всех ингредиентов в граммах.
Где искать: Обычно это тег <script id="__NEXT_DATA__" type="application/json"> или window.__NUXT__.
Для парсера: Это джекпот. Тебе не надо парсить кривой HTML с тегами div. Ты просто достаешь этот JSON и у тебя есть структура данных чище, чем через API.
Признак: В Ctrl+U данные есть, но вокруг много странных тегов, а внизу страницы огромный кусок кода с JSON.

🕵️‍♂️ АЛГОРИТМ: Детектим тип сайта за 5 секунд

Ты зашел на сайт жертвы. Твои действия:

Метод "Моргание":
- Жмешь F5.
- Если контент появился мгновенно — SSR или Hydration.
- Если увидел белый экран/лоадер на долю секунды — CSR.
Метод "Ctrl+U" (Железная гарантия):
- Правой кнопкой -> "Просмотр кода страницы" (View Source).
- Ctrl+F -> Вбиваешь уникальное слово со страницы (например, цену "12 990 ₽" или название товара).
- 🔴 Нашел внутри HTML-тегов (<h1>Товар</h1>) -> SSR.
  - Вердикт: Парсим HTML (lxml, BS4).
- 🟡 Нашел внутри <script> или JSON-строки -> Hydration.
  - Вердикт: Вырезаем JSON (re, json), HTML не трогаем.
- ⚫ Не нашел вообще -> CSR.
  - Вердикт: Идем в Network искать API. HTML бесполезен.

Резюме для архитектора: Не пытайся парсить CSR через BeautifulSoup — получишь пустоту. Не запускай Playwright на SSR сайте — это стрельба из пушки по воробьям. Всегда ищи Hydration-данные — это самый чистый наркотик для парсера.