选择你当前的职位

选择角色和级别——我们会展示成长路径、技能和差距分析。

发展路径

Junior

0-2 years

当前

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

关键技能:

Core Web Vitals 需要
CSS-in-JS 需要
Data Fetching 需要
Progressive Web Apps (PWA) 需要
SSR/SSG/ISR Patterns 需要
State Management 需要
Svelte / SvelteKit 需要
Tailwind CSS 需要
Vite & Modern Bundlers 需要
Web APIs 需要
Web Components 需要
Algorithms & Complexity 需要
Async Programming 需要
Visual Regression Testing 需要
Web Accessibility 需要
Code Quality & Refactoring 需要
Component Testing 需要
Bundle Optimization 需要
Design Patterns 需要
Design System Development 需要
Modern CSS 需要
Data Structures 需要
Type Safety & Type Systems 需要

Middle

2-5 years

下一个

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

关键技能:

Core Web Vitals 需要
CSS-in-JS 需要
Data Fetching 需要
Progressive Web Apps (PWA) 需要
SSR/SSG/ISR Patterns 需要
State Management 需要
Svelte / SvelteKit 需要
Tailwind CSS 需要
Vite & Modern Bundlers 需要
Web APIs 需要
Web Components 需要
Algorithms & Complexity 需要
Async Programming 需要
Visual Regression Testing 需要
Web Accessibility 需要
Code Quality & Refactoring 需要
Component Testing 需要
Micro Frontends 需要
Bundle Optimization 需要
Design Patterns 需要
Design System Development 需要
Modern CSS 需要
Data Structures 需要
Type Safety & Type Systems 需要

Senior

5-8 years

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

关键技能:

ChatGPT / Claude 需要
Code Review 需要
Core Web Vitals 需要
CSS-in-JS 需要
Data Fetching 需要
Docker 需要
E2E Testing 需要
Git Advanced 需要
GitHub Actions / GitLab CI 需要
GitHub Copilot 需要
GraphQL Design 需要
Performance Budgets 需要
Progressive Web Apps (PWA) 需要
REST API Design 需要
SSR/SSG/ISR Patterns 需要
State Management 需要
Svelte / SvelteKit 需要
Tailwind CSS 需要
Unit Testing 需要
Vite & Modern Bundlers 需要
Web APIs 需要
Web Components 需要
Algorithms & Complexity 需要
Async Programming 需要
Visual Regression Testing 需要
Web Accessibility 需要
Code Quality & Refactoring 需要
Component Testing 需要
Micro Frontends 需要
Bundle Optimization 需要
Design Patterns 需要
Design System Development 需要
Modern CSS 需要
Data Structures 需要
Accessibility Testing 需要
Type Safety & Type Systems 需要

Lead / Staff

7-12 years

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

关键技能:

ChatGPT / Claude 需要
Code Review 需要
Core Web Vitals 需要
CSS-in-JS 需要
Data Fetching 需要
Docker 需要
E2E Testing 需要
Git Advanced 需要
GitHub Actions / GitLab CI 需要
GitHub Copilot 需要
GraphQL Design 需要
Performance Budgets 需要
Progressive Web Apps (PWA) 需要
REST API Design 需要
SSR/SSG/ISR Patterns 需要
State Management 需要
Svelte / SvelteKit 需要
Tailwind CSS 需要
Unit Testing 需要
Vite & Modern Bundlers 需要
Web APIs 需要
Web Components 需要
Algorithms & Complexity 需要
Async Programming 需要
Visual Regression Testing 需要
Web Accessibility 需要
Code Quality & Refactoring 需要
Component Testing 需要
Micro Frontends 需要
Bundle Optimization 需要
Design Patterns 需要
Design System Development 需要
Modern CSS 需要
Data Structures 需要
Accessibility Testing 需要
Type Safety & Type Systems 需要

Principal

10+ years

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

关键技能:

ChatGPT / Claude 需要
Code Review 需要
Core Web Vitals 需要
CSS-in-JS 需要
Data Fetching 需要
Docker 需要
E2E Testing 需要
Git Advanced 需要
GitHub Actions / GitLab CI 需要
GitHub Copilot 需要
GraphQL Design 需要
Performance Budgets 需要
Progressive Web Apps (PWA) 需要
REST API Design 需要
SSR/SSG/ISR Patterns 需要
State Management 需要
Svelte / SvelteKit 需要
Tailwind CSS 需要
Unit Testing 需要
Vite & Modern Bundlers 需要
Web APIs 需要
Web Components 需要
Algorithms & Complexity 需要
Async Programming 需要
Visual Regression Testing 需要
Web Accessibility 需要
Code Quality & Refactoring 需要
Component Testing 需要
Bundle Optimization 需要
Design Patterns 需要
Design System Development 需要
Modern CSS 需要
Data Structures 需要
Accessibility Testing 需要
Type Safety & Type Systems 需要

差距分析:待发展的技能

要达到下一级别,你需要发展:

Core Web Vitals

Optimizes Core Web Vitals in SvelteKit: preloads critical resources, lazy loading through Svelte actions, font optimization. Configures web-vitals library for RUM monitoring, improves INP through event handler debouncing and $effect optimization.

CSS-in-JS

Applies CSS-in-JS approaches within Svelte component styling, using scoped styles with dynamic class bindings and CSS custom properties. Optimizes rendering performance by leveraging Svelte's compile-time style optimization. Integrates design tokens and writes tests for component visual states.

Data Fetching

Implements advanced data fetching patterns in SvelteKit: parallel load functions, invalidateAll for updates, streaming with promises. Creates type-safe API wrappers, configures response caching through Cache-Control headers in server routes.

Progressive Web Apps (PWA)

Configures PWA in SvelteKit with a custom service worker: caching strategies (stale-while-revalidate, cache-first), offline fallback pages. Implements background data synchronization, push notifications, and SW updates without losing $state.

SSR/SSG/ISR Patterns

Configures rendering strategies in SvelteKit: SSR for dynamic pages, prerender for static, CSR for SPA sections. Uses adapter-static and adapter-node, implements ISR-like patterns through caching headers and invalidation.

State Management

Designs SvelteKit application state: global stores for auth and settings, context API for tree-scoped data, $state for forms. Implements optimistic updates through form actions, synchronizes server and client state through load invalidation.

Svelte / SvelteKit

Independently implements complex UI components with Svelte/SvelteKit. Optimizes rendering performance. Writes tests. Applies state management tools.

Tailwind CSS

Configures Tailwind CSS for a SvelteKit project: custom theme, plugins, content paths for Svelte files. Combines Tailwind with Svelte scoped styles and Skeleton UI, creates reusable component variants through class: directive and clsx.

Vite & Modern Bundlers

Configures Vite for a SvelteKit project: custom path aliases, API proxy, dependency optimization (optimizeDeps). Connects Vite plugins for SVG components, imagetools, configures build optimizations and environment variables for different environments.

Web APIs

Applies advanced Web APIs in Svelte: ResizeObserver and MutationObserver through actions, Web Workers for heavy computations, Clipboard API. Integrates Geolocation, Media API, and Notification API in SvelteKit, manages lifecycle through $effect cleanup.

Web Components

Creates Svelte components exported as Web Components through customElement: true, configures shadow DOM and property forwarding. Integrates third-party Web Component UI libraries in SvelteKit, ensures correct SSR hydration.

Algorithms & Complexity

Optimizes list and tree processing algorithms in Svelte applications, applies memoization through $derived for computation caching. Profiles reactive chain performance, selects optimal structures for keyed each blocks.

Async Programming

Implements parallel data loading through Promise.all in SvelteKit load functions, manages race conditions through $effect.tracking(). Creates reusable async wrappers for stores, handles request cancellation through AbortController.

Visual Regression Testing

Configures visual testing system for Svelte: Playwright with pixel comparison, Chromatic for Storybook components. Creates tests for different viewports and themes, integrates visual checks in CI through GitHub Actions, manages baseline snapshots.

Web Accessibility

Implements advanced accessibility in Svelte components: live regions for dynamic content, focus management during SvelteKit navigation. Configures aria-* attributes for custom widgets, creates skip-links and correct heading hierarchies in layouts.

Code Quality & Refactoring

Configures advanced ESLint rules for Svelte 5 with rune and accessibility checks, integrates svelte-check in pre-commit hooks. Uses SonarQube or Code Climate for quality metrics, covers critical components with unit tests through Vitest.

Component Testing

Creates comprehensive Svelte component tests: mocking stores and $state, testing $derived computations, async operations. Tests components with context, slots, and snippets, configures Vitest coverage reports, creates test utilities for SvelteKit.

Micro Frontends

Works with micro-frontends in Svelte: uses vite-plugin-federation for Svelte Module Federation, implements Svelte components as Web Components for integration with any framework. Configures shared state through writable stores with cross-MFE synchronization via events.

Bundle Optimization

Optimizes SvelteKit application bundle: configures code splitting by routes, manualChunks for vendor libraries, preload strategies. Minimizes CSS through Tailwind purge, analyzes dependency duplication, configures gzip/brotli compression on the server.

Design Patterns

Implements Svelte 5 patterns: compound components through snippets, render delegation, context API for dependency injection. Applies the action pattern (use:action) for reusable DOM logic, designs adaptive layouts in SvelteKit.

Design System Development

Develops design system components on Svelte 5 with typed $props(), slots, and snippets for flexible composition. Configures Storybook for Svelte component documentation, creates variants through CSS variables and Tailwind classes.

Modern CSS

Applies advanced CSS features in Svelte: container queries, has(), nesting, cascade layers (@layer). Creates responsive layouts with dynamic viewport units, uses Svelte transitions and animations with CSS keyframes for smooth UI transitions.

Data Structures

Designs normalized data stores in Svelte stores and $state runes, applies trees and graphs for SvelteKit navigation structures. Uses WeakMap for component reference caching, optimizes structures for server load functions.

Type Safety & Type Systems

Creates strict TypeScript interfaces for component props, types stores and $derived runes with generics. Configures svelte-check in strict mode, types form actions, server hooks, and SvelteKit API endpoints with full type safety.