The web platform is shifting faster than most teams can refactor. AI-assisted coding, edge-first deployments, and native browser APIs are rewriting what 'modern' means. If your stack still looks like 2022, you're already shipping technical debt.
AI-First Workflows Move From Novelty to Baseline
Copilot, Cursor, and local LLMs now handle scaffolding, test generation, and refactoring. The win isn't speed—it's consistency. Teams that codify prompts into shared prompt libraries and CI gates (lint AI output, enforce type coverage) ship fewer regressions. Treat generated code like junior PRs: review, test, own.
💡
TipAdd a 'generated-by-ai' label to PRs. Run mutation tests on AI-written units to catch hallucinated logic.
Meta-Frameworks Consolidate Around React Server Components
Next.js 15, Remix v3, and Astro 5 default to RSC. The mental model shifts: components render on server, stream HTML, hydrate islands. Bundle sizes drop 30-50% for content-heavy routes. Migration path: adopt RSC per route, keep client islands for interactivity, delete getServerSideProps.
TypeScript Becomes Non-Negotiable
TS 5.5+ brings isolatedDeclarations, faster emits, and stricter inference. New projects start with strict: true, noUncheckedIndexedAccess, and exactOptionalPropertyTypes. Legacy codebases: enable strict mode file-by-file via // @ts-check then migrate. The ROI: 15% fewer runtime errors per Datadog benchmarks.
| Flag | Impact |
|---|---|
| strictNullChecks | Eliminates undefined crashes |
| noUncheckedIndexedAccess | Catches sparse array bugs |
| exactOptionalPropertyTypes | Prevents optional prop drift |
Edge Deployments Shrink Cold Starts to Milliseconds
Cloudflare Workers, Vercel Edge, and Netlify Edge Functions now support Node.js compat flags and WebAssembly. Move auth validation, geo-routing, and A/B tests to edge middleware. Keep heavy compute (PDF generation, ML inference) in regional functions. Pattern: edge for routing, region for workloads.
"The edge isn't a replacement for your origin—it's a programmable CDN layer that decides which origin gets the request.
— Kent C. Dodds
Modern CSS Replaces Utility Frameworks for Layout
Container queries, :has(), subgrid, and CSS layers land in all evergreen browsers. Teams drop Tailwind for layout, keep it for design tokens. Example: a card component owns its responsive breakpoints via @container, no parent context needed. Migration: audit @media usage, convert to container queries per component.
React Security Hardening Goes Mainstream
React 19's useActionState and form actions enforce server-side validation by default. CSP nonces integrate via meta tags. DOMPurify stays required for any dangerouslySetInnerHTML. New rule: zero raw HTML from user input. Use remark/rehype pipelines with allowlists for markdown rendering.
⚠️
WarningNever trust client-side sanitization. Validate on server, serialize safe AST, hydrate.
Performance Budgets Enforced in CI
Lighthouse CI fails builds over 200KB JS gzipped, 0.5s TBT, or CLS > 0.1. Bundle analyzers (webpack-bundle-analyzer, rollup-plugin-visualizer) run on every PR. Tree-shake lodash, date-fns, icon sets. Replace moment with date-fns/tz or Temporal API polyfill.
Accessibility as First-Class Acceptance Criteria
axe-core in Playwright tests catches 57% of WCAG 2.2 AA violations automatically. Design systems ship with ARIA patterns baked in (radix-ui, headlessui). Manual checklist per release: keyboard trap test, screen reader pass (NVDA/VoiceOver), color contrast audit. Document gaps in VPAT.
✦
Your 2024 Action Plan
- Audit stack: flag dependencies unmaintained >18 months.
- Enable TS strict mode in one package; measure error count.
- Move one high-traffic route to RSC + edge middleware.
- Replace layout utilities with container queries.
- Add Lighthouse CI budget to main branch protection.
- Schedule quarterly accessibility audit with real users.
Ship incrementally. Measure. Repeat.
