1.11. Браузеры

ДЛЯ НОВИЧКОВНЕ ОБЯЗАТЕЛЬНОВ РАЗРАБОТКЕ

Всем

1. Что такое браузер: определение и роль в цифровой экосистеме

Веб-браузер — это прикладная программа, предназначенная для получения, интерпретации и отображения гипертекстовых документов, в первую очередь в формате HTML, а также сопутствующих ресурсов (CSS, JavaScript, изображений, медиафайлов), размещённых на веб-серверах либо локально на устройстве пользователя.

Несмотря на кажущуюся простоту — «открываешь ссылку → видишь страницу» — браузер представляет собой одну из самых сложных программных систем, сопоставимую по архитектурной глубине с операционной системой. Он сочетает в себе десятки подсистем: сетевой стек, парсеры языков разметки и программирования, движок компоновки (layout), движок рендеринга, движок выполнения JavaScript, систему кэширования, менеджер закладок, модули безопасности и приватности, систему хранения сессий и данных, модуль синхронизации, интерфейс расширений и многое другое.

Браузер — не просто «окно в интернет». Это вычислительная среда, в которой запускаются полноценные приложения (SPA — single-page applications), воспроизводятся аудио- и видеопотоки, обрабатываются пользовательские вводы, криптографически защищаются сессии, управляются права доступа к аппаратным ресурсам (камера, микрофон, геолокация), а также реализуются сложные протоколы взаимодействия (HTTP/2, HTTP/3, WebSockets, WebRTC). Современный браузер способен функционировать как веб-клиент, PDF-ридер, медиаплеер, текстовый редактор (в режиме contenteditable), виртуальная машина (WebAssembly), а также локальная база данных (IndexedDB, localStorage) — всё это без установки дополнительного ПО.

Важно подчеркнуть: браузер не является частью интернета. Он — клиентская сторона распределённой клиент-серверной архитектуры. Интернет (в узком смысле) — это глобальная сеть сетей, передающая пакеты по протоколам TCP/IP. Браузер же использует эти протоколы, чтобы запрашивать и обрабатывать данные, но сам по себе существует на уровне прикладного программного обеспечения (application layer).

2. Как работает браузер: архитектура «под капотом»

Современные браузеры построены по принципу многопроцессной архитектуры (multi-process architecture), впервые в полной мере реализованной в Google Chrome и затем заимствованной большинством конкурентов. Эта модель обеспечивает стабильность, безопасность и изоляцию компонентов.

2.1. Основные процессы и их назначение

Browser-процесс (главный процесс)
Управляет интерфейсом: адресной строкой, панелью закладок, кнопками навигации, меню настроек. Также отвечает за:
- запуск и остановку других процессов;
- взаимодействие с ОС (файловая система, сетевые интерфейсы, уведомления);
- хранение и синхронизацию пользовательских данных (история, пароли, закладки);
- взаимодействие с сервис-воркерами и фоновыми задачами.
Renderer-процесс (процесс отрисовки)
Запускается для каждой вкладки (или даже для каждого домена/iframe при включённой site isolation). В нём выполняется:
- парсинг HTML → построение DOM-дерева;
- парсинг CSS → построение CSSOM-дерева;
- объединение DOM и CSSOM в Render Tree;
- layout (расчёт геометрии элементов);
- paint (преобразование в пиксели на GPU-поверхности);
- композитинг (объединение слоёв в финальный кадр);
- выполнение JavaScript через V8 (Chrome/Edge/Opera/Yandex), SpiderMonkey (Firefox) или JavaScriptCore (Safari).
Критически: при падении renderer-процесса (например, из-за бесконечного цикла в JS) страдает только одна вкладка, а не весь браузер.
GPU-процесс
Отвечает за аппаратное ускорение: передаёт команды напрямую видеодрайверу для рендеринга 2D/3D-графики (WebGL, CSS transforms, анимации). Изолирован для предотвращения эксплуатации уязвимостей драйверов.
Network-процесс (или service в некоторых реализациях)
Централизованная обработка сетевых запросов: кэширование, управление соединениями (HTTP/2 multiplexing), DNS prefetching, обработка HSTS, куки, CORS-политик. Вынесен в отдельный процесс для повышения безопасности и избежания блокировки UI при медленных сетях.
Utility-процессы
Вспомогательные: для обработки аудио (Web Audio API), для работы с файловой системой (File System Access API), для изоляции расширений (extension host), для обработки PDF (встроенный PDFium в Blink или PDF.js в Firefox).
Plugin-процессы (устаревшие)
Ранее использовались для NPAPI-плагинов (Flash, Java), сейчас почти полностью выведены из употребления.

2.2. Жизненный цикл загрузки страницы (high-level)

Пользователь вводит URL (например, https://example.com) или кликает по ссылке.
Browser-процесс проверяет, не является ли строка поисковым запросом → при необходимости перенаправляет на поисковик.
Запускается сетевой стек: DNS-запрос → установка TCP-соединения (с TLS-рукопожатием при HTTPS) → отправка HTTP-запроса GET /.
Получен ответ: заголовки (статус, Content-Type, Set-Cookie) и тело (HTML).
Запускается renderer-процесс (если новая вкладка). В нём:
- HTML парсится в DOM;
- параллельно загружаются внешние ресурсы (CSS, JS, изображения);
- CSS парсится в CSSOM;
- при наличии блокирующих <script> — приостанавливается построение DOM до выполнения скрипта;
- формируется Render Tree (видимые узлы DOM + стили);
- производится layout (расчёт позиций и размеров);
- выполняется paint (рендер пикселей в offscreen-буфер);
- композитор объединяет слои и передаёт кадр GPU-процессу;
- GPU-процесс выводит кадр на экран через драйвер.
После полной загрузки могут запускаться Service Workers, обрабатываться DOMContentLoaded, load, анимации, Web Workers.

Этот цикл занимает от десятков миллисекунд до секунд — и каждая его фаза поддаётся тонкой настройке (предзагрузка, предварительный парсинг DNS, lazy loading и т.д.).

3. Браузер как оффлайн-инструмент

Миф: «браузер работает только в интернете». На деле он — полноценное приложение для работы с локальными файлами и автономными веб-технологиями.

3.1. Открытие локальных HTML-файлов

Любой HTML-документ, сохранённый на диске (например, file:///home/user/page.html), может быть открыт через меню Файл → Открыть файл или перетаскиванием в окно браузера. При этом:

выполняется полный цикл рендеринга (DOM, CSSOM, layout, paint);
JavaScript работает (но с ограничениями: fetch() к локальным файлам запрещён из-за CORS, localStorage ограничен);
CSS и изображения загружаются, если указаны относительные пути.

Это позволяет использовать браузер для:

просмотра документации (например, сгенерированной через JSDoc или Sphinx);
тестирования верстки без сервера;
запуска простых интерактивных инструментов (калькуляторы, диаграммы, игры на Canvas).

3.2. Встроенный PDF-ридер

Современные браузеры (кроме Safari, который делегирует задачу системному Preview) содержат собственные PDF-движки:

Chrome/Edge/Yandex/Opera — PDFium (открытый проект от Google);
Firefox — PDF.js (написан на JavaScript, полностью веб-ориентированный).

PDF обрабатывается renderer-процессом как отдельный документ: строится DOM-подобная структура, применяется масштабирование, поиск по тексту, выделение, аннотации. Все операции происходят локально — без отправки файла на сервер.

3.3. Автономные веб-приложения (PWA)

Через Service Workers и Cache Storage браузер может кэшировать ресурсы и обеспечивать работу сайтов без подключения к сети. Пример: приложение Gmail в режиме «offline» позволяет писать письма, которые отправятся при восстановлении связи.

4. Мультимедийные и текстовые возможности

Браузер поддерживает широкий спектр медиаформатов через стандартизированные API:

Формат / API	Поддержка	Примечания
Видео	`<video>` + `MediaSource Extensions`	Поддержка MP4 (H.264), WebM (VP9), AV1 (ограниченно). HLS/DASH — через MSE.
Аудио	`<audio>` + Web Audio API	Проигрывание, синтез (TTS), анализ спектра, эффекты в реальном времени.
Изображения	`<img>`, Canvas 2D/3D, CSS	JPEG, PNG, GIF, WebP, AVIF. Canvas позволяет программно редактировать пиксели.
Текст	`contenteditable`, `designMode`, `execCommand` (устар.), `Input Events`	Поддержка форматированного редактирования (как в Word). Используется в редакторах (TinyMCE, Quill).
Шрифты	`@font-face`, WOFF/WOFF2	Загрузка и кэширование кастомных шрифтов.

Все эти функции реализованы на уровне движка и не требуют внешних плагинов.

5. Экономическая модель: почему браузеры бесплатны

Все основные браузеры распространяются бесплатно. Это связано с их ролью как платформы доставки:

Google Chrome монетизируется через доминирование поисковой системы (по умолчанию — Google Search; каждая строка в адресной строке → запрос в Google → рекламный доход).
Яндекс.Браузер продвигает экосистему Яндекса (Поиск, Маркет, Диск, Почта).
Microsoft Edge интегрирован в Windows и стимулирует использование Azure, Office 365, Bing Rewards.
Firefox финансируется за счёт партнёрских соглашений (в прошлом — с Google, сейчас — с несколькими поисковиками) и пожертвований.

Финансовая модель не влияет на техническую реализацию, но определяет:

предустановленные сервисы;
уровень телеметрии;
политику по умолчанию (например, блокировка трекеров в Firefox vs их разрешение в Chrome).

6. Движки (rendering engines): ядро браузера

Движок — программное ядро, ответственное за обработку HTML/CSS и рендеринг страницы. От его реализации зависит совместимость, производительность и безопасность.

Движок	Основные браузеры	Архитектурные особенности
Blink	Chrome, Edge, Opera, Яндекс.Браузер, Brave, Vivaldi	Форк WebKit (2013). Активная разработка Google. Оптимизация под V8, строгая изоляция процессов, поддержка новых веб-стандартов «из коробки».
WebKit	Safari (macOS/iOS), GNOME Web	Оригинальный движок от Apple (на базе KHTML). Энергоэффективность — приоритет №1. Медленнее вводит новые API, но стабильнее в работе на iOS.
Gecko	Firefox	Написан Mozilla с нуля. Акцент на конфиденциальность, открытость, кросс-платформенность. Использует Quantum — переписанный на Rust движок компоновки и рендеринга.

⚠️ Важно: один и тот же движок (Blink) не гарантирует идентичного поведения. Реализация зависит от:

версии движка;

настроек браузера (например, site isolation);

политик безопасности по умолчанию;

наличия проприетарных компонентов (например, Widevine для DRM в Chrome).

7. Стандартные браузеры ОС

Многие операционные системы поставляются со встроенными браузерами:

Windows: Internet Explorer (устаревший, EOL), Microsoft Edge (Chromium-based — замена по умолчанию с 2020 г.);
macOS/iOS: Safari (единственный разрешённый браузерный движок на iOS — WebKit, даже Chrome на iOS — это обёртка над WebKit);
Android: WebView (системный компонент на базе Chromium), Chrome (предустановлен на большинстве устройств);
Linux: обычно нет предустановленного браузера, но дистрибутивы включают Firefox или Chromium.

Такие браузеры тесно интегрированы с ОС: используют системные сертификаты, настройки прокси, сервисы аутентификации (Windows Hello, Touch ID), системные шрифты и т.д.

Практическое задание

Попробуйте установить и поработать как минимум с трёмя из вышеперечисленных браузеров.

Часть 2. Практика использования: установка, интерфейс, настройка, эксплуатация

1. Установка и первоначальная настройка

1.1. Где и как получить браузер

Все основные браузеры распространяются через официальные веб-сайты, а не через сторонние площадки. Это критически важно: загрузка «ChromeSetup.exe» с агрегатора ПО (например, с «скачать-бесплатно.рф») несёт высокий риск внедрения рекламного ПО (adware), модифицированных установщиков или троянов.

Правильные источники:

Google Chrome: https://www.google.com/chrome/
Яндекс.Браузер: https://browser.yandex.ru/
Mozilla Firefox: https://www.mozilla.org/firefox/
Microsoft Edge: предустановлен в Windows 10/11; обновления — через Центр обновления Windows или https://www.microsoft.com/edge
Opera: https://www.opera.com/
Brave: https://brave.com/
Vivaldi: https://vivaldi.com/

Установка на Windows

Перейти на официальный сайт → нажать Скачать.
Запустить скачанный файл (обычно .exe, ~60–80 МБ — это минимальный установщик, который скачает полную версию при запуске).
Запустится автоматическая установка без необходимости вмешательства (по умолчанию в %LOCALAPPDATA%\Google\Chrome\Application\ или аналогичную папку для других браузеров).
При первом запуске:
- может предложить импортировать данные из другого браузера (история, закладки, пароли, настройки);
- предложит войти в аккаунт (Google, Яндекс и др.) для синхронизации;
- спросит, сделать ли его браузером по умолчанию.

⚠️ Важно при установке Яндекс.Браузера: на этапе «настройка поиска» по умолчанию предлагается установить «Яндекс» как поисковик и «Дзен» как стартовую страницу. Пользователь вправе изменить эти параметры до завершения установки — интерфейс позволяет явно указать «Google» или «Bing», а стартовую страницу — оставить пустой (about:blank) или выбрать свою.

Установка на Linux (Ubuntu/Debian, Arch, и др.)

Chrome / Яндекс.Браузер / Opera / Edge — доступны через .deb (Debian/Ubuntu) или .rpm (Fedora/RHEL), либо через Flatpak/Snap.

Пример для Chrome (Debian/Ubuntu):

wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
sudo apt install ./google-chrome-stable_current_amd64.deb

Firefox — обычно предустановлен; если нет — входит в репозиторий дистрибутива (sudo apt install firefox).

Установка на macOS

Скачивается .dmg-образ → монтируется → перетаскивание иконки в папку Applications.
Первый запуск может потребовать подтверждения в Системных настройках → Конфиденциальность и безопасность, поскольку приложение не подписано Apple Developer ID (в случае неподписанных сборок, например, Vivaldi).

2. Структура интерфейса: что есть что и для чего

Современный браузерный интерфейс стандартизирован: большинство элементов расположены одинаково в Chrome, Edge, Яндекс.Браузере и Opera. Разберём их сверху вниз.

2.1. Окно (Window) и вкладка (Tab)

Окно — отдельный экземпляр приложения, управляемый операционной системой. Может содержать одну или несколько вкладок.
Вкладка — контейнер одного документа (страницы). Вкладки изолированы на уровне renderer-процесса (при включённой site isolation — даже по доменам).
Горячие клавиши:
- Ctrl+T / Cmd+T — новая вкладка;
- Ctrl+W / Cmd+W — закрыть текущую вкладку;
- Ctrl+Tab — переключение по недавно использованным вкладкам;
- Ctrl+Shift+T — восстановить последнюю закрытую вкладку (до 10 последних).

Вкладки могут быть:

активными (в фокусе);
фоновыми (выполняют ограниченный JS, приостановлены по тайм-ауту);
закреплёнными (pinned tab): уменьшены по ширине, не имеют кнопки закрытия, загружаются при старте (удобно для почты, мессенджеров).

2.2. Адресная строка (Omnibox / Smart Box)

Не просто поле для ввода URL. Это мультисистемный интерфейс:

ввод URL → переход;
ввод поискового запроса → поиск через поисковик по умолчанию;
ввод chrome://flags → доступ к экспериментальным настройкам;
ввод about:blank → пустая страница;
ввод file:///C:/path/to/file.html → открытие локального файла;
отображает статус подключения (замок → HTTPS, серый/красный значок — проблема с сертификатом);
показывает автодополнения: из истории, закладок, поиска.

В Яндекс.Браузере адресная строка называется умной строкой и включает:

кнопку «Турбо» (при слабом интернете — сжатие трафика через прокси Яндекса);
кнопку «Защита» (антивирусная проверка загружаемых файлов и сайтов);
кнопку «Перевод» (встроенный переводчик).

2.3. Панель закладок (Bookmarks Bar)

Строка под адресной строкой, куда можно перетаскивать страницы или добавлять через Ctrl+D. Закладки хранятся локально и синхронизируются при входе в профиль.
Можно создавать:

папки (для группировки);
«умные папки» (в Firefox — по тегам/истории);
кнопки быстрого доступа: например, javascript:document.body.contentEditable='true';void(0) — включить редактирование любой страницы.

Содержит:

кнопки навигации («Назад», «Вперёд», «Обновить / Остановить»);
меню (три точки/три полоски) — доступ ко всем настройкам, расширениям, закладкам, истории;
значки установленных расширений (отображаются при явной настройке — по умолчанию скрыты);
кнопка профиля (если вошли в аккаунт).

2.5. Рабочая область (Viewport)

Область отображения контента: HTML, PDF, изображения, видео.
Поддерживает масштабирование: Ctrl +, Ctrl -, Ctrl + 0 (сброс). Уровень масштаба сохраняется по домену (например, на habr.com можно ставить 110%, а на youtube.com — 100%).
Поддерживает режим чтения (в Edge, Safari, Firefox) — убирает рекламу и навигацию, оставляя только текст.

3. Основные операции: как пользоваться

3.1. Загрузка файлов

При клике на ссылку с Content-Disposition: attachment или на <a download> файл сохраняется в папку Загрузки (по умолчанию).
Можно изменить поведение:
- спрашивать путь для каждого файла;
- использовать другую папку;
- блокировать автоматическое открытие после загрузки (опасно для исполняемых файлов — .exe, .bat, .js).
История загрузок — Ctrl+J / Меню → Загрузки.

3.2. Встроенный переводчик

Активируется автоматически при заходе на страницу на иностранном языке (если включена опция).
В Chrome/Yandex — основан на Google Translate API (вне зависимости от поисковика).
Работает полностью в браузере (не отправляет текст на сервер при включённом оффлайн-переводе — требуется предварительная загрузка языковых моделей).
Перевод может нарушать верстку — особенно при динамической подгрузке контента (SPAs).

3.3. Аппаратное ускорение

Использует GPU для:
- рендеринга CSS-анимаций и трансформаций;
- декодирования видео (H.264, VP9);
- WebGL и Canvas 2D/3D.
Включено по умолчанию. Отключение (Настройки → Система → Использовать аппаратное ускорение) снижает нагрузку на GPU, но повышает нагрузку на CPU и может вызвать артефакты или просадки FPS.
Диагностика: chrome://gpu — отчёт о поддержке функций (Video Decode, Canvas, WebGL и др.).

3.4. Фоновые сервисы

Service Workers — скрипты, работающие в фоне даже при закрытой вкладке. Используются для:
- кэширования ресурсов (PWA);
- push-уведомлений;
- синхронизации в фоне (Background Sync).
Notifications API — запрос разрешения на показ уведомлений (например, от Telegram Web).
Geolocation API — доступ к GPS/Wi-Fi-геолокации (только по разрешению).
MediaDevices API — доступ к камере и микрофону (только по разрешению, с индикацией в адресной строке 🔴).

4. Настройки: под капотом пользователя

4.1. Профиль и синхронизация

При входе в аккаунт (Google, Яндекс) создаётся профиль синхронизации. В него входят:

закладки;
история (опционально);
пароли (зашифрованы end-to-end при включённой опции);
расширения;
настройки (поисковик, стартовая страница, масштаб);
открытые вкладки («Продолжить с других устройств»).

🔐 Безопасность: пароли в Chrome синхронизируются в зашифрованном виде, но ключ шифрования — пароль от аккаунта Google. В Яндекс.Браузере — аналогично, с привязкой к аккаунту Яндекса. Для максимальной приватности можно отключить синхронизацию паролей и использовать локальный менеджер (KeePass, Bitwarden).

4.2. Поисковая система по умолчанию

Меняется в Настройки → Поиск в адресной строке. Доступные варианты зависят от региона и браузера:

В Chrome: Google, Яндекс, Bing, DuckDuckGo, Qwant, Ecosia;
В Яндекс.Браузере: Яндекс (по умолчанию), Google, Bing.

Можно добавить кастомный движок:
Настройки → Поиск → Управление поисковыми системами → Добавить → указать имя, ключевое слово и URL-шаблон (например, https://duckduckgo.com/?q=%s).

4.3. Автозаполнение и управление паролями

Автозаполнение форм: имя, email, адрес, карта — хранятся локально или в облаке.
Менеджер паролей:
- предлагает сохранять пароли при входе;
- проверяет утечки (chrome://settings/passwords → Проверить пароли);
- генерирует надёжные пароли при регистрации.
Рекомендация: использовать двухфакторную аутентификацию (2FA) и не сохранять пароли от банковских сервисов в браузере.

4.4. Приватность и безопасность

Настройка	Где найти	Что делает
Инкогнито-режим	`Ctrl+Shift+N`	Не сохраняет историю, куки, данные форм. Не делает анонимным — провайдер, работодатель, сайт всё равно видят трафик.
Третья сторона: куки	`Настройки → Конфиденциальность → Куки`	Блокировка сторонних куки повышает приватность, но ломает авторизацию на многих сайтах (например, вход через Google).
Do Not Track	`Настройки → Конфиденциальность`	Отправляет HTTP-заголовок `DNT: 1`. Поддерживается редко — юридически не обязателен.
Безопасный просмотр (Safe Browsing)	`Настройки → Конфиденциальность`	Проверяет URL и загрузки на наличие фишинга/вредоносов. В Chrome — стандартный/расширенный режим (отправка URL в Google).
Доступ к камере/микрофону/геолокации	`Настройки → Конфиденциальность → Настройки сайтов`	Можно разрешить/запретить глобально или для каждого домена. Индикация активности — в адресной строке.

4.5. Внешний вид и кастомизация

Темы: смена цветовой схемы (светлая/тёмная/авто). В Chrome — через Web Store; в Яндекс.Браузере — встроенный каталог.
Показ панелей:
- панель закладок — Ctrl+Shift+B;
- панель расширений — настраивается в chrome://extensions → Панель инструментов;
- строка состояния (при наведении на ссылку) — отключена в новых версиях (по соображениям безопасности — фишинг через подмену URL в статус-баре).
Стартовая страница: может быть:
- новой вкладкой (с быстрыми ссылками, поиском, новостями);
- about:blank (максимальная скорость запуска);
- произвольным URL (например, https://start.duckduckgo.com).

5. Расширения: что это и как работают

Расширение (extension) — программный модуль, расширяющий функционал браузера. Установленные расширения работают в изолированном extension host-процессе и взаимодействуют с вкладками через Content Scripts (внедряются в DOM) и Background Scripts (работают постоянно в фоне).

5.1. Права доступа (permissions)

При установке расширение запрашивает права:

tabs — чтение URL и заголовков вкладок;
storage — доступ к localStorage расширения;
webRequest — перехват и модификация сетевых запросов;
activeTab — доступ только к текущей вкладке (без постоянных разрешений);
clipboardWrite — запись в буфер обмена.

⚠️ Расширение с правом webRequest + <all_urls> может читать и изменять любой трафик — включая банковские сессии. Устанавливать стоит только из официальных магазинов (Chrome Web Store, addons.mozilla.org) и с осторожностью.

5.2. Установка (на примере Chrome)

Открыть chrome://extensions или перейти в Chrome Web Store.
Найти расширение (например, «uBlock Origin»).
Нажать Добавить в Chrome → подтвердить права.
После установки:
- значок появляется в панели инструментов (если разрешено);
- можно настроить через клик по значку или в chrome://extensions.

В Яндекс.Браузере используется тот же движок — расширения Chrome ставятся без изменений (магазин — https://chrome.google.com/webstore, так как Яндекс не имеет своего).

Часть 3. Сравнительный анализ, интеграции и инструменты профессионального использования

1. Сравнение браузеров: объективные метрики

Ниже приводятся результаты, основанные на открытых источниках:
— тесты Speedometer 3.0 (Apple), WebXPRT 4 (Principled Technologies), MotionMark (рендеринг анимаций);
— профилирование через about:memory, chrome://tracing, about:performance;
— проверка поддержки веб-стандартов — Web Platform Tests, Can I use;
— данные по энергопотреблению — Battery Life Test от UL Solutions (2024).

Параметр	Chrome (126)	Edge (126)	Яндекс.Браузер (24.7)	Firefox (128)	Safari (17.5)
Движок	Blink	Blink	Blink	Gecko (Quantum)	WebKit
Время запуска (с холодного старта, SSD, Win11)	0.8–1.2 с	0.7–1.1 с	1.0–1.5 с	1.1–1.6 с	— (macOS)
Потребление RAM (10 вкладок: habr, lenta, youtube, github, wikipedia, etc.)	~1.4 ГБ	~1.3 ГБ	~1.5 ГБ	~1.1 ГБ	~0.9 ГБ (macOS)
Потребление CPU (фон, 5 вкладок)	1.2–2.5%	1.0–2.2%	1.5–3.0%	0.8–1.8%	0.6–1.2%
Энергопотребление (видео 1080p, 1 час, ноутбук)	18% батареи	17%	19%	15%	11%
Поддержка WPT (процент пройденных тестов, июнь 2025)	98.4%	98.2%	98.1%	97.8%	96.5%
Поддержка WebRTC	полная (VP8/VP9/AV1, simulcast, SVC)	полная	полная	полная	ограничена (H.264 only на iOS)
Поддержка WebAssembly	полная (SIMD, threads, GC)	полная	полная	полная (включая GC)	частичная (SIMD — да, threads — нет)
Изоляция по доменам (Site Isolation)	включена по умолчанию	включена	отключена по умолчанию (включается вручную)	частичная (процесс на origin)	строгая (на iOS — обязательна)
Кэширование Service Worker	до 50 МБ (по умолчанию), расширяемо	аналогично Chrome	до 50 МБ	до 50 МБ	до 50 МБ

📌 Комментарий по Яндекс.Браузеру:
— Основан на Chromium 126 (актуальная версия на июль 2025), но содержит кастомные модули:

Яндекс.Сервисы — фоновый worker для Дзена, Карт, Переводчика;

Турбо-режим — проксирует трафик через серверы Яндекса, сжимает изображения и CSS/JS (HTTP ↔ HTTPS MITM, с собственным сертификатом — требует доверия к корневому сертификату Яндекса);

Антивирусная проверка — интеграция с базой VirusTotal через API;
— Из-за этих компонентов наблюдается +5–10% к потреблению RAM и +100–300 мс к времени запуска по сравнению с «чистым» Chrome.

📌 Комментарий по Firefox:
— Единственный из крупных браузеров, использующий Rust в критических компонентах (Servo-движок частично интегрирован в Quantum), что снижает количество уязвимостей типа use-after-free и buffer overflow (по данным Mozilla Security Advisory — на 40% меньше CVE, связанных с памятью, чем у Blink в 2024 г.);
— Поддерживает контейнеры (Multi-Account Containers) — изоляция сессий по цветам/именам (технически — разные userContextId в cookies и localStorage), что эффективнее, чем инкогнито для разделения учётных записей.

2. Интеграция с корпоративными и государственными системами

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

2.1. Поддержка ГОСТ-криптографии

ГОСТ Р 34.10-2012 / 34.11-2012 (подпись и хэширование) и ГОСТ Р 34.12-2015 (шифрование «Магма»/«Кузнечик») не поддерживаются напрямую ни одним из массовых браузеров. Причина — отсутствие в TLS 1.2/1.3 официальных Cipher Suites для ГОСТ в RFC (пока существует только черновик).

Вместо этого используется гибридный подход:

TLS-соединение устанавливается по стандартным алгоритмам (RSA/ECDHE + AES-GCM);
Подпись и шифрование данных прикладного уровня выполняются на стороне веб-приложения через:
- Web Crypto API (ограниченно — не поддерживает ГОСТ);
- Расширения браузера (например, «КриптоПро ЭЦП Browser Plug-in»);
- Внешние модули (КриптоПро CSP + плагин NPAPI/PPAPI — устаревший, не работает в Chrome ≥ 85);
- WebAssembly-реализации (например, gost-crypto-wasm) — полностью в браузере, без установки ПО.

✅ Текущее состояние (2025):

КриптоПро официально рекомендует использовать расширение на основе WebExtensions (работает в Chrome, Edge, Яндекс.Браузере), которое взаимодействует с локальным CSP через Native Messaging Host (отдельный .exe/.sh, зарегистрированный в ОС).

Firefox имеет встроенную поддержку PKCS#11, что позволяет напрямую подключать криптопровайдеры (например, ViPNet CSP) — наиболее стабильный вариант для госсектора.

Safari и мобильные браузеры (включая Chrome на iOS) не поддерживают интеграцию с локальными CSP — работа с ЭЦП невозможна без внешнего приложения (например, «КриптоАРМ» на ПК и передача подписи через QR).

2.2. Работа с ЕСИА, ГИС ЖКХ, ЕГАИС и другими ГИС

Требования:

Поддержка TLS 1.2+;
Корректная обработка OCSP-запросов (онлайн-проверка сертификатов);
Возможность установки корневых сертификатов УЦ (ФНС, Минцифры, УЦ регионов);
Отсутствие блокировки eval() и new Function() (часто используется в legacy-коде госсистем).

Проверенные совместимые браузеры (по отчётам Минцифры РФ, 2024):

Браузер	Совместимость	Примечания
Яндекс.Браузер	✅ Полная	Предустановленный корневой сертификат УЦ «Россия»; поддержка КриптоПро-плагина; тестирован на ЕСИА, ГИС ЖКХ
Chrome	✅ (с настройкой)	Требуется ручная установка корневых сертификатов и плагина КриптоПро
Edge	✅ (с настройкой)	Интеграция с Windows Certificate Store — проще установка сертификатов
Firefox	✅ (предпочтительно)	Управление сертификатами через `about:preferences#privacy → Certificates`; поддержка PKCS#11; стабильная работа с ГИС с 2019 г.
Safari	⚠️ Ограниченная	Проблемы с OCSP в старых версиях; не поддерживает внешние CSP

📌 Рекомендация для госорганизаций:
Использовать Firefox ESR (Extended Support Release) — получает обновления безопасности 1 раз в 4–6 недель, сохраняет стабильный API, поддерживает legacy-плагины дольше, чем Chrome.

3. Инструменты разработчика и администрирования

3.1. DevTools: не просто «F12»

DevTools — встроенный инструментарий для отладки, профилирования и аудита. Доступен через F12 или Ctrl+Shift+I.

Ключевые вкладки и их профессиональное применение:

Вкладка	Основные функции	Примеры использования
Elements	Редактирование DOM/CSS в реальном времени	Поиск узлов по XPath/CSS-селектору; отладка `:hover`, `::before`; проверка адаптивных точек (`device mode`)
Console	Выполнение JS, вывод логов	`$0` — ссылка на выделенный элемент; `copy($$('a'))` — скопировать все ссылки на странице
Sources	Отладка JS, breakpoints	Условные точки останова; blackboxing (игнорирование библиотек); source maps для TypeScript/Webpack
Network	Анализ сетевых запросов	Фильтрация по типу (`xhr`, `fetch`, `media`); проверка CORS-заголовков; имитация медленного интернета (Throttling)
Performance	Профилирование времени выполнения	Запись timeline: layout, paint, script evaluation; выявление forced sync layouts
Memory	Анализ утечек памяти	Снимки heap; сравнение до/после действия; поиск detached DOM trees
Application	Работа с локальным хранилищем	Просмотр `localStorage`, `IndexedDB`, `Cache Storage`; очистка Service Workers; редактирование cookies
Lighthouse	Аудит качества	Генерация отчёта по Accessibility, SEO, Performance, Best Practices (оценка по 100 баллам)

💡 Продвинутая функция:
В Chrome/Edge/Yandex — chrome://inspect → удалённая отладка Android-устройств (через USB debugging) или других ПК в локальной сети.

3.2. Экспериментальные функции (`chrome://flags`)

Флаги — скрытые настройки, позволяющие включать/отключать экспериментальные API. Примеры:

Флаг	Эффект	Статус (2025)
`#enable-webusb`	Доступ к USB-устройствам из веба	Стабильный (WebUSB API)
`#enable-experimental-web-platform-features`	Включение черновиков спецификаций	Только для тестирования
`#enable-parallel-downloading`	Многопоточная загрузка	Включено по умолчанию с Chrome 115
`#enable-gpu-rasterization`	Рендеринг через GPU (даже для 2D)	Рекомендуется для слабых CPU
`#third-party-cookie-phaseout`	Эмуляция отключения сторонних куки	Активно тестируется (запланировано на 2025)

⚠️ Изменение флагов может привести к нестабильности. После сброса (Reset all) браузер перезапускается.

3.3. Централизованное управление (для ИТ-администрирования)

Корпоративные браузеры управляются через политики:

Windows:
- gpedit.msc → Конфигурация компьютера → Административные шаблоны → Google Chrome / Microsoft Edge;
- или через Intune / SCCM (через OMA-URI).
Linux/macOS:
- JSON-файлы политик в /etc/opt/chrome/policies/managed/ (или ~/Library/Preferences/com.google.Chrome.plist).

Типовые политики:

{
  "HomepageLocation": "https://intranet.company.ru",
  "DefaultSearchProviderEnabled": true,
  "DefaultSearchProviderName": "Внутр. поисковик",
  "DefaultSearchProviderSearchURL": "https://search.company.ru?q={searchTerms}",
  "PasswordManagerEnabled": false,
  "ExtensionInstallBlocklist": ["*"],
  "ExtensionInstallAllowlist": ["cjpalhdlnbpafiamejdnhcphjbkeiagm"], // uBlock Origin
  "AuthServerWhitelist": "*.company.ru",
  "AuthNegotiateDelegateWhitelist": "*.company.ru"
}

📌 Для ELMA365 / BPMSoft:
Рекомендуется политика AuthServerWhitelist, чтобы разрешить NTLM/Kerberos-авторизацию без запроса логина/пароля при входе в корпоративную BPM-систему.

4. Тренды и будущее (2025–2027)

4.1. Manifest V3 и судьба расширений

Google постепенно переводит расширения с Manifest V2 на V3:

Удалён background pages → заменены на Service Workers (меньше памяти, но сложнее логика);
webRequest API заменён на declarativeNetRequest — расширения не могут читать содержимое запросов, только блокировать по правилам;
Ограничение на количество правил: 30 000 (в uBlock Origin — 300 000+).

⚖️ Последствия:
— Адблокеры теряют гибкость (фильтрация по контексту, динамическим правилам);
— Расширения для мониторинга трафика (например, Postman Interceptor) требуют обходных решений;
— Firefox сохраняет поддержку V2 до конца 2025 г., разрабатывает альтернативный подход к безопасности расширений.

4.2. Упразднение сторонних куки (Privacy Sandbox)

Chrome планирует отключить сторонние куки по умолчанию в конце 2025 г. Взамен — механизмы:

Topics API — браузер определяет интересы пользователя по посещённым сайтам и передаёт тему (например, «технологии») рекламодателю — без идентификации;
FLEDGE — аукцион ретаргетинга внутри браузера (без передачи данных на сервер);
Attribution Reporting — анонимная аналитика конверсий.

⚠️ Влияние на разработчиков:
— Потребуется переработка систем аналитики (отказ от pixel.gif);
— Возрастёт роль first-party data (данных, собранных напрямую на своём домене);
— Усложнится кросс-доменная авторизация (SSO между сервисами одной компании).

4.3. WebContainers и браузер как ОС

Проект WebContainers (от StackBlitz) позволяет запускать Node.js-процессы прямо в браузере через WebAssembly и Service Workers. Это:

полностью изолированная среда выполнения (без доступа к файловой системе хоста);
поддержка npm, vite, webpack — сборка фронтенда в браузере;
перспектива — замена локальных IDE для обучения и прототипирования.

🔮 Перспективы:
Браузер переходит от клиента к платформе доставки вычислений. В 2026–2028 гг. возможны:

веб-приложения с оффлайн-доступом к базам данных (лучше, чем localStorage);

запуск лёгких десктопных приложений (на Electron-подобной основе, но в песочнице);

интеграция с Web GPU для ML-инференса на клиенте.

1. Что такое браузер: определение и роль в цифровой экосистеме​

2. Как работает браузер: архитектура «под капотом»​

2.1. Основные процессы и их назначение​

2.2. Жизненный цикл загрузки страницы (high-level)​

3. Браузер как оффлайн-инструмент​

3.1. Открытие локальных HTML-файлов​

3.2. Встроенный PDF-ридер​

3.3. Автономные веб-приложения (PWA)​

4. Мультимедийные и текстовые возможности​

5. Экономическая модель: почему браузеры бесплатны​

6. Движки (rendering engines): ядро браузера​

7. Стандартные браузеры ОС​

Часть 2. Практика использования: установка, интерфейс, настройка, эксплуатация​

1. Установка и первоначальная настройка​

1.1. Где и как получить браузер​

Установка на Windows​

Установка на Linux (Ubuntu/Debian, Arch, и др.)​

Установка на macOS​

2. Структура интерфейса: что есть что и для чего​

2.1. Окно (Window) и вкладка (Tab)​

2.2. Адресная строка (Omnibox / Smart Box)​

2.3. Панель закладок (Bookmarks Bar)​

2.4. Панель инструментов (Toolbar)​

2.5. Рабочая область (Viewport)​

3. Основные операции: как пользоваться​

3.1. Загрузка файлов​

3.2. Встроенный переводчик​

3.3. Аппаратное ускорение​

3.4. Фоновые сервисы​

4. Настройки: под капотом пользователя​

4.1. Профиль и синхронизация​

4.2. Поисковая система по умолчанию​

4.3. Автозаполнение и управление паролями​

4.4. Приватность и безопасность​

4.5. Внешний вид и кастомизация​

5. Расширения: что это и как работают​

5.1. Права доступа (permissions)​

5.2. Установка (на примере Chrome)​

Часть 3. Сравнительный анализ, интеграции и инструменты профессионального использования​

1. Сравнение браузеров: объективные метрики​

2. Интеграция с корпоративными и государственными системами​

2.1. Поддержка ГОСТ-криптографии​

2.2. Работа с ЕСИА, ГИС ЖКХ, ЕГАИС и другими ГИС​

3. Инструменты разработчика и администрирования​

3.1. DevTools: не просто «F12»​

3.2. Экспериментальные функции (chrome://flags)​

3.3. Централизованное управление (для ИТ-администрирования)​

4. Тренды и будущее (2025–2027)​

4.1. Manifest V3 и судьба расширений​

4.2. Упразднение сторонних куки (Privacy Sandbox)​

4.3. WebContainers и браузер как ОС​

1. Что такое браузер: определение и роль в цифровой экосистеме

2. Как работает браузер: архитектура «под капотом»

2.1. Основные процессы и их назначение

2.2. Жизненный цикл загрузки страницы (high-level)

3. Браузер как оффлайн-инструмент

3.1. Открытие локальных HTML-файлов

3.2. Встроенный PDF-ридер

3.3. Автономные веб-приложения (PWA)

4. Мультимедийные и текстовые возможности

5. Экономическая модель: почему браузеры бесплатны

6. Движки (rendering engines): ядро браузера

7. Стандартные браузеры ОС

Часть 2. Практика использования: установка, интерфейс, настройка, эксплуатация

1. Установка и первоначальная настройка

1.1. Где и как получить браузер

Установка на Windows

Установка на Linux (Ubuntu/Debian, Arch, и др.)

Установка на macOS

2. Структура интерфейса: что есть что и для чего

2.1. Окно (Window) и вкладка (Tab)

2.2. Адресная строка (Omnibox / Smart Box)

2.3. Панель закладок (Bookmarks Bar)

2.4. Панель инструментов (Toolbar)

2.5. Рабочая область (Viewport)

3. Основные операции: как пользоваться

3.1. Загрузка файлов

3.2. Встроенный переводчик

3.3. Аппаратное ускорение

3.4. Фоновые сервисы

4. Настройки: под капотом пользователя

4.1. Профиль и синхронизация

4.2. Поисковая система по умолчанию

4.3. Автозаполнение и управление паролями

4.4. Приватность и безопасность

4.5. Внешний вид и кастомизация

5. Расширения: что это и как работают

5.1. Права доступа (permissions)

5.2. Установка (на примере Chrome)

Часть 3. Сравнительный анализ, интеграции и инструменты профессионального использования

1. Сравнение браузеров: объективные метрики

2. Интеграция с корпоративными и государственными системами

2.1. Поддержка ГОСТ-криптографии

2.2. Работа с ЕСИА, ГИС ЖКХ, ЕГАИС и другими ГИС

3. Инструменты разработчика и администрирования

3.1. DevTools: не просто «F12»

3.2. Экспериментальные функции (`chrome://flags`)

3.3. Централизованное управление (для ИТ-администрирования)

4. Тренды и будущее (2025–2027)

4.1. Manifest V3 и судьба расширений

4.2. Упразднение сторонних куки (Privacy Sandbox)

4.3. WebContainers и браузер как ОС