Специализация
Python Backend Developer
Java Backend Developer
Node.js Backend Developer
Golang Backend Developer
React Frontend Developer
Выберите навыки
React
JavaScript
Git
Redux
Webpack
Сложность
1-3
4-6
7-8
9-10
Рейтинг вопросов
1
2
3
4
5
Подпишись на React Developer в телеграм
Какие есть этапы рендеринга html страницы?
Парсинг HTML
Браузер начинает парсить HTML-документ и строить DOM-дерево (Document Object Model), представляющее иерархическую структуру всех элементов страницы.
Если браузер находит <script>, он приостанавливает парсинг, загружает и выполняет скрипт, что может изменить структуру DOM.
Загрузка внешних ресурсов
Во время парсинга HTML браузер обнаруживает ссылки на внешние ресурсы (CSS, изображения, шрифты, скрипты) и начинает их загружать параллельно.
CSS загружается и парсится, формируя CSSOM (CSS Object Model).
Построение рендер-дерева
DOM и CSSOM объединяются для создания рендер-дерева, которое представляет собой структуру элементов, подлежащих отображению на экране с примененными стилями.
Вычисление геометрии (Layout)
Браузер вычисляет размеры и положение каждого элемента на странице, основываясь на рендер-дереве. Этот процесс называется layout или reflow.
Отрисовка (Painting)
Браузер преобразует рендер-дерево в пиксели на экране, рисуя текст, цвета, изображения, тени и другие графические элементы.
Композиция (Compositing)
Некоторые элементы могут быть отрисованы в отдельных слоях для улучшения производительности (например, анимации или фиксированные элементы). На этапе композиции браузер объединяет эти слои в одно изображение для отображения на экране.
Интерфейс пользователя (UI)
Браузер обрабатывает пользовательские события (клики, прокрутка, ввод данных и т.д.).
JavaScript может изменять DOM, что может запустить повторные этапы layout и painting.
Как реализовать поддержку темной темы (dark mode) с помощью HTML и CSS? Какие метатеги и медиавыражения используются?
Темную тему можно реализовать с помощью CSS-медиавыражения prefers-color-scheme, которое определяет предпочтения пользователя относительно цветовой схемы (светлой или темной). В зависимости от предпочтений браузера применяются соответствующие стили. Также можно настроить переключение темы вручную с помощью JavaScript и CSS-классов.
Что такое Git и GitHub?
Git — это система контроля версий, которая позволяет отслеживать изменения в коде, возвращаться к старым версиям и работать над проектом совместно с другими разработчиками. GitHub — это платформа, где можно хранить код в облаке, делиться им и управлять проектами с помощью Git. Вместе они помогают эффективно работать над проектом в команде.
Что такое Docker Engine?
Docker Engine — это клиент-серверная платформа для создания, запуска и управления Docker контейнерами. Он состоит из Docker демона (сервера) и интерфейса командной строки (CLI), которые взаимодействуют для управления жизненным циклом контейнеров.
Что такое контроль версий?
Контроль версий — это система, позволяющая отслеживать изменения кода, управлять разными версиями файлов и работать над проектом нескольким разработчикам одновременно.
Что такое Chaos Engineering?
Что такое Observability?
Какой опыт работы с Next.js?
Как бы вы спроектировали биржевой терминал или аналитическую платформу (напр., для Forex)? Опишите схему от фронтенда до развертывания и баз данных. На что нужно обратить внимание?
Где могут быть полезны Conditional Types?
Рейтинг:
2
Сложность:
4
Chaos Engineering — это практика внесения искусственных сбоев в систему, чтобы проверить её устойчивость. Это позволяет заранее выявить слабые места и предотвратить крупные аварии.
Рейтинг:
2
Сложность:
5
Observability (наблюдаемость) — это способность системы предоставлять метрики, логи и трассировки, чтобы быстро находить и исправлять ошибки.
Рейтинг:
2
Сложность:
7
Next.js — это React-фреймворк для создания полнофункциональных веб-приложений. Он предоставляет встроенные решения для маршрутизации, рендеринга на стороне сервера и оптимизации. Опыт работы включает создание страниц, API-роутов и использование различных стратегий рендеринга.
Рейтинг:
1
Сложность:
10
Для биржевого терминала нужна архитектура с низкой задержкой: фронтенд на React с WebSocket-соединениями, бэкенд на микросервисах с горизонтальным масштабированием, кэширование в Redis для быстрого доступа к данным, временные ряды в ClickHouse для аналитики и PostgreSQL для основных операций. Особое внимание - на географическое распределение серверов близко к биржам, репликацию данных и отказоустойчивость.
Рейтинг:
4
Сложность:
8
Conditional Types (условные типы) в TypeScript позволяют определять типы, которые выбираются на основе условия, проверяющего другие типы. Они чрезвычайно полезны для создания общих (generic) утилит, которые динамически адаптируются к переданным им типам. Классические примеры — это типы Exclude<T, U>, Extract<T, U>, NonNullable<T>, а также для определения типов возвращаемого значения функций или типов свойств в глубоко вложенных структурах.
Рейтинг:
5
Сложность:
10
Рейтинг:
1
Сложность:
4
Рейтинг:
1
Сложность:
2
Рейтинг:
2
Сложность:
5
Рейтинг:
2
Сложность:
2