Designs efficient algorithms for processing large lists in Angular: virtual scrolling via CDK, lazy data loading, and incremental rendering. Profiles bottlenecks via Angular DevTools.
Roles · Frontend Developer (Angular) · Senior
What a Senior } should know
37 core skills, 52 in total. Expectations per skill, and what changes at the next level.
This page lists what a Senior } is expected to know and do, skill by skill. Core skills are the ones a manager and peers assess in a review cycle; the rest count only in self-assessment. Main areas: Programming Fundamentals, Frontend Development, API & Integration.
Core skills for a Senior
Grouped by area. The label on the right is the expected depth: Awareness, Working, Advanced or Expert.
Programming Fundamentals · 7
Designs complex reactive streams: race conditions via exhaustMap, API retry strategies, coordination between NgRx Effects and Angular signals. Creates custom RxJS operators for business logic.
Designs quality control systems: custom ESLint rules for Angular architecture, enforcing boundaries between feature modules via Nx, coverage metrics for components and services.
Designs complex data structures for Angular applications: trees for navigation and nested components, dependency graphs for DI, normalized entity stores via @ngrx/entity.
Designs architectural patterns for Angular: Feature Shell via standalone components, Mediator via NgRx Effects, Adapter for integrating third-party libraries with Angular DI and reactive stack.
Applies OOP/SOLID in Angular architecture: dependency injection with Angular's DI system, interface segregation for service contracts, single responsibility for component design. Designs modular Angular applications with proper use of modules, lazy loading, and clean separation between smart and presentational components.
Designs type-safe APIs for Angular libraries: conditional types for DI tokens, template literal types for routing, branded types for business domain values, dynamic component typing.
Frontend Development · 18
Designs frontend architecture with Angular Core. Optimizes bundle size and Core Web Vitals. Creates design systems and reusable components. Mentors the team.
Designs bundle optimization strategy: granular code splitting via standalone components, secondary entry points for libraries, differential loading, preloading strategies (PreloadAllModules, custom).
Designs component testing strategy: harnesses for Angular Material, custom test utilities and page objects, Cypress Component Testing integration, testing standalone components without TestBed.
Designs Core Web Vitals monitoring system: web-vitals library integration in Angular, Real User Monitoring via Angular performance API, SSR with Angular Universal for LCP optimization, performance budgets in CI.
Designs data layer architecture in Angular: abstract data services, HttpInterceptors for authentication and caching, optimistic updates via NgRx, offline data strategy with background sync.
Designs Angular design system architecture: standalone component library, theming via CSS Custom Properties, Angular CDK for behavioral primitives, auto-generated documentation.
Designs micro-frontend architecture on Angular: uses Nx workspace for monorepo management of micro-frontends, configures Angular CDK for consistent theming, designs shared library strategy via Nx publishable libraries. Ensures Angular version alignment between micro-frontends.
Designs Angular application CSS architecture: ViewEncapsulation strategy, CSS Custom Properties for dynamic theming, performant animations via will-change and GPU layers, critical CSS for SSR.
Designs Angular application PWA architecture: offline-first strategy with IndexedDB, custom service worker for complex caching logic, background sync via Angular Service Worker, Lighthouse PWA score optimization.
Designs frontend architecture with RxJS and reactive programming. Optimizes bundle size and Core Web Vitals. Creates design systems and reusable components. Mentors the team.
Designs Angular application SSR architecture: hydration strategies (full vs partial), streaming SSR for improved TTFB, CDN-level caching, dynamic route handling, Angular Signals integration for server state.
Designs Angular application state architecture: separating UI/domain/server state, NgRx Entity for normalization, SignalStore with patchState for local state, selectSignal optimization.
Designs a Tailwind CSS design system in Angular: custom plugins for utility generation, ViewEncapsulation.None integration, dynamic theming via CSS variables and Tailwind, bundle size optimization.
Designs visual testing system: coverage of all design system components, Playwright integration for full-page screenshots, baseline management strategy, dark theme and RTL testing.
Optimizes Angular build pipeline: custom webpack configurations via @angular-builders/custom-webpack, Module Federation for micro-frontends, CI build optimization through caching and parallelism.
Designs accessible Angular architecture: creates accessible component library on Angular CDK, configures automated a11y testing via Protractor/Playwright + axe-core, implements route-level focus management. Ensures accessible forms with Reactive Forms and custom validators.
Integrates advanced Web APIs in Angular: Web Workers via Angular CLI, SharedArrayBuffer for computations, WebSocket via RxJS webSocket(), Broadcast Channel for cross-tab communication.
Designs Angular Elements architecture for cross-framework integration: Shadow DOM strategies, lazy-loading Angular Elements, bundle size optimization for widgets, styling via CSS Parts.
API & Integration · 2
Designs GraphQL integration in Angular: normalized Apollo cache, cache-policy strategies (cache-first, network-only), fragments for reuse, request batching, query performance monitoring.
Architects REST API integration: auto-generating Angular services from OpenAPI specs, response caching via HTTP ETag and interceptors, API versioning, abstraction for switching between REST and GraphQL.
Cloud & Infrastructure · 1
Designs Docker infrastructure for Angular: image size optimization via Alpine, layer caching for CI, docker-compose for full-stack development with SSR, health checks for Angular Universal server.
DevOps & CI/CD · 1
Designs CI/CD architecture for Angular: affected-based testing via Nx, Chromatic for visual regression, release automation via semantic-release, preview deployments for each PR.
Testing & QA · 3
Designs comprehensive accessibility testing strategies for Angular application suites covering WCAG 2.1 AA/AAA compliance. Implements advanced testing patterns including automated color contrast validation, dynamic content announcement testing, and complex widget interaction verification with assistive technologies. Optimizes a11y test coverage by combining automated scanning, manual audit protocols, and user testing with assistive technology users for Angular enterprise applications.
Designs e2e strategy for Angular: Playwright with component testing, visual comparison, SSR scenario testing, accessibility tests via axe in e2e, test data strategy and fixture management.
Designs unit testing strategy: test data factories, custom matchers for Angular-specific checks, testing signals and computed, test speed optimization via Jest workers.
AI-Assisted Development · 2
Integrates AI into Angular development workflows: automating code review via AI, generating NgRx boilerplate, analyzing component performance, creating documentation for Angular libraries.
Optimizes Copilot usage for Angular: custom instructions via .github/copilot-instructions.md for Angular patterns, code review via Copilot, generating migration schematics and builders.
Version Control & Collaboration · 2
Reviews architectural decisions in Angular: evaluating feature module structure, state management patterns, SSR compatibility, performance implications, security via DomSanitizer and CSP.
Optimizes Git workflow for Angular: git hooks for pre-commit checks (lint, test affected), .gitattributes for Angular files, LFS strategy for assets, changelog automation via conventional-changelog.
Performance Engineering · 1
Designs performance budget system: granular budgets per route and feature module, real user monitoring via Performance Observer API, custom metrics for Angular-specific indicators (TTI after hydration).
Additional skills
Not assessed by the team, but part of the self-assessment and the development plan.
What changes at Lead
52 skills get a higher expectation or become core when moving from Senior to Lead. The biggest jumps first.
- Accessibility Testing: Advanced → Expert
- Algorithms & Complexity: Advanced → Expert
- Angular Core: Advanced → Expert
- Async Programming: Advanced → Expert
- Bundle Optimization: Advanced → Expert
- ChatGPT / Claude: Advanced → Expert
- Code Quality & Refactoring: Advanced → Expert
- Code Review: Advanced → Expert
- Component Testing: Advanced → Expert
- Core Web Vitals: Advanced → Expert
} in the open competency matrix: 52 skills across 5 levels. The matrix is free for individuals and stays free.