React Frontend Developer

Question 1

Как работают hidden classes и shape-based оптимизации в V8?

Accepted Answer

Hidden classes (скрытые классы) в V8 — это внутренние структуры, которые движок создает для представления форм объектов и их свойств. Когда вы создаете объекты с одинаковыми свойствами, V8 присваивает им один и тот же скрытый класс, что ускоряет доступ к их свойствам. Shape-based оптимизации позволяют движку быстро определять, где находятся свойства в памяти, что значительно уменьшает время доступа к ним.

Question 2

Как работает git rebase?

Accepted Answer

git rebase перемещает одну ветку поверх другой, копируя коммиты и переписывая их базу. Он берёт набор коммитов, начиная с точки ветвления, и последовательно применяет их к новой базе, создавая новые коммиты с теми же изменениями, но другим родителем. Это позволяет получить линейную историю без merge-коммитов.

Question 3

В чём разница между git rebase и git merge?

Accepted Answer

git merge сохраняет историю параллельных веток, создавая merge-коммит при расхождении, а git rebase переписывает историю: переносит коммиты одной ветки поверх другой, создавая линейную историю без merge-коммитов. Merge показывает фактические ветвления, rebase упрощает лог, но меняет SHA коммитов.

Question 4

Что такое base URL (base tag) и для чего он используется?

Accepted Answer

задает базовый URL для всех относительных ссылок на странице.Он указывается внутри .После его задания браузер использует его как основу для путей.Это упрощает работу с ссылками и ресурсами.

Question 5

Как определить текущий base path приложения на стороне клиента?

Accepted Answer

Base path — это часть URL между доменом и началом пути к конкретному ресурсу приложения. Его можно определить из объекта `window.location`. Например, если приложение развёрнуто по адресу `https://example.com/my-app/`, то base path — это `/my-app/`. Для SPA, использующих HTML5 History API, base path часто задаётся в конфигурации роутера (например, в React Router — проп `basename`). Также его можно вычислить, сравнив `window.location.pathname` с известной структурой путей приложения.

Question 6

Как реализовать поддержку динамического base path в React-приложении?

Accepted Answer

Динамический base path позволяет React-приложению работать корректно, когда оно развернуто не в корне домена, а в поддиректории (например, /app/). Для этого нужно настроить роутер и сборщик. В React Router используйте пропс `basename` в компоненте ``. Значение basename можно получать из переменных окружения или конфигурационного файла. Также необходимо настроить Webpack или другой сборщик, указав `publicPath`, чтобы статические ресурсы (JS, CSS) загружались из правильного пути.

Question 7

Что такое base URL в React Router и зачем он нужен?

Accepted Answer

Base URL (базовый путь) в React Router — это префикс, который автоматически добавляется ко всем относительным маршрутам в приложении. Он нужен, когда ваше React-приложение развёрнуто не в корне домена (например, на `example.com/my-app/`), а в поддиректории. Без указания правильного base URL маршрутизация может сломаться, так как React Router будет искать пути относительно корня сервера, а не вашей поддиректории. Вы задаёте его с помощью пропа `basename` в компоненте ``. Это обеспечивает корректную работу ссылок и навигации в продакшн-среде.

Question 8

На каком этапе инициализации приложения нужно задавать base URL?

Accepted Answer

Base URL для HTTP-клиента (например, Axios или Fetch) следует задавать на этапе инициализации приложения, до создания основных сервисов или модулей, которые будут выполнять запросы. Это обычно делается в точке входа (например, index.js или main.js) или в специальном конфигурационном файле. Такой подход позволяет централизованно управлять адресом API и легко переключаться между разными окружениями (разработка, тестирование, продакшн). Это улучшает поддерживаемость и предотвращает дублирование кода.

Question 9

Как переписать callback-based код на ES6 (Promises/async-await)?

Accepted Answer

Код на колбэках можно переписать на ES6, используя промисы и async/await. Сначала оберни асинхронную функцию, принимающую колбэк, в промис. Затем используй цепочки .then() и .catch() для обработки успеха и ошибок. Для максимальной читаемости примени async/await, который позволяет писать асинхронный код почти как синхронный. Это устраняет "ад колбэков" и упрощает отладку.

Question 10

Как работает cookie-based авторизация?

Accepted Answer

Cookie-based авторизация — это метод, при котором сервер создает сессию для пользователя после успешного входа и отправляет идентификатор сессии в виде cookie в браузер. Браузер автоматически отправляет этот cookie с каждым последующим запросом, позволяя серверу идентифицировать пользователя. Cookie обычно имеют флаги HttpOnly, Secure и SameSite для защиты от XSS и CSRF атак. Сессионные данные хранятся на сервере, а не в cookie, что делает этот метод безопасным при правильной настройке.

Вопросы React Frontend Developer