---
title: Понимание работы глобальной сети
seo:
  title: Понимание работы глобальной сети — QA
  description: Тема «Понимание работы глобальной сети» для собеседования QA. Что такое клиент-серверная архитектура? Что может выступать в роли клиента?
---

[Все темы QA](/qa)

## <strong>Что такое клиент-серверная архитектура?</strong> [#q-14bee738d69b8153a8cccb2ff04363d9]

Клиент-серверная архитектура — это модель сетевого взаимодействия, в которой клиенты и серверы выполняют различные роли. В этой модели&#58;

{/* prettier-ignore */}
1. <strong>Сервер</strong>&#58;

    - Центральный компьютер или программа, которая предоставляет ресурсы, данные или услуги. Серверы обрабатывают запросы от клиентов, выполняют необходимые операции и отправляют результаты обратно клиентам.

1. <strong>Клиент</strong>&#58;

    - Устройство или программа, которая инициирует запрос к серверу для получения данных или выполнения операций. Клиенты могут быть настольными компьютерами, мобильными устройствами или другими программами, которые используют серверные ресурсы.

#### Основные особенности клиент-серверной архитектуры&#58;

- <strong>Распределённость</strong>&#58; Клиенты и серверы могут находиться в
  разных географических локациях и соединяться через Интернет или локальную
  сеть.

- <strong>Масштабируемость</strong>&#58; Систему можно масштабировать, добавляя
  больше серверов или увеличивая мощность сервера.

- <strong>Централизованное управление</strong>&#58; Управление данными,
  пользовательскими ролями и другими ресурсами часто централизовано на сервере.

- <strong>Специализация</strong>&#58; Серверы могут быть специализированы для
  выполнения определённых задач, например, баз данных, файловых серверов или
  почтовых серверов.

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

:::note[Ссылки для изучения]

1. [Клиент-серверная архитектура](https://vladislaveremeev.gitbook.io/qa_bible/seti-i-okolo-nikh/klient-servernaya-arkhitektura-client-server-architecture)
   :::

---

## <strong>Что может выступать в роли клиента?</strong> [#q-14bee738d69b814298e0e5752408f0c5]

В роли клиента в клиент-серверной архитектуре могут выступать различные устройства и программы, которые инициируют запросы к серверу для выполнения операций или получения данных. Вот некоторые из наиболее распространённых примеров клиентов&#58;

{/* prettier-ignore */}
1. <strong>Веб-браузеры</strong>&#58;

    - Браузеры, такие как Google Chrome, Mozilla Firefox, и Safari, запрашивают веб-страницы и другие веб-ресурсы с веб-серверов.

1. <strong>Мобильные приложения</strong>&#58;

    - Приложения на смартфонах и планшетах, которые подключаются к серверам для извлечения данных или выполнения сервисных функций, например, приложения для социальных сетей или банковские приложения.

1. <strong>Прикладное программное обеспечение</strong>&#58;

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

1. <strong>Игровые клиенты</strong>&#58;

    - Программное обеспечение для игр, которое подключается к игровым серверам для многопользовательских игр, обмена игровыми данными и взаимодействия с другими игроками.

1. <strong>Системы автоматизации</strong>&#58;

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

1. <strong>Скрипты и API-клиенты</strong>&#58;

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

Клиенты могут быть реализованы на разных платформах и в разных технологических стеках, но их основная функция — отправлять запросы на сервер и получать от него ответы.

:::note[Ссылки для изучения]

1. [Что может выступать в роли клиента](https://kaze.gitbook.io/qa-theory/web/chto-mozhet-vystupat-v-roli-klienta)
   :::

---

## <strong>Что такое</strong> <code>REST API</code><strong>,</strong> <code>SOAP</code><strong>? В чем разница?</strong> [#q-14bee738d69b813c9665c8eac88adcdf]

<code>REST API</code> и <code>SOAP</code> — это два различных подхода к
организации взаимодействия между клиентами и серверами в сети, каждый из которых
имеет свои особенности и области применения.

#### <code>REST API</code> (Representational State Transfer API)&#58;

- <strong>Архитектурный стиль</strong>&#58; REST не является протоколом, а
  представляет собой архитектурный стиль, который использует стандартные
  HTTP-методы (GET, POST, PUT, DELETE и т.д.).

- <strong>Без сохранения состояния</strong>&#58; REST API обычно не сохраняет
  состояние между запросами. Это означает, что каждый запрос от клиента к
  серверу содержит всю информацию, необходимую для его выполнения.

- <strong>Формат данных</strong>&#58; Может использовать различные форматы для
  передачи данных, включая JSON, XML, HTML, и др., хотя наиболее часто
  используется JSON за его лёгкость и читаемость.

- <strong>Масштабируемость и гибкость</strong>&#58; REST предлагает большую
  гибкость и масштабируемость, что делает его популярным выбором для современных
  веб-сервисов и публичных API.

#### <code>SOAP</code> (Simple Object Access Protocol)&#58;

- <strong>Протокол</strong>&#58; SOAP — это строго специфицированный протокол,
  который обеспечивает обмен структурированными сообщениями через сеть.

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

- <strong>Формат данных</strong>&#58; Использует XML для кодирования всех
  сообщений, что может приводить к большему объёму данных по сравнению с JSON.

- <em>WS- спецификации</em>&#58; Поддерживает расширенный набор стандартов
  (например, WS-Security, WS-ReliableMessaging), что делает его подходящим для
  сложных бизнес-транзакций.

#### Различия&#58;

- <strong>Форматы данных</strong>&#58; REST может использовать различные
  форматы, в то время как SOAP строго использует XML.

- <strong>Гибкость против строгости</strong>&#58; REST предоставляет большую
  гибкость и проще в использовании, в то время как SOAP более строг и
  обеспечивает более широкий набор функций для обработки транзакций и
  безопасности.

- <strong>Простота против комплексности</strong>&#58; REST проще для разработки
  и интеграции, SOAP же может быть более сложным в реализации, но поддерживает
  более сложные взаимодействия и стандарты безопасности.

:::note[Ссылки для изучения]

1. [В чём разница между REST API и SOAP](https://htmlacademy.ru/blog/soft/protocol)
   :::

---

## <strong>Какие протоколы передачи данных знаете?</strong> [#q-14bee738d69b815b8c87ed69bb1df4b2]

Протоколы передачи данных определяют правила и стандарты для обмена данными между устройствами в сетях. Вот некоторые из наиболее известных протоколов передачи данных&#58;

{/* prettier-ignore */}
1. <strong>HTTP (Hypertext Transfer Protocol)</strong>&#58;

    - Основной протокол для передачи гипертекста в Интернете, используется в веб-браузерах для загрузки веб-страниц.

1. <strong>HTTPS (HTTP Secure)</strong>&#58;

    - Расширение HTTP, которое добавляет слой шифрования (SSL/TLS) для безопасной передачи данных.

1. <strong>FTP (File Transfer Protocol)</strong>&#58;

    - FTP передаёт файлы между клиентом и сервером. FTPS защищает FTP с помощью TLS; SFTP является отдельным протоколом передачи файлов поверх SSH.

1. <strong>SMTP (Simple Mail Transfer Protocol)</strong>&#58;

    - Протокол, используемый для отправки электронной почты между серверами.

1. <strong>IMAP (Internet Message Access Protocol)</strong> и <strong>POP3 (Post Office Protocol version 3)</strong>&#58;

    - Протоколы для извлечения почты из почтового ящика. IMAP поддерживает более сложные операции с сообщениями и множественные клиенты.

1. <strong>TCP (Transmission Control Protocol)</strong>&#58;

    - TCP предоставляет упорядоченный поток байтов с обнаружением потерь и повторной передачей. При неисправимом сбое соединение завершается ошибкой; протокол не гарантирует выполнение операции приложением.

1. <strong>UDP (User Datagram Protocol)</strong>&#58;

    - Протокол без установления соединения, предоставляющий быстрые, но не гарантированные услуги передачи данных.

1. <strong>SSH (Secure Shell)</strong>&#58;

    - Протокол для безопасного удаленного управления системами и передачи данных с шифрованием.

1. <strong>DNS (Domain Name System)</strong>&#58;

    - Протокол, который переводит доменные имена в IP-адреса.

1. <strong>IP (Internet Protocol)</strong>&#58;

    - Основной протокол для маршрутизации данных через сети, включая IPv4 и IPv6.

1. <strong>SOAP (Simple Object Access Protocol)</strong>&#58;

    - Протокол, основанный на XML, для обмена структурированными сообщениями в веб-сервисах.

1. <strong>MQTT (Message Queuing Telemetry Transport)</strong>&#58;

    - Протокол обмена сообщениями, ориентированный на минимальный трафик и надёжность, часто используемый в системах IoT.

Эти протоколы служат основой для разнообразных сетевых взаимодействий, включая обмен данными, веб-сервисы, электронную почту, безопасное соединение и многие другие.

:::note[Ссылки для изучения]

1. [Основные протоклы передачи данных](https://htmlacademy.ru/blog/soft/protocol)
   :::

---

## <strong>Охарактеризуйте каждый класс status code (</strong><code>1хх</code><strong>;</strong> <code>2xx</code><strong>;</strong> <code>3xx</code><strong>;</strong> <code>4xx</code><strong>;</strong> <code>5xx</code><strong>).</strong> [#q-14bee738d69b814ab570cc16d3c3bc5b]

Статусные коды HTTP (HTTP status codes) используются для определения состояния ответа сервера на запрос клиента. Вот краткая характеристика каждого класса статусных кодов&#58;

{/* prettier-ignore */}
1. <code>1xx</code><strong>&#58; Informational (Информационные)</strong>&#58;

    - <strong>100 Continue</strong>&#58; Запрос принят, продолжайте отправку данных.

    - <strong>101 Switching Protocols</strong>&#58; Запрос клиента на изменение протоколов принят сервером.

1. <code>2xx</code><strong>&#58; Success (Успех)</strong>&#58;

    - <strong>200 OK</strong>&#58; Запрос успешно обработан, данные переданы в теле ответа.

    - <strong>201 Created</strong>&#58; Запрос успешно выполнен, создан новый ресурс.

    - <strong>202 Accepted</strong>&#58; Запрос принят, но ещё не обработан.

    - <strong>204 No Content</strong>&#58; Запрос успешно обработан, но в ответе нет содержимого.

1. <code>3xx</code><strong>&#58; Redirection (Перенаправление)</strong>&#58;

    - <strong>301 Moved Permanently</strong>&#58; Ресурс перемещён на постоянный новый URL.

    - <strong>302 Found</strong>&#58; Ресурс временно находится по другому URL.

    - <strong>304 Not Modified</strong>&#58; Ресурс не изменился с момента последнего запроса.

1. <code>4xx</code><strong>&#58; Client Error (Ошибки клиента)</strong>&#58;

    - <strong>400 Bad Request</strong>&#58; Некорректный запрос, сервер не может его обработать.

    - <strong>401 Unauthorized</strong>&#58; Требуется аутентификация пользователя.

    - <strong>403 Forbidden</strong>&#58; Доступ к ресурсу запрещён.

    - <strong>404 Not Found</strong>&#58; Ресурс не найден на сервере.

    - <strong>429 Too Many Requests</strong>&#58; Превышено количество запросов за определённый период.

1. <code>5xx</code><strong>&#58; Server Error (Ошибки сервера)</strong>&#58;

    - <strong>500 Internal Server Error</strong>&#58; Внутренняя ошибка сервера, запрос не может быть обработан.

    - <strong>501 Not Implemented</strong>&#58; Сервер не поддерживает функциональность, необходимую для выполнения запроса.

    - <strong>502 Bad Gateway</strong>&#58; Сервер получил некорректный ответ от вышестоящего сервера.

    - <strong>503 Service Unavailable</strong>&#58; Сервер временно недоступен, например, из-за перегрузки или обслуживания.

    - <strong>504 Gateway Timeout</strong>&#58; Сервер не получил своевременный ответ от вышестоящего сервера.

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

:::note[Ссылки для изучения]

1. [Классы статус кода](https://kaze.gitbook.io/qa-theory/web/okharakterizuite-kazhdyi-klass-status-code-1khkh-2xx-3xx-4xx-5xx-.)
   :::

---

## <strong>Какие есть HTTP-методы?</strong> [#q-14bee738d69b81918c7fc051a3109189]

HTTP-методы (также известные как HTTP-глаголы) определяют действия, которые могут быть выполнены над ресурсами в веб-приложениях. Вот основные HTTP-методы&#58;

{/* prettier-ignore */}
1. <code>GET</code>&#58;

    - Используется для запроса данных с сервера. Не изменяет состояние ресурса.

    - Пример&#58; получение веб-страницы или данных в формате JSON.

1. <code>POST</code>&#58;

    - Используется для отправки данных на сервер, обычно для создания новых ресурсов.

    - Пример&#58; отправка формы на сервер.

1. <code>PUT</code>&#58;

    - Используется для обновления или создания ресурса. Если ресурс не существует, он будет создан.

    - Пример&#58; обновление информации о пользователе.

1. <code>DELETE</code>&#58;

    - Используется для удаления ресурса с сервера.

    - Пример&#58; удаление пользователя из базы данных.

1. <code>PATCH</code>&#58;

    - Используется для частичного обновления ресурса.

    - Пример&#58; обновление одного поля в записи пользователя.

1. <code>HEAD</code>&#58;

    - Аналогичен методу GET, но сервер возвращает только заголовки, без тела ответа.

    - Пример&#58; проверка существования ресурса.

1. <code>OPTIONS</code>&#58;

    - Используется для получения поддерживаемых сервером методов для конкретного ресурса.

    - Пример&#58; проверка доступных методов для ресурса перед отправкой основного запроса.

1. <code>CONNECT</code>&#58;

    - Используется для установления туннеля к серверу, часто применяется для проксирования через HTTP.

    - Пример&#58; установка SSL-туннеля через прокси.

1. <code>TRACE</code>&#58;

    - Используется для диагностики. Сервер возвращает запрос клиента как тело ответа.

    - Пример&#58; трассировка маршрута запроса.

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

:::note[Ссылки для изучения]

1. [Основные HTTP методы](https://kaze.gitbook.io/qa-theory/web/kakie-est-http-metody)
   :::

---

## <strong>Какие знаете</strong> <code>Web elements</code><strong>?</strong> [#q-14bee738d69b81e3b34efa11cb66f066]

Веб-элементы (<code>Web elements</code>) — это составляющие HTML-документа, которые создают структуру и содержимое веб-страницы. Вот основные типы веб-элементов&#58;

{/* prettier-ignore */}
1. <strong>Текстовые элементы</strong>&#58;

    - <strong>\\\<p\\\></strong>&#58; Параграф текста.

    - <strong>\\\<h1\\\> - \\\<h6\\\></strong>&#58; Заголовки различного уровня.

1. <strong>Формы и ввод данных</strong>&#58;

    - <strong>\\\<input\\\></strong>&#58; Поля ввода (текст, пароль, радио-кнопки, чекбоксы и т.д.).

    - <strong>\\\<textarea\\\></strong>&#58; Многострочное текстовое поле.

    - <strong>\\\<select\\\></strong>&#58; Выпадающий список.

    - <strong>\\\<option\\\></strong>&#58; Опция внутри выпадающего списка.

    - <strong>\\\<button\\\></strong>&#58; Кнопка.

    - <strong>\\\<label\\\></strong>&#58; Метка для элемента формы.

1. <strong>Ссылки и навигация</strong>&#58;

    - <strong>\\\<a\\\></strong>&#58; Гиперссылка.

1. <strong>Изображения и мультимедиа</strong>&#58;

    - <strong>\\\<img\\\></strong>&#58; Изображение.

    - <strong>\\\<video\\\></strong>&#58; Видео.

    - <strong>\\\<audio\\\></strong>&#58; Аудио.

    - <strong>\\\<source\\\></strong>&#58; Источник мультимедийного контента.

1. <strong>Списки</strong>&#58;

    - ul&#58; маркированный, неупорядоченный список.

    - ol&#58; нумерованный, упорядоченный список.

    - <strong>\\\<li\\\></strong>&#58; Элемент списка.

1. <strong>Таблицы</strong>&#58;

    - <strong>\\\<table\\\></strong>&#58; Таблица.

    - <strong>\\\<tr\\\></strong>&#58; Строка таблицы.

    - <strong>\\\<td\\\></strong>&#58; Ячейка таблицы.

    - <strong>\\\<th\\\></strong>&#58; Заголовочная ячейка таблицы.

    - <strong>\\\<thead\\\></strong>, <strong>\\\<tbody\\\></strong>, <strong>\\\<tfoot\\\></strong>&#58; Секции таблицы.

1. <strong>Контейнеры и структурные элементы</strong>&#58;

    - <strong>\\\<div\\\></strong>&#58; Блочный контейнер.

    - <strong>\\\<span\\\></strong>&#58; Встроенный контейнер.

    - <strong>\\\<header\\\></strong>&#58; Заголовок страницы или секции.

    - <strong>\\\<footer\\\></strong>&#58; Подвал страницы или секции.

    - <strong>\\\<section\\\></strong>&#58; Раздел документа.

    - <strong>\\\<article\\\></strong>&#58; Независимый, самостоятельный контент.

    - <strong>\\\<nav\\\></strong>&#58; Навигационное меню.

1. <strong>Скрипты и метаданные</strong>&#58;

    - <strong>\\\<script\\\></strong>&#58; Встраивание или подключение скриптов.

    - <strong>\\\<link\\\></strong>&#58; Подключение внешних ресурсов, таких как стили.

    - <strong>\\\<meta\\\></strong>&#58; Метаданные документа.

Эти элементы составляют основу веб-страниц и определяют их структуру, содержимое и взаимодействие с пользователем.

:::note[Ссылки для изучения]

1. [Web elements](https://developer.mozilla.org/ru/docs/Web/API/Web_components)
   :::

---

## <strong>Какие браузеры знаете? В чем их отличие?</strong> [#q-14bee738d69b8180a307e9181e6ffbbb]

Существует множество браузеров, каждый из которых имеет свои особенности и преимущества. Вот некоторые из наиболее известных браузеров и их отличия&#58;

{/* prettier-ignore */}
1. <code>Google Chrome</code>&#58;

    - <strong>Разработчик</strong>&#58; Google

    - <strong>Движок</strong>&#58; Blink (основан на WebKit)

    - <strong>Особенности</strong>&#58; Высокая производительность, широкая поддержка веб-стандартов, частые обновления, большая библиотека расширений, интеграция с сервисами Google.

1. <code>Mozilla Firefox</code>&#58;

    - <strong>Разработчик</strong>&#58; Mozilla Foundation

    - <strong>Движок</strong>&#58; Gecko

    - <strong>Особенности</strong>&#58; Открытый исходный код, высокая производительность, фокус на конфиденциальности и безопасности, поддержка расширений, регулярные обновления.

1. <code>Safari</code>&#58;

    - <strong>Разработчик</strong>&#58; Apple

    - <strong>Движок</strong>&#58; WebKit

    - <strong>Особенности</strong>&#58; Оптимизирован для macOS и iOS, высокая производительность на устройствах Apple, энергоэффективность, поддержка последних веб-стандартов.

1. <code>Microsoft Edge</code>&#58;

    - <strong>Разработчик</strong>&#58; Microsoft

    - <strong>Движок</strong>&#58; Blink (основан на Chromium)

    - <strong>Особенности</strong>&#58; Интеграция с Windows, высокая производительность, поддержка расширений Chrome, функции для повышения безопасности и конфиденциальности.

1. <code>Opera</code>&#58;

    - <strong>Разработчик</strong>&#58; Opera Software

    - <strong>Движок</strong>&#58; Blink

    - <strong>Особенности</strong>&#58; Встроенные VPN и блокировщик рекламы, экономия заряда батареи, широкий набор встроенных функций, поддержка расширений Chrome.

1. <code>Brave</code>&#58;

    - <strong>Разработчик</strong>&#58; Brave Software

    - <strong>Движок</strong>&#58; Blink

    - <strong>Особенности</strong>&#58; Фокус на конфиденциальности, встроенный блокировщик рекламы и трекеров, быстрая скорость работы, вознаграждения за просмотр рекламы в криптовалюте.

1. <code>Internet Explorer</code>&#58;

    - <strong>Разработчик</strong>&#58; Microsoft

    - <strong>Движок</strong>&#58; Trident

    - <strong>Особенности</strong>&#58; Устаревший браузер, заменен Microsoft Edge, используется для совместимости со старыми веб-приложениями.

1. <code>Vivaldi</code>&#58;

    - <strong>Разработчик</strong>&#58; Vivaldi Technologies

    - <strong>Движок</strong>&#58; Blink

    - <strong>Особенности</strong>&#58; Высокая настраиваемость интерфейса и функций, ориентация на опытных пользователей, поддержка расширений Chrome.

1. <code>Tor Browser</code>&#58;

    - <strong>Разработчик</strong>&#58; The Tor Project

    - <strong>Движок</strong>&#58; Gecko (основан на Firefox)

    - <strong>Особенности</strong>&#58; Обеспечение анонимности в интернете, маршрутизация трафика через сеть Tor, защита от отслеживания и слежки.

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

:::note[Ссылки для изучения]

1. [Что такое браузер](https://skyeng.ru/magazine/wiki/it-industriya/chto-takoe-brauzer/)
   :::

---

## <strong>Для чего необходимы инструменты разработчика в браузере (</strong><code>Chrome DevTools</code><strong>) и как они помогают в тестировании.</strong> [#q-14bee738d69b819ca953e3deb10ce80d]

Инструменты разработчика в браузере, такие как <code>Chrome DevTools</code>, являются мощным набором инструментов, встроенных в браузеры для помощи разработчикам и тестировщикам. Они необходимы для выполнения различных задач, связанных с разработкой, отладкой и тестированием веб-приложений. Вот основные способы их использования и преимущества в тестировании&#58;

{/* prettier-ignore */}
1. <strong>Просмотр и редактирование HTML и CSS</strong>&#58;

    - Позволяют просматривать и изменять структуру HTML и стили CSS в реальном времени, что помогает тестировать и устранять проблемы с версткой и стилями.

1. <strong>Консоль JavaScript</strong>&#58;

    - Используется для выполнения и отладки JavaScript-кода на странице, что помогает тестировать и исправлять ошибки скриптов.

1. <strong>Сетевой монитор (</strong><code>Network Monitor</code><strong>)</strong>&#58;

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

1. <strong>Инспектор элементов (</strong><code>Elements panel</code><strong>)</strong>&#58;

    - Позволяет детально исследовать и взаимодействовать с DOM-деревом страницы, что помогает в отладке и тестировании динамически изменяющегося контента.

1. <strong>Производительность (</strong><code>Performance panel</code><strong>)</strong>&#58;

    - Анализирует производительность страницы, измеряя время загрузки, использование памяти и процессора. Это помогает выявлять узкие места и оптимизировать производительность веб-приложения.

1. <strong>Безопасность (</strong><code>Security panel</code><strong>)</strong>&#58;

    - Предоставляет информацию о безопасности соединения, сертификатах SSL/TLS и потенциальных уязвимостях. Полезно для тестирования безопасности веб-приложения.

1. <strong>Хранилище (</strong><code>Application panel</code><strong>)</strong>&#58;

    - Показывает данные, хранящиеся в Local Storage, Session Storage, IndexedDB и Cookies. Это помогает тестировать и управлять данными, хранящимися на стороне клиента.

1. <strong>Аудиты (</strong><code>Lighthouse</code><strong>)</strong>&#58;

    - Инструмент для проведения аудитов веб-приложения на соответствие лучшим практикам, производительности, доступности и SEO. Полезно для получения рекомендаций по улучшению качества веб-приложения.

1. <strong>Отладка кода (</strong><code>Debugger</code><strong>)</strong>&#58;

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

Использование Chrome DevTools значительно упрощает процесс разработки и тестирования веб-приложений, позволяя быстро находить и устранять проблемы, улучшать производительность и безопасность, а также проверять корректность работы интерфейсов.

:::note[Ссылки для изучения]

1. [DevTools для тестировщиков](https://ru.hexlet.io/blog/posts/devtools-dlya-testirovschikov)
   :::