Как пройти собеседование на Frontend в Яндекс: от скрининга до оффера

Введение: что ждет кандидата на пути к офферу

Процесс найма в Яндекс во многом стандартизирован, но при этом сохраняет гибкость в зависимости от конкретного департамента: Поиск, Рекламные технологии, Маркет или Лавка. Основная сложность заключается не только в знании React или Vue, но и в умении решать задачи без использования библиотек, понимании Computer Science и специфики работы движка V8. Статистика показывает, что на этапе технического скрининга отсеивается до 70% кандидатов, поэтому подготовка должна быть системной.

Для кого эта статья

Этот материал предназначен для разработчиков уровня Middle и Senior, которые планируют подаваться в Яндекс. Мы разберем не только сухую теорию, но и логику интервьюеров: почему они задают именно эти вопросы и какого поведения ожидают от кандидата. Основной упор сделан на практические примеры, которые встречались на реальных интервью в последние 12 месяцев.

Что вы узнаете

Мы пройдем по всем этапам: от предварительного созвона с рекрутером до финала и обсуждения зарплатных ожиданий. Вы увидите примеры задач на алгоритмы, которые специфичны именно для фронтенда, разберете тонкости секции JavaScript и поймете, как защитить свой архитектурный проект на секции System Design. Статья содержит конкретные фрагменты кода, таблицы сравнения технологий и чек-листы для самопроверки перед каждой встречей.

1. Технический скрининг: первый фильтр

Технический скрининг в Яндексе — это часовая сессия в Яндекс.Контесте или аналогичном редакторе кода. Здесь проверяется умение писать рабочий код на «голом» JavaScript. Обычно предлагают 2–3 задачи средней сложности. Важно понимать, что интервьюер оценивает не только результат, но и скорость мышления, а также чистоту именования переменных. Ошибки в синтаксисе допустимы, но логические провалы — нет.

Типовые задачи на скрининге

Чаще всего встречаются задачи на манипуляцию массивами, строками или простыми структурами данных. Популярная тема — реализация функций-хелперов, таких как throttle, debounce или парсинг URL-строк. Также могут попросить написать функцию для глубокого сравнения объектов (Deep Equal), что проверяет знание рекурсии и типов данных в JS.

/**
 * Пример задачи: Реализация функции throttle
 * Ограничивает количество вызовов функции в единицу времени
 */
function throttle(fn, delay) {
  let lastCall = 0;
  return function(...args) {
    const now = Date.now();
    if (now - lastCall >= delay) {
      lastCall = now;
      return fn.apply(this, args);
    }
  };
}

// На собеседовании могут попросить добавить поддержку 
// последнего вызова (trailing edge)

На что смотрят интервьюеры

Во-первых, на краевые случаи (edge cases). Если вы пишете функцию сложения, спросят: «А что будет, если передать undefined?». Во-вторых, на асимптотическую сложность алгоритма (Big O). Даже если задача простая, ожидается, что вы предложите решение за O(n), а не за O(n²), если это возможно. В-третьих, на стиль общения: нужно проговаривать свои мысли вслух, чтобы интервьюер мог направить вас, если вы уйдете не в ту сторону.

2. Секция «Алгоритмы и структуры данных»

Многие фронтенд-разработчики считают этот этап избыточным, но для Яндекса это база. Здесь проверяется фундаментальная подготовка. Вам не предложат разворачивать B-деревья, но задачи на хэш-таблицы, два указателя, скользящее окно и обход графов — стандарт индустрии. В Яндексе любят задачи, которые можно привязать к реальности: например, расчет интервалов свободного времени в календаре или поиск кратчайшего пути в сетке элементов.

Популярные темы алгоритмов

1. Массивы и строки (метод двух указателей). 2. Хэш-таблицы (поиск дубликатов, группировка). 3. Стек и очередь (задачи на валидацию скобок). 4. Деревья (обход в глубину и ширину, поиск в DOM-дереве). 5. Динамическое программирование (редко, обычно на позиции Senior).

Пример задачи на «Скользящее окно»

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

3. Секция «JavaScript и браузерное окружение»

