Выберите текущую позицию

Укажите роль и уровень — система покажет путь развития, навыки и gap-анализ.

Путь развития

Junior

0-2 года

Текущий

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

Ключевые навыки:

Core Web Vitals Нужно
CSS-in-JS Нужно
Data Fetching Нужно
Progressive Web Apps Нужно
SSR/SSG/ISR паттерны Нужно
State Management Нужно
Svelte / SvelteKit Нужно
Tailwind CSS Нужно
Vite и современные бандлеры Нужно
Web APIs Нужно
Web Components Нужно
Алгоритмы и сложность Нужно
Асинхронное программирование Нужно
Визуальное регрессионное тестирование Нужно
Доступность (Accessibility) Нужно
Качество кода и рефакторинг Нужно
Компонентное тестирование Нужно
Оптимизация бандла Нужно
Паттерны проектирования Нужно
Разработка дизайн-систем Нужно
Современный CSS Нужно
Структуры данных Нужно
Типобезопасность и системы типов Нужно

Middle

2-5 лет

Следующий

Ответственность: Самостоятельная разработка фич от декомпозиции до деплоя. Участие в code review. Оптимизация производительности. Менторинг junior-разработчиков. Участие в архитектурных обсуждениях.

Ключевые навыки:

Core Web Vitals Нужно
CSS-in-JS Нужно
Data Fetching Нужно
Progressive Web Apps Нужно
SSR/SSG/ISR паттерны Нужно
State Management Нужно
Svelte / SvelteKit Нужно
Tailwind CSS Нужно
Vite и современные бандлеры Нужно
Web APIs Нужно
Web Components Нужно
Алгоритмы и сложность Нужно
Асинхронное программирование Нужно
Визуальное регрессионное тестирование Нужно
Доступность (Accessibility) Нужно
Качество кода и рефакторинг Нужно
Компонентное тестирование Нужно
Микрофронтенды Нужно
Оптимизация бандла Нужно
Паттерны проектирования Нужно
Разработка дизайн-систем Нужно
Современный CSS Нужно
Структуры данных Нужно
Типобезопасность и системы типов Нужно
Переход: ~2-3 года
  • Самостоятельно реализовал 3+ проекта
  • Провёл успешные код-ревью
  • Участвовал в разрешении production инцидентов

Senior

5-8 лет

Ответственность: Проектирование архитектуры компонентов и сервисов. Решение сложных технических проблем. Ведение технического долга. Code review как gatekeeper качества. Менторинг middle-разработчиков. Выбор технологий для новых задач.

Ключевые навыки:

ChatGPT / Claude Нужно
Code Review Нужно
Core Web Vitals Нужно
CSS-in-JS Нужно
Data Fetching Нужно
Docker Нужно
E2E тестирование Нужно
Git Advanced Нужно
GitHub Actions / GitLab CI Нужно
GitHub Copilot Нужно
GraphQL Design Нужно
Performance Budgets Нужно
Progressive Web Apps Нужно
REST API Design Нужно
SSR/SSG/ISR паттерны Нужно
State Management Нужно
Svelte / SvelteKit Нужно
Tailwind CSS Нужно
Unit-тестирование Нужно
Vite и современные бандлеры Нужно
Web APIs Нужно
Web Components Нужно
Алгоритмы и сложность Нужно
Асинхронное программирование Нужно
Визуальное регрессионное тестирование Нужно
Доступность (Accessibility) Нужно
Качество кода и рефакторинг Нужно
Компонентное тестирование Нужно
Микрофронтенды Нужно
Оптимизация бандла Нужно
Паттерны проектирования Нужно
Разработка дизайн-систем Нужно
Современный CSS Нужно
Структуры данных Нужно
Тестирование доступности Нужно
Типобезопасность и системы типов Нужно
Переход: ~2-3 года
  • Самостоятельно реализовал 3+ проекта
  • Провёл успешные код-ревью
  • Участвовал в разрешении production инцидентов

Lead / Staff

7-12 лет

Ответственность: Техническое лидерство команды или направления. Проектирование системной архитектуры. Координация с другими командами. Формирование стандартов и best practices. Участие в найме. Планирование технического roadmap.

Ключевые навыки:

