Languages & Frameworks
A selection of programming languages, alongside essential frameworks for building a variety of custom software.- React
' fill='currentColor'/%3E%3C/svg%3E)
changedReact continues as our standard for customer-facing web applications. We have adopted the React Compiler for automatic memoization, eliminating manual useMemo/useCallback optimization. Our shared component library — built with TypeScript — has grown to 80+ components with full accessibility compliance and Porsche Design System integration. Components are developed and documented in Storybook, and styled using Design Tokens.
Our React Stack
Every React project at Porsche Digital shares the same foundation:
Layer
Choice
Rationale
Framework
Next.js (Pages Router)
Static export for marketing/public sites; SSR for authenticated apps
Styling
SCSS Modules + Design Tokens
Co-located styles, Porsche Design System compliance
State
React Context + useReducer
Sufficient for our app complexity; no Redux needed
Forms
React Hook Form + Zod
Type-safe validation with minimal re-renders
Testing
Vitest + React Testing Library
Fast, behavior-focused tests
Component Dev
Storybook
Isolated development with PDS integration
React Compiler
The React Compiler (formerly React Forget) automatically optimizes re-renders by inserting memoization at build time. Since adoption:
Removed ~400 manual useMemo/useCallback calls across our component library
Reduced average component re-render time by 15-20% in profiler benchmarks
Simplified code review — no more debates about "should this be memoized?"
The compiler runs as a Babel plugin in our build pipeline. Components that violate the Rules of React are flagged at build time, catching bugs that would have been silent runtime issues.
Component Library
Our shared library (@porsche-digital/components) wraps Porsche Design System web components with React-specific APIs:
80+ components covering layout, forms, navigation, data display, and feedback
Accessibility-first — every component passes axe-core critical and serious checks
Design token integration — all visual properties reference tokens, enabling theming without component changes
Versioned and published to our internal npm registry with automated release via GitHub Actionsread more… - TypeScriptchangedTypeScript has achieved adopt status across all teams. Every new project and service is written in TypeScript. The Macan team completed their migration of the telemetry API from plain JavaScript, and all teams benefit from shared type definitions via our internal npm packages. TypeScript underpins our React frontend stack and is tested with Vitest across all projects.
Why TypeScript
We adopted TypeScript to eliminate an entire class of runtime errors that plagued our JavaScript services. Before the migration, production incidents caused by undefined is not a function or incorrect API payloads accounted for roughly 20% of our P1 incidents. Since full adoption, that category has dropped to near zero.
Beyond type safety, TypeScript gives us:
Refactoring confidence — renaming a field in a shared type immediately surfaces every consumer that needs updating
Self-documenting APIs — interfaces and type aliases serve as living documentation for service contracts
Tooling quality — IDE autocompletion, go-to-definition, and inline error highlighting accelerate developer onboarding
Configuration Standards
All teams share a base tsconfig.json published via our internal @porsche-digital/tsconfig package:
{
"compilerOptions": {
"strict": true,
"noUncheckedIndexedAccess": true,
"exactOptionalPropertyTypes": true,
"target": "ES2022",
"moduleResolution": "bundler"
}
}
Key decisions:
strict: true is mandatory — no exceptions. Teams that initially resisted found that the upfront investment paid off within the first sprint.
noUncheckedIndexedAccess catches a surprising number of bugs when accessing arrays and records.
No any — our ESLint config flags @typescript-eslint/no-explicit-any as an error. When external libraries lack types, we write declaration files rather than reaching for any.
Shared Type Packages
Our monorepo publishes domain-specific type packages:
@porsche-digital/types-vehicle — VIN, model, configuration types shared between frontend and backend
@porsche-digital/types-api — Request/response types generated from OpenAPI specs
@porsche-digital/types-events — Event schemas for our async messaging infrastructure
These packages are versioned independently and follow semantic versioning strictly — a breaking type change is a major version bump.
Migration Lessons
The Macan team's JavaScript-to-TypeScript migration of the telemetry API (42 files, ~8,000 LOC) took 3 sprints. Key takeaways:
Migrate bottom-up — start with leaf modules (utilities, constants) and work toward entry points
Don't boil the ocean — use // @ts-expect-error temporarily with a tracking ticket, never any
Pair with tests — adding types surfaced 12 latent bugs that had existing tests passing despite incorrect behavior
Celebrate milestones — the team tracked "files remaining" on a dashboard, which maintained momentum
What's Next
We are evaluating TypeScript 5.8's --erasableSyntaxOnly mode for direct Node.js execution without a build step, and exploring satisfies patterns for configuration objects across our infrastructure-as-code tooling.read more…
- ElmElm is a functional language that compiles to JavaScript, offering zero runtime exceptions and a strong type system. The Cayenne team experimented with it for a small internal calculator tool. While the developer experience is excellent, the limited ecosystem and small community raise concerns about long-term viability for production use.read more…
- SwiftUIchangedSwiftUI continues in assess. The Taycan team has joined the evaluation, building a prototype for their companion app settings screen. While the declarative syntax accelerates development, we have encountered limitations with complex navigation patterns and custom transition animations that require falling back to UIKit.
Evaluation Context
Our iOS apps currently use UIKit with a coordinator-based navigation pattern. SwiftUI promises faster UI development and better alignment with our declarative approach on the web (React), but we need to validate it handles our specific requirements.
What Works Well
Previews — Xcode previews provide instant visual feedback, similar to Storybook for web components. This dramatically speeds up UI iteration.
Declarative layout — composing views with modifiers feels natural to developers coming from React. Knowledge transfer between web and mobile teams has improved.
Design Tokens integration — our token system translates cleanly to SwiftUI's Color and Font extensions, maintaining visual consistency across platforms.
Where We Hit Limits
Navigation — NavigationStack (iOS 16+) works for simple hierarchies but struggles with our complex flows: deep links, conditional auth gates, and multi-step configuration wizards
Custom transitions — our signature vehicle reveal animation requires UIKit's UIViewControllerAnimatedTransitioning protocol; SwiftUI's matchedGeometryEffect cannot replicate it
UIKit interop overhead — wrapping UIKit views in UIViewRepresentable works but creates maintenance burden and testing complexity
Decision Timeline
We will make a go/no-go decision on SwiftUI adoption by end of Q4 2025. The key criterion: can we build the Taycan companion app's settings module entirely in SwiftUI without UIKit fallbacks for core functionality? If yes, new screens will default to SwiftUI. If not, we continue with UIKit and revisit when SwiftUI's navigation and animation APIs mature further.read more…
- Bun
new
HiddenBun is a fast all-in-one JavaScript runtime, bundler, test runner, and package manager built on JavaScriptCore. The Taycan team is evaluating it as an alternative to Node.js for specific internal tooling and build scripts where startup time and install speed matter most.
Initial benchmarks on our monorepo tooling show promising results: bun install completes in ~2s vs ~12s for npm install, and script startup is 3-4x faster. However, we have encountered compatibility issues with some Node.js APIs our services depend on — particularly around node:cluster and certain native addon patterns.
Bun is not yet being considered for production services. The assessment focuses on developer tooling and CI scripts where its speed advantages are most impactful and compatibility risks are lowest.read more… - DenoHiddenDeno is a secure runtime for JavaScript and TypeScript built on V8 and Rust. It ships with a built-in formatter, linter, and test runner.read more…