Если алгоритмы — это проверка интеллекта, то секция JS — это проверка профессионализма. Здесь не спрашивают «какие бывают типы данных», здесь просят объяснить, как работает Event Loop в деталях: в какой очередности выполняются микрозадачи и макрозадачи, когда происходит рендеринг страницы. Часто дают куски кода с setTimeout, Promise и async/await и просят предсказать вывод в консоль.

Глубокое понимание прототипов и замыканий

Вас могут попросить реализовать аналог Promise.all или Promise.race. Это стандартная проверка на понимание асинхронности. Также популярны вопросы про контекст вызова (this), потерю контекста и способы его привязки (bind, call, apply). Ожидается знание отличий стрелочных функций от обычных не на уровне «там короче синтаксис», а на уровне работы с объектом arguments и лексическим окружением.

// Задача на понимание Event Loop
console.log('1');
setTimeout(() => console.log('2'), 0);
Promise.resolve().then(() => console.log('3'));
console.log('4');

// Правильный ответ: 1, 4, 3, 2
// Пояснение: Промисы — микрозадачи, выполняются сразу после текущего стека,
// но перед макрозадачами (setTimeout).

Браузерное API и DOM

Фронтенд-разработчик в Яндексе должен знать, как оптимизировать работу с DOM. Вопросы про Reflow и Repaint обязательны. Вас спросят, почему частое обращение к getBoundingClientRect в цикле — это плохо, и как этого избежать с помощью requestAnimationFrame. Также могут затронуть тему безопасности: XSS, CSRF и способы защиты на стороне клиента.

4. Верстка и UI-компоненты

В Яндексе верстка — это не просто «накидать CSS». Это работа с доступностью (A11y), производительностью и переиспользуемостью. На этой секции могут попросить сверстать сложный компонент на чистом CSS/HTML, например, адаптивную сетку товаров или кастомный Dropdown, который корректно управляется с клавиатуры.

Методологии и подходы

Яндекс — родина БЭМ (Блок-Элемент-Модификатор). Даже если в конкретной команде используют CSS Modules или Styled Components, понимание принципов БЭМ (независимость блоков) крайне желательно. Также важно знать современные возможности CSS: CSS Variables, Grid Layout, Flexbox, спецификацию селекторов. Могут спросить про критический CSS и способы ускорения отрисовки первого экрана (LCP).

Доступность (Accessibility)

Особое внимание уделяется тому, как ваш интерфейс будет «читаться» скринридерами. Знание атрибутов aria-*, правильное использование семантических тегов (main, section, article) и управление фокусом — это то, что отличает Senior-разработчика. Пример вопроса: «Как сделать модальное окно, которое не выпускает фокус за свои пределы (focus trap)?».

5. Архитектура и System Design (Front-end)

Для позиций Middle+ и Senior проводится секция системного дизайна. Здесь не просят писать код, здесь нужно рисовать схемы и обосновывать выбор технологий. Типовое задание: «Спроектируйте сервис типа Яндекс.Почты или бесконечную ленту новостей». Вам нужно продумать структуру данных, схему API (REST vs GraphQL), стратегию кэширования и стейт-менеджмент.

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

1. **Стейт-менеджмент:** когда достаточно локального состояния, а когда нужен Redux/Effector/Zustand. 2. **Производительность:** ленивая загрузка (lazy loading), разделение кода (code splitting), оптимизация изображений. 3. **Надежность:** обработка ошибок, офлайн-режим (Service Workers), логирование и мониторинг ошибок (Sentry). 4. **Инфраструктура:** CI/CD, тесты (Unit, Integration, E2E), линтинг.

Масштабируемость и микрофронтенды

Если проект большой, возникнет вопрос: как организовать совместную работу 50 разработчиков над одним приложением? Здесь стоит упомянуть микрофронтенды (Module Federation или iframe-подходы), монорепозитории (Nx, Turborepo) и общие библиотеки компонентов. Важно показать, что вы думаете не только о фиче, но и о процессах разработки в долгосрочной перспективе.

6. Тестирование и качество кода

В Яндексе культура тестирования развита очень сильно. На собеседовании обязательно спросят про пирамиду тестирования. Вы должны понимать разницу между юнит-тестами на чистые функции и интеграционными тестами на компоненты. Популярные инструменты: Jest, React Testing Library, Playwright.

Подходы к написанию тестов

Интервьюер может дать компонент и попросить написать для него тестовые сценарии. Хороший ответ включает проверку не только «счастливого пути» (happy path), но и обработку ошибок сервера, пустых состояний и действий пользователя. Обсуждение TDD (Test Driven Development) также может стать частью беседы: используете ли вы его в реальности и каковы его плюсы и минусы.

7. Поведенческое интервью (Soft Skills)

Яндекс ищет людей, которые соответствуют их культурному коду. Основные принципы: открытость, ответственность, умение аргументированно спорить и признавать ошибки. На этой секции используют метод STAR (Situation, Task, Action, Result). Вас попросят рассказать о самом сложном техническом решении или о конфликте в команде.

Примеры вопросов на Soft Skills

— Расскажите о случае, когда вы не успевали в дедлайн. Что вы предприняли?
— Как вы реагируете на критику вашего кода на Code Review?
— Расскажите о техническом решении, которым вы гордитесь, и о том, от которого отказались.
— Как вы помогаете расти младшим коллегам?

8. Командные встречи (Финалы)

После прохождения всех технических этапов начинаются «финалы» с конкретными командами. Обычно это 2–4 встречи по 30–40 минут. Здесь уже не проверяют ваше умение переворачивать строку. Команда рассказывает о своих задачах, а вы — о своих интересах. Это этап взаимного «мэтча».

О чем спрашивать на финалах

Это ваш шанс понять, во что вы ввязываетесь. Спрашивайте про техстек (не везде он современный), про количество легаси-кода, про частоту релизов и дежурства (on-call). Узнайте, как принимаются решения в команде: авторитарно лидом или коллективно. Это поможет вам выбрать наиболее подходящее место, если офферов будет несколько (в Яндексе можно получить несколько предложений от разных команд).

9. Подготовка: ресурсы и план

Подготовка может занять от пары недель до нескольких месяцев. Рекомендуемый стек ресурсов: LeetCode (разделы Array, String, Hash Table), Learn JavaScript (внимательно прочитать разделы про браузер и асинхронность), документация React (особенно про хуки и рендеринг). Для тренировки алгоритмов на JS отлично подходит платформа BigFrontEnd.dev.

План подготовки на 4 недели

Неделя 1: Алгоритмы (Easy/Medium) и структуры данных. Неделя 2: Глубокий JavaScript (Event Loop, Promises, Prototypes). Неделя 3: Верстка, адаптивность, доступность и браузерные API. Неделя 4: Архитектура (System Design) и тренировочные интервью (Mock interviews).

10. Оффер и переговоры

Когда все этапы пройдены и команда выбрана, рекрутер возвращается с цифрами. Зарплата в Яндексе состоит из оклада, годовой премии и (для высоких грейдов) акций (RSU). Важно понимать свою рыночную стоимость и иметь на руках альтернативные офферы для аргументации при торге.

Грейдирование и вилки

Яндекс использует систему грейдов (обычно с 13 по 20+). Middle — это примерно 15–16 грейд, Senior — 17–18. От грейда зависит не только зарплата, но и размер пакета акций. Не бойтесь обсуждать релокационный пакет, если вы переезжаете: Яндекс обычно берет на себя расходы по билетам и первый месяц проживания.

Заключение: чек-лист перед собеседованием

Собеседование в Яндекс — это марафон, а не спринт. Даже если вы получите отказ, это бесценный опыт, который подсветит ваши слабые зоны. Многие нынешние сотрудники Яндекса прошли туда со второго или третьего раза.

Итоговый план действий:

• Решите минимум 50 задач на LeetCode/Контесте.
• Разберитесь, как работает V8 под капотом.
• Повторите спецификацию CSS и основы доступности.
• Подготовьте 3–4 истории по методу STAR.
• Выспитесь перед техническими секциями — мозг должен работать быстро.

Удачи на интервью! Помните, что интервьюер — это ваш будущий коллега, который заинтересован в том, чтобы вы справились с задачами.