ChatGPT / Claude Нужно
Code Review Нужно
Core Web Vitals Нужно
CSS-in-JS Нужно
Data Fetching Нужно
Docker Нужно
E2E тестирование Нужно
Git Advanced Нужно
GitHub Actions / GitLab CI Нужно
GitHub Copilot Нужно
GraphQL Design Нужно
Performance Budgets Нужно
Progressive Web Apps Нужно
REST API Design Нужно
SSR/SSG/ISR паттерны Нужно
State Management Нужно
Svelte / SvelteKit Нужно
Tailwind CSS Нужно
Unit-тестирование Нужно
Vite и современные бандлеры Нужно
Web APIs Нужно
Web Components Нужно
Алгоритмы и сложность Нужно
Асинхронное программирование Нужно
Визуальное регрессионное тестирование Нужно
Доступность (Accessibility) Нужно
Качество кода и рефакторинг Нужно
Компонентное тестирование Нужно
Микрофронтенды Нужно
Оптимизация бандла Нужно
Паттерны проектирования Нужно
Разработка дизайн-систем Нужно
Современный CSS Нужно
Структуры данных Нужно
Тестирование доступности Нужно
Типобезопасность и системы типов Нужно
Переход: ~2-3 года
  • Самостоятельно реализовал 3+ проекта
  • Провёл успешные код-ревью
  • Участвовал в разрешении production инцидентов

Principal

10+ лет

Ответственность: Техническая стратегия на уровне компании или домена. Кросс-организационное влияние. Решение системных проблем бизнеса через технологии. Менторинг lead-инженеров. Публичное представление компании.

Ключевые навыки:

ChatGPT / Claude Нужно
Code Review Нужно
Core Web Vitals Нужно
CSS-in-JS Нужно
Data Fetching Нужно
Docker Нужно
E2E тестирование Нужно
Git Advanced Нужно
GitHub Actions / GitLab CI Нужно
GitHub Copilot Нужно
GraphQL Design Нужно
Performance Budgets Нужно
Progressive Web Apps Нужно
REST API Design Нужно
SSR/SSG/ISR паттерны Нужно
State Management Нужно
Svelte / SvelteKit Нужно
Tailwind CSS Нужно
Unit-тестирование Нужно
Vite и современные бандлеры Нужно
Web APIs Нужно
Web Components Нужно
Алгоритмы и сложность Нужно
Асинхронное программирование Нужно
Визуальное регрессионное тестирование Нужно
Доступность (Accessibility) Нужно
Качество кода и рефакторинг Нужно
Компонентное тестирование Нужно
Оптимизация бандла Нужно
Паттерны проектирования Нужно
Разработка дизайн-систем Нужно
Современный CSS Нужно
Структуры данных Нужно
Тестирование доступности Нужно
Типобезопасность и системы типов Нужно
Переход: ~2-3 года
  • Самостоятельно реализовал 3+ проекта
  • Провёл успешные код-ревью
  • Участвовал в разрешении production инцидентов

Gap-анализ: навыки для развития

Для перехода на следующий уровень необходимо развить:

Core Web Vitals

Оптимизирует Core Web Vitals в SvelteKit: preload критических ресурсов, lazy loading через Svelte actions, font optimization. Настраивает web-vitals библиотеку для RUM-мониторинга, улучшает INP через дебаунс обработчиков событий и оптимизацию $effect.

CSS-in-JS

Применяет CSS-in-JS подходы в Svelte-компонентах: scoped styles с динамическими class bindings и CSS custom properties. Оптимизирует рендеринг через compile-time оптимизацию стилей Svelte. Интегрирует design tokens и тестирует визуальные состояния компонентов.

Data Fetching

Реализует продвинутые паттерны загрузки данных в SvelteKit: параллельные load-функции, invalidateAll для обновления, streaming с promises. Создаёт типобезопасные API-обёртки, настраивает кэширование ответов через Cache-Control headers в server routes.

Progressive Web Apps

Настраивает PWA в SvelteKit с кастомным service worker: стратегии кэширования (stale-while-revalidate, cache-first), offline-fallback страницы. Реализует фоновую синхронизацию данных, push-уведомления и обновление SW без потери состояния $state.

SSR/SSG/ISR паттерны

Настраивает стратегии рендеринга в SvelteKit: SSR для динамических страниц, prerender для статических, CSR для SPA-секций. Использует adapter-static и adapter-node, реализует ISR-подобные паттерны через кэширование headers и invalidation.

State Management

Проектирует состояние SvelteKit-приложения: глобальные stores для авторизации и настроек, context API для tree-scoped данных, $state для форм. Реализует optimistic updates через form actions, синхронизирует серверное и клиентское состояние через load-invalidation.

Svelte / SvelteKit

Самостоятельно реализует сложные UI-компоненты с Svelte / SvelteKit. Оптимизирует производительность рендеринга. Пишет тесты. Применяет инструменты для state management.

Tailwind CSS

Настраивает Tailwind CSS для SvelteKit-проекта: кастомная тема, плагины, content-пути для Svelte-файлов. Комбинирует Tailwind с scoped-стилями Svelte и Skeleton UI, создаёт переиспользуемые компонентные варианты через class: директиву и clsx.

Vite и современные бандлеры

Настраивает Vite для SvelteKit-проекта: кастомные алиасы путей, proxy для API, оптимизация зависимостей (optimizeDeps). Подключает Vite-плагины для SVG-компонентов, imagetools, настраивает build-оптимизации и environment variables для разных окружений.

Web APIs

Применяет продвинутые Web API в Svelte: ResizeObserver и MutationObserver через actions, Web Workers для тяжёлых вычислений, Clipboard API. Интегрирует Geolocation, Media API и Notification API в SvelteKit, управляет жизненным циклом через $effect cleanup.

Web Components

Создаёт Svelte-компоненты, экспортируемые как Web Components через customElement: true, настраивает shadow DOM и проброс свойств. Интегрирует сторонние UI-библиотеки на Web Components в SvelteKit, обеспечивает корректную гидратацию SSR.

Алгоритмы и сложность

Оптимизирует алгоритмы обработки списков и деревьев в Svelte-приложениях, применяет мемоизацию через $derived для кэширования вычислений. Профилирует производительность реактивных цепочек, выбирает оптимальные структуры для keyed each-блоков.

Асинхронное программирование

Реализует параллельную загрузку данных через Promise.all в SvelteKit load-функциях, управляет race conditions через $effect.tracking(). Создаёт переиспользуемые async-обёртки для stores, обрабатывает отмену запросов через AbortController.

Визуальное регрессионное тестирование

Настраивает систему визуального тестирования для Svelte: Playwright с pixel-сравнением, Chromatic для Storybook-компонентов. Создаёт тесты для разных viewports и тем оформления, интегрирует визуальные проверки в CI через GitHub Actions, управляет baseline-снимками.

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

Реализует продвинутую доступность в Svelte-компонентах: live regions для динамического контента, focus management при навигации SvelteKit. Настраивает aria-* атрибуты для кастомных виджетов, создаёт skip-links и корректные heading-иерархии в layout-ах.

Качество кода и рефакторинг

Настраивает расширенные правила ESLint для Svelte 5 с проверкой рун и accessibility, интегрирует svelte-check в pre-commit хуки. Применяет SonarQube или Code Climate для метрик качества, покрывает критические компоненты unit-тестами через Vitest.

Компонентное тестирование

Создаёт комплексные тесты Svelte-компонентов: мокирование stores и $state, тестирование $derived-вычислений, async-операций. Тестирует компоненты с контекстом, слотами и snippet-ами, настраивает coverage-отчёты Vitest, создаёт test utilities для SvelteKit.

Микрофронтенды

Работает с micro-frontends в Svelte: использует vite-plugin-federation для Svelte Module Federation, реализует Svelte components как Web Components для интеграции с любым фреймворком. Настраивает shared state через writable stores с cross-MFE synchronization через events.

Оптимизация бандла

Оптимизирует бандл SvelteKit-приложения: настраивает code splitting по маршрутам, manualChunks для vendor-библиотек, preload стратегии. Минимизирует CSS через Tailwind purge, анализирует дублирование зависимостей, настраивает gzip/brotli сжатие на сервере.

Паттерны проектирования

Реализует паттерны Svelte 5: compound-компоненты через snippet-ы, render delegation, context API для dependency injection. Применяет паттерн действий (use:action) для переиспользуемой DOM-логики, проектирует адаптивные layout-ы в SvelteKit.

Разработка дизайн-систем

Разрабатывает компоненты дизайн-системы на Svelte 5 с типизированными $props(), слотами и snippet-ами для гибкой композиции. Настраивает Storybook для документации Svelte-компонентов, создаёт варианты через CSS variables и Tailwind-классы.

Современный CSS

Применяет продвинутые CSS-фичи в Svelte: container queries, has(), nesting, слои каскада (@layer). Создаёт адаптивные layout-ы с dynamic viewport units, использует Svelte transitions и animations с CSS keyframes для плавных UI-переходов.

Структуры данных

Проектирует нормализованные хранилища данных в Svelte stores и $state-рунах, применяет деревья и графы для навигационных структур SvelteKit. Использует WeakMap для кэширования ссылок на компоненты, оптимизирует структуры для серверных load-функций.

Типобезопасность и системы типов

Создаёт строгие TypeScript-интерфейсы для пропсов компонентов, типизирует stores и $derived-руны с generics. Настраивает svelte-check в strict-режиме, типизирует form actions, server hooks и API endpoints SvelteKit с полной безопасностью типов.