ENIGMA AI
ENIGMA AI

Использовали ли вы в проекте библиотеку Vue.js?

встречается 1× Vue.js junior frontend

Как ответить

Да, я использовал Vue.js в своём последнем проекте — это был внутренний дашборд для отдела логистики. Взял Vue 3 Composition API, потому что проект новый и не было legacy, а Typescript добавил для типизации.

Из конкретных фич: настраивал Vue Router с ленивой загрузкой для трёх разделов (заказы, поставщики, аналитика). Один роут был динамический: /orders/:id. Стейт-менеджмент — Pinia. Использовал стор для общих данных по заказам и для фильтров, которые тянулись через URL-параметры. Для работы с API — axios с интерсепторами для обработки 401 ошибок и рефреша токена.

Из проблем, с которыми столкнулся:

  • Реактивность: приходилось внимательно следить за глубокой реактивностью. Наткнулся на известный кейс с reactive() и массивами — если пересоздавать объект целиком, а не через push, реактивность ломалась. Потом перешёл на ref для примитивов и вложенных массивов.
  • Teleport: когда делал модалку для подтверждения действий, использовал Teleport к <body>. Это было удобно для z-index, но словил неочевидный баг с анимациями — пришлось добавить transition на сам контент внутри телепорта.
  • Слоты: сделал компонент таблицы, где через слоты прокидывал кастомные ячейки для статусов. Сначала намудрил со scoped slots, но потом упростил до обычных именованных слотов с параметрами.

Что касается тестов — писал unit-тесты с Vitest для сторов Pinia и утилит. Для компонентов использовал Vue Test Utils, тестировал только бизнес-логику: рендер по условию и вызов эмитов. Снэпшот-тесты не использовал — они больше ломались, чем помогали.

Производительность: в дашборде была таблица на 500+ строк с пагинацией из 50 строк. Но на одном экране нужно было отображать агрегированные данные сразу по всей таблице — пришлось считать сумму и среднее на бэкенде, а не на фронте, чтобы не тормозить. Использовал v-memo для статичных данных в списке, хотя разница была, скорее, в микрооптимизации.

В целом Vue 3 с Composition API показался логичнее Options API для средних проектов — нет путаницы с methods и computed, код группируется по фичам, а не по типам.

Ключевые тезисы

  • Конкретный проект — внутренний дашборд для логистики, Vue 3 Composition API + Typescript
  • Использовал Pinia для стейт-менеджмента, Vue Router с ленивой загрузкой
  • Проблемы с глубокой реактивностью (reactive vs ref) и Teleport с анимациями
  • Писал тесты с Vitest и Vue Test Utils — только unit-тесты, без snapshot
  • Производительность — пагинация с подсчётом агрегатов на бэкенде, v-memo для статики

Что спросят дальше

  • — Как бы ты реализовал SSR на Vue 3? С чем сталкивался?
  • — В чём разница между v-if и v-show в плане производительности при больших списках?
  • — Расскажи подробнее про проблему с реактивностью массивов — как именно её решал?

Готовьтесь к собеседованию с ENIGMA AI

AI-суфлёр подсказывает ответы прямо на собеседовании в реальном времени — незаметно для интервьюера.

Скачать приложение