Вопросы React Frontend Developer

Способы оптимизации загрузки изображений в HTML:

1. Сжатие изображений

2. Адаптивные размеры

3. Ленивая загрузка

Форматы изображений:

• WebP: высокое сжатие и качество, поддерживает как растровые, так и анимированные изображения.

• AVIF: еще более эффективное сжатие и лучшее качество по сравнению с WebP.

Webmanifest — это файл в формате JSON, который используется для определения метаданных веб-приложения. Он позволяет настроить иконки приложения, название, тему и поведение при добавлении на главный экран устройства. В PWA webmanifest помогает сделать веб-приложение похожим на нативное мобильное приложение, улучшая пользовательский опыт.

Web Workers — это скрипты, которые выполняются в фоновом режиме, отделенные от основного потока выполнения. Это позволяет выполнять тяжелые вычисления без блокировки пользовательского интерфейса, что улучшает отзывчивость приложений. Однако Web Workers имеют ограничения, такие как отсутствие доступа к DOM и использование только безопасного контекста.

Синхронизация между главным потоком и Web Workers осуществляется через механизм сообщений, используя методы postMessage и обработчики onmessage. Главный поток отправляет сообщения в worker, а worker может отвечать тем же способом. Однако синхронизация не является мгновенной, поэтому важно учитывать, что сообщения передаются асинхронно.

WebSockets — это протокол, который обеспечивает двунаправленную связь между клиентом и сервером по одному и тому же TCP-соединению. Он позволяет отправлять данные в режиме реального времени, что делает его идеальным для приложений, требующих постоянного обмена данными, таких как чаты или онлайн-игры. Для использования WebSockets необходимо создать WebSocket-клиент на стороне клиента и сервер, который будет обрабатывать подключения и сообщения.

WebRTC — это технология, позволяющая браузерам и мобильным приложениям обмениваться аудио, видео и данными в реальном времени без необходимости использования сторонних плагинов. Она использует три основных компонента: getUserMedia для доступа к медиа-устройствам, RTCPeerConnection для установления соединения и RTCDataChannel для передачи данных.

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

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

Webpack — это инструмент для сборки модулей JavaScript и других ресурсов, таких как CSS или изображения. Он позволяет объединять файлы в один или несколько выходных пакетов, оптимизировать их для использования в браузере и управлять зависимостями.

Точки входа — это файлы, с которых Webpack начинает строить граф зависимостей. Они задаются в настройках через свойство entry. Можно указать одну точку входа для небольших приложений или несколько — для более сложных.

Выходное свойство Webpack (output) указывает, куда и в каком формате сохраняются файлы после сборки. Оно задает путь к папке и имя итогового файла.