Основы веба

HTTP — запрос/ответ поверх TCP. WebSocket — полнодуплексное постоянное соединение по TCP, открываемое через HTTP-upgrade для real-time-push. TCP — с соединением, надёжный, упорядоченный, с рукопожатием и ретрансмиссией. UDP — без соединения, без гарантий доставки, но с низкими накладными расходами — для видео, игр и DNS.

JPEG — с потерями и без прозрачности, идеален для фотографий с маленькими файлами. PNG — без потерь и с альфа-прозрачностью, лучше для логотипов, иконок, чётких краёв и текста. JPEG для фото, PNG для резких краёв и прозрачности. WebP и AVIF часто выигрывают по размеру.

Доступность означает, что компонент управляется с клавиатуры с видимым фокусом, использует семантический HTML плюс ARIA-роли и метки для вспомогательных технологий, корректно управляет фокусом, соблюдает контраст цвета и учитывает reduced-motion. Проверяют клавиатурой, скринридером, автоаудитами вроде axe и контрастом — автоматизация недостаточна.

Snapshot-тесты сериализуют DOM в текст и сравнивают с сохранённым снимком — дёшево и быстро, но слепо к регрессиям CSS/раскладки. Screenshot-тесты рендерят пиксели и сравнивают изображения, ловя визуальные поломки, но медленнее и flaky, требуют сервиса эталонов. Практика: unit-тесты для логики, visual-regression для внешнего вида, snapshot умеренно.

Headless-библиотеки дают поведение, состояние и доступность без стилей или разметки. Они обеспечивают навигацию с клавиатуры, ARIA и управление фокусом; стилизацию вы приносите свою. Это позволяет дизайн-системе оставаться уникальной, наследуя надёжную, протестированную логику взаимодействия.