TechPrufer
Get started
Vercel
Vercel logoVercel · Feature trail

Framework-Defined Infrastructure

39 posts · Aug 2019 – Sep 2026

What this trail covers

Vercel's platform evolves towards self-driving infrastructure, leveraging AI agents to autonomously manage production operations, improve application code with real-world insights, and learn from production behavior. This builds upon the foundation of framework-defined infrastructure, where application code dictates infrastructure provisioning. The Vercel AI Cloud enables new primitives for AI workloads, and the Vercel Agent acts as a first responder for production operations and security, inves. Vercel Sandbox provides on-demand Linux microVMs for agents, offering sub-second starts, full isolation, ephemeral environments, snapshotting for state restoration, and fluid compute with Active CPU pricing. This infrastructure is built on Vercel's internal compute platform, Hive, which uses Firecracker microVMs for scalable, isolated, and ephemeral execution of user code, now extended to agent workloads.

All Vercel trails
  1. How Rogo ships agent-written code to production in minutes on VercelThis talk details how Rogo utilizes Vercel's AI agents and framework-defined infrastructure to achieve rapid, automated code shipping to production. It highlights the integration of agent-written code into the development workflow, enabling minutes-long deployment cycles. The focus is on the practical application of AI agents for code generation and deployment, demonstrating how Vercel's platform facilitates this agentic workflow for production readiness.
  2. Agentic InfrastructureThis post introduces the concept of 'Agentic Infrastructure' as the next evolution of software infrastructure, driven by LLMs and coding agents. It outlines three key areas: 1. Infrastructure for coding agents to deploy to, emphasizing programmatic deployment surfaces like Vercel's CLI, API, MCP servers, and Git integration. 2. Infrastructure for building and running agents, detailing Vercel's unified AI primitives including AI SDK, Chat SDK, AI Gateway, Fluid compute, Workflows, Queues, and Sandbox. 3. Infrastructure that is itself agentic, describing how Vercel's platform can autonomously respond to production anomalies by leveraging observability data, logs, and source code. The post highlights the rapid growth of agent-driven deployments on Vercel and the shift towards software that writes, ships, and heals itself.
  3. Run untrusted code with Vercel Sandbox, now generally availableIntroduces Vercel Sandbox, a new execution layer for AI agents, providing on-demand Linux microVMs with sub-second starts, full isolation, ephemeral environments, snapshotting capabilities, and fluid compute with Active CPU pricing. This leverages Vercel's internal compute platform (Hive) and Firecracker microVMs, extending their existing infrastructure for deployments to agent workloads. The post highlights how teams like Roo Code and Blackbox AI are using Sandbox for end-to-end testing, persistent collaboration via snapshots, and scalable agent orchestration.
  4. Self-driving infrastructureThis post introduces the concept of 'self-driving infrastructure' as the next evolution of Vercel's platform, building upon framework-defined infrastructure. It details how AI agents, specifically the Vercel Agent, will autonomously manage production operations, including investigating anomalies, performing root-cause analysis, and conducting AI code reviews in sandboxes. The post emphasizes closing the production-to-code feedback loop by generating pull requests based on production insights to improve application stability, security, and performance. It outlines a vision for autonomous operations where infrastructure understands, optimizes, and evolves applications, with a gradual shift towards full autonomy.
  5. Vercel: The anti-vendor-lock-in cloudThis post elaborates on the concept of framework-defined infrastructure (FDI) as Vercel's core strategy to combat vendor lock-in. It contrasts FDI with vendor-primitive-based approaches (AWS Lambda, Cloudflare Workers) by highlighting how building against framework conventions (Next.js App Router, Remix loaders) ensures code portability. The post emphasizes that local development with FDI uses standard framework tooling (e.g., `next dev`) instead of platform-specific simulators. It provides evidence of Next.js's portability by noting that a majority of Next.js apps run outside of Vercel. The introduction of Next.js Build Adapters is presented as a formalization of the framework-platform contract, ensuring transparency and equal integration opportunities for all platforms. The post also discusses Vercel's commitment to standards for databases and AI services, while acknowledging the need for proprietary APIs for services like Vercel Sandbox and Edge Config, which are still callable from external infrastructure. The underlying motivation is to build enduring open-source software and foster a larger ecosystem.
  7. Zero-config backends on Vercel AI CloudThis post introduces the extension of Framework-Defined Infrastructure (FDI) to backend frameworks on Vercel, enabling zero-configuration deployments for popular Python (FastAPI, Flask) and TypeScript (Express, Hono, NestJS, Nitro) frameworks. It highlights the automatic scaling, routing, and compute model inference based on framework conventions. The post also details the application of Active CPU Pricing with Fluid Compute for cost-efficient execution of intermittent workloads and introduces Durable Orchestration using the Workflow Development Kit (WDK) for long-running processes like AI agent loops and data pipelines. New backend AI templates for RAG pipelines are also released.
  8. Designing and building the Vercel Ship conference platformThis post details the technical implementation of the Vercel Ship 2025 conference platform. It covers the conceptual evolution of the visual identity, the use of generative AI (Flux, Cinema4D, Google Veo 2, Runway, Ideogram) for rapid prototyping and image generation, and the utilization of v0 for building UI components. It also describes the technical stack for the conference site, including Next.js, Postgres, and Payload CMS, with specific rendering strategies like ISR and PPR, and caching mechanisms using `use cache` and `cacheLife`. The post highlights dogfooding Vercel's platform features like Sign In with Vercel and monorepo integration, and the development of modular, themeable components using shadcn, Geist, and cva, along with React Email for transactional emails.
  9. Life of a Vercel request: Application-aware routingThis post details how Vercel's application-aware gateway uses framework code to define routing and infrastructure, moving beyond traditional CDNs. It explains how domains act as aliases to deployments, and how de-aliasing enriches requests for an application-aware WAF. The post highlights instant global propagation for rollouts and rollbacks, and how this awareness enables optimized request fulfillment by returning early, serving from cache, or invoking compute based on application logic.
  10. Personalization strategies that power ecommerce growthThis post details how Next.js and Vercel enable effective personalization by combining hybrid rendering, Edge Middleware, and feature flags. It explains architectural personalization (tailoring site structure and experience) and content personalization (tailoring displayed content), highlighting common mistakes like over-reliance on client-side rendering and inefficient content management. The post emphasizes Vercel's role in providing tools for performance-focused personalization, including Middleware for network-level adjustments, the Flags SDK for feature flagging, Speed Insights, caching, lazy loading, preview deployments, and marketplace integrations with personalization engines.
  11. Headless Salesforce: An incremental migration from monolith to composableThis post details an incremental migration strategy from Salesforce Commerce Cloud to a headless architecture using Next.js and Vercel. It highlights the use of Edge Middleware for traffic control and gradual rerouting, session synchronization techniques (encrypted cookies, JWTs), SEO preservation strategies, and mitigating Salesforce API challenges through granular data fetching and caching with Incremental Static Regeneration (ISR). The post also presents performance metrics (TTFB, FCP, LCP, INP, CLS), productivity improvements (deployment/rollback times), and business impact (reduced cart abandonment, increased conversion rates, zero downtime during peak traffic).
  12. Life of a Vercel request: Navigating the Edge NetworkThis post details the lifecycle of a Vercel request, focusing on the Edge Network's role in routing and optimization. It introduces 'Edge Requests' as requests that pass platform defenses and WAF actions, emphasizing their purpose in fetching data or triggering events and how Vercel enriches them with contextual data for Edge Middleware and Vercel Functions. It also explains 'Fast Data Transfer (FDT)' as the low-latency movement of data between users and the Vercel Edge Network, supported by PoPs and private fiber connections, bypassing public internet bottlenecks for secure, high-speed data transfer. The post highlights how these concepts contribute to delivering better user experiences and reducing costs by optimizing request frequency and type.
  13. Life of a Vercel request: What happens when a user presses enterThis post details the request lifecycle on Vercel, from the initial user request hitting the Edge Network and Vercel Firewall (including L3/L4 and WAF protections) to advanced routing via Edge Middleware, redirects, and rewrites. It emphasizes how framework code influences infrastructure provisioning and request handling, linking to existing concepts like framework-defined infrastructure and Vercel Firewall.
  14. From CDNs to Frontend CloudsThis post elaborates on the concept of 'frontend clouds' and how they address the limitations of traditional CDNs and IaC for modern web applications. It highlights the shift towards full-stack development enabled by meta-frameworks and introduces 'framework-defined infrastructure' as a core principle of Vercel's frontend cloud. The post explains how Vercel's platform translates framework code into infrastructure, abstracting away complexity and enabling developers to consistently achieve speed, global presence, scalability, dynamism, reliability, and security. It emphasizes the blurring of lines between development and infrastructure, where code-level optimizations directly translate to infrastructure-level enhancements.
  15. How Teleport overhauled their docs with Next.js and Vercel | Customers | VercelTeleport migrated their documentation and website to Next.js and Vercel, leveraging serverless hosting for automated deployments and preview environments. This migration improved build times by over 60% and enabled 3x more concurrent builds, enhancing developer velocity and collaboration. The platform also provided enhanced security through Vercel's Firewall and DDoS mitigation, and streamlined access management with SSO integration.
  16. Architecting a live look at reliability: Stripe's viral Black Friday site | Customers | VercelThis post details how Stripe leveraged Vercel's framework-defined infrastructure, Next.js, SWR, and ISR to build a real-time microsite for Black Friday. Key technical decisions included opting for polling a backend cache with frequent rehydration over per-client WebSockets due to tight timelines and expected load. SWR was used for client-side real-time data management and background revalidation, while ISR automated revalidation of static content and propagated it across the Vercel Edge Network. A one-second max-age cache was chosen to balance fast initial loads with efficient handling of millions of requests by updating content in the background. The post also highlights Stripe's focus on isolation of the microsite's data sources from core infrastructure and a fallback strategy for real-time data streaming.
  17. The developer experience of the Frontend CloudThis post details how Vercel's Frontend Cloud integrates Git-based workflows, providing immutable infrastructure for every git push and true-to-production conditions for deployments. It highlights the observability tools available per-deployment for monitoring usage and performance, and discusses collaboration features like role-based access and Figma-like commenting on preview deployments. The post also emphasizes the benefits of unlimited deployment environments and the decoupling of deploys from releases, supported by feature flags. Finally, it advocates for monorepos as the optimal code architecture for frontends.
  18. The foundations of the Frontend CloudThis post introduces the concept of the Frontend Cloud and its foundational principles, specifically Framework-Defined Infrastructure (FDI) and serverless architecture. It defines 'Frontend' broadly to include all components communicating directly with external clients, encompassing UIs, client-side code, API services, reverse proxies, and specialized backend services like image optimization. The article argues for decoupling frontends from backends to enable independent scaling, faster iteration, and improved developer experience. It also outlines how middleware APIs can reconnect decoupled frontends and backends.
  19. Partial prerendering: Building towards a new default rendering model for web applicationsIntroduces Partial Prerendering (PPR) as an experimental rendering model for Next.js 14 on Vercel. PPR combines static edge delivery with dynamic capabilities by leveraging React Suspense boundaries. It generates a static shell for pages, with dynamic content rendered within Suspense fallbacks. PPR is implemented using React's streaming architecture and builds upon Incremental Static Regeneration (ISR) and Server-Side Rendering (SSR). It aims to eliminate trade-offs between static and dynamic rendering by allowing developers to define which parts of a page are static or dynamic. The feature is available for experimentation with Next.js 14 Canary and can be integrated into other frameworks via Vercel's Build Output API.
  20. Building secure and performant web applications on VercelThis post elaborates on Vercel's Frontend Cloud, highlighting its role in building secure and performant web applications. It details the iterative development workflow, including preview deployments and decoupling deploys from releases with Edge Middleware. It also covers seamless API and database integrations, authentication mechanisms, API gateway features, Secure Compute for private connections, scalable serverless compute, and built-in monitoring capabilities. The post emphasizes how these features contribute to peak scalability, reliability, developer productivity, and exceptional performance for web applications.
  21. Tekla's ecommerce evolution: harnessing flexibility with Vercel and Medusa | Customers | VercelThis post details Tekla's migration from Gatsby Cloud to Vercel and from WooCommerce to Medusa. It highlights the benefits of Vercel's platform for handling high traffic, providing reliable performance, and offering flexibility and scalability for e-commerce needs. The adoption of Next.js is also mentioned as a future plan for faster web deployments on Vercel, aiming to further enhance user experience and sales.
  22. Spend Management: Realtime Usage Alerts, SMS Notifications, and Project PausingIntroduced Spend Management features including email/web/SMS notifications for spend thresholds, flexible webhooks for real-time usage updates, and automatic project pausing. Added APIs for programmatic project pausing/resuming. Updated Vercel Functions to support up to 5-minute durations on Pro plans (15 on Enterprise) with safer 15-second defaults, building on previous recursion protection.
  23. Sonos migrated to Vercel to unlock new levels of efficiency and confidence for their developers. | Customers | VercelThis post details how Sonos migrated to Vercel and Next.js, resulting in a 75% improvement in build times and a 10% improvement in performance scores. It highlights the challenges Sonos faced with their previous infrastructure, including long build times, lack of Next.js feature support (Edge Middleware, ISR), cache management issues, and poor observability. The migration to Vercel addressed these by providing a unified Frontend Cloud experience, improved monorepo support, and seamless integration with Next.js features. The post also mentions the use of Vercel's Preview Deployments, Web Analytics, and built-in logging for better developer experience and site performance.
  24. New features for SvelteKit: Optimize your application with easeThis post details the integration of Vercel's framework-defined infrastructure (FDI) with SvelteKit, enabling features previously exclusive to Next.js. Key contributions include: support for per-route configuration of Serverless and Edge Functions, Incremental Static Regeneration (ISR) for SvelteKit routes, and enhanced compatibility with Vercel products like Web Analytics. It explains how SvelteKit adapters facilitate FDI by providing deployment environment-specific information. The post outlines per-route data fetching and rendering options (SSR, SSG, ISR) and function runtime choices (Node.js, Fluid compute). It provides an example of configuring ISR with an `expiration` time and mentions the `bypassToken` for cache management. It also highlights other Vercel gains for SvelteKit users, including Edge Config, Vercel KV, Postgres, Blob storage, preview deployments with commenting and visual editing, and native analytics.
  25. From idea to acquisition: How Potion.so shipped 4,000+ sites on Vercel | Customers | VercelThis post details how Potion.so, a Notion-to-website builder, utilized Vercel's Frontend Cloud, specifically the Platforms Starter Kit and Edge Network, to scale their operations and manage custom domains for over 4,000 users. It highlights the use of Server-Side Rendering (SSR) for performance and SEO, and Incremental Static Regeneration (ISR) for caching to prevent database overload. The narrative emphasizes the ease of setting up wildcard and custom domains, enabling Potion to focus on feature development rather than infrastructure configuration.
  26. Authentication for the frontend cloudThis post details how Clerk has adapted its authentication architecture for the 'frontend cloud' paradigm, emphasizing edge-native solutions. It highlights the use of framework-specific SDKs (including Next.js App Router and RSC support), component-based UIs (`<SignIn/>`, `<UserProfile/>`), and stateless session management with JWTs for sub-millisecond authentication at the edge. It also explains how JWT SSO and JWT templates enable composability with other frontend-first services.
  27. Deploy Remix without limits on VercelThis post introduces an advanced integration for Remix on Vercel, enabling streaming SSR with both Node.js and Edge runtimes on a per-route basis. It details how Remix applications can leverage Vercel's caching capabilities with headers like `stale-while-revalidate` and `stale-if-error`. The integration abstracts away runtime-specific needs, allowing `@vercel/remix` to replace `@remix-run/node` for a more streamlined experience. It also highlights the use of `defer()` and `<Await>` for dynamic content streaming and the potential for sub-100ms latency for dynamic server-rendered pages.
  28. Framework-defined infrastructureThis post introduces and explains the concept of Framework-Defined Infrastructure (FdI) as an evolution of Infrastructure as Code (IaC). It details how FdI allows frameworks to automatically infer and provision the necessary infrastructure based on application code and framework conventions, rather than requiring explicit IaC configuration. Examples are provided using Next.js to illustrate how different code patterns (e.g., `getServerSideProps` vs. `getStaticProps`) translate to different infrastructure deployments (serverless functions vs. static file serving). The post also touches upon how FdI applies to other frameworks like Gatsby, SvelteKit, and Remix, and how it integrates with Vercel's Build Output API.
  29. How a global agency built a web innovation engine in two months | Customers | VercelThis post details how Globacore, a digital agency, leveraged Vercel's platform and Next.js to transition from creating physical interactive experiences to building web-based digital experiences within two months. It highlights the use of Vercel's Global Edge Network for edge computing and caching to ensure fast global response times and meet 99.99% uptime SLAs. The post also emphasizes the benefits of Next.js's fast refresh for rapid iteration and Vercel's Preview Deployments for client collaboration, effectively acting as their DevOps department.
  30. Super serves thousands of domains from a single codebase with Next.js and Vercel | Customers | VercelThis post details how Super.so leverages Next.js and Vercel to serve over 15,000 custom domains from a single codebase. Key technical contributions include the programmatic management of custom domains using Vercel's Domains API, enabling users to add/remove domains and detect/update configurations in real-time. The post highlights the use of Incremental Static Regeneration (ISR) for performance and reduced database load, and Edge Middleware for custom routing and moving server-side logic to the edge. It also emphasizes Vercel's GitHub integration for automated deployments and preview URLs, and the ability to connect multiple domains to a single project.
  31. Behind the scenes of Vercel's infrastructure: Achieving optimal scalability and performanceThis post details Vercel's infrastructure for building and deploying serverless applications, focusing on the "build" and "request" phases. It explains the process of uploading project files, creating deployments via the CLI or Git integration, and the role of builders in transforming code into Vercel deployments. It highlights the provisioning of Vercel Functions, Edge Functions, and optimized images. The request phase is described as utilizing anycast routing to the nearest edge location, which then routes requests through a Kubernetes cluster and reverse proxy to determine the correct deployment and resource to serve, including handling static resources, Vercel Functions, and Edge Functions.
  32. Next.js Layouts RFC in 5 minutesThis post details the introduction of the `app` directory in Next.js, which redefines routing and layout management. Key features include folder-based routing, `page.js` for route UI, `layout.js` for shared and nested layouts, `loading.js` for Suspense-based loading states, `error.js` for error boundaries, and route groups for organizing routes without affecting URLs or opting out of layouts. The post demonstrates incremental adoption from the `pages` directory and provides code examples for creating routes, layouts, and handling nested structures.
  33. Build your own web frameworkThis post details how to build a custom React-based web framework using the Vercel Build Output API. It covers implementing features such as static file generation with hydration scripts, Incremental Static Regeneration (ISR) using Prerender Functions, Vercel Functions for dynamic rendering and data fetching, automatic image optimization, and Edge Caching. The post provides code examples for creating static HTML files and client bundles, and explains the structure of the output for Vercel deployment.
  34. Announcing the Build Output APIIntroduced the Build Output API, a file-system-based specification allowing any framework to build for Vercel and leverage Vercel's infrastructure primitives (Edge Functions, ISR, Image Optimization, etc.). Added `vercel build` to the CLI for local build debugging and inspection, and `vercel deploy --prebuilt` to decouple the build step from deployment, enabling deployment of pre-built outputs without sharing source code. This empowers framework authors to integrate Vercel's infrastructure primitives more easily.
  35. Vercel Edge Middleware: Dynamic at the speed of static (historical)This post announces the general availability of Vercel Edge Middleware for Next.js and its public beta for all frameworks. It highlights its ability to run before the Edge Network Cache for fast rewrites and redirects, enabling dynamic routing, experimentation (A/B testing, personalization), localization based on geolocation, and authentication at the edge. It also mentions the integration with Next.js 12.2 and provides examples for A/B testing, localization, and authentication.
  36. Zero Config DeploymentsIntroduced 'Zero Config' deployment approach, enabling automatic deployment of static websites and serverless functions for any framework or tool with a build script, without requiring `vercel.json` configuration. This applies to frontend stacks and backend functions placed in an `api` directory, supporting multiple languages mapped by file extension and dynamic routes.