October 2024 Summaries

Code and Theory, a leading technology and creative agency, has partnered with Vercel to help news organizations build high-performing websites that can handle massive traffic surges during major events. By leveraging Next.js and Vercel's managed platform, clients like RealClearPolitics and Minnesota Star Tribune have experienced improved website performance, easier content management, faster deployments, and reduced reliance on DevOps resources. The combination of Next.js and Vercel ensures that news websites can deliver instant loading times, effortless scalability, and reliable uptime even during peak demand.

Hive is a low-level untrusted and ephemeral compute platform designed by Vercel to securely manage and run builds efficiently. Since November 2023, it has been powering Vercel's builds, resulting in enhanced build machines and a 30% improvement in build performance. Hive is architected to handle multiple use cases and can be composed in different ways depending on the requirements. It operates on the fundamental assumption that potentially malicious code will be executed on multi-tenant machines, requiring it to be safe, reliable, performant, and cost-effective. Inside Hive, there are several key components working together to handle everything from code execution to scaling. These include hives (clusters running in a specific region), boxes (bare metal machines that run the virtual machines in Hive), cells (virtual machines inside each box), control plane (orchestrates the cluster and manages job placement, autoscaling, instance lifecycles, monitoring, and overall cluster health), and API (manages requests to run cells). The inner workings of Hive involve an orchestrated system that ensures secure, isolated, and efficient execution of customer builds. At the core, each box in Hive runs a Kernel-based Virtual Machine (KVM) which is a full virtualization solution for Linux on x86 hardware. On top of this KVM layer, multiple Firecracker processes are run, creating microVMs called cells. The life of a build involves the build pipeline selecting the appropriate hive cluster based on the customer and build configuration. It uses the Hive API to run the build inside a container within a cell. The overall architecture allows Hive to balance secure isolation, fast startup times, and scalability required for customer builds while minimizing overhead and optimizing performance. Since adopting Hive, there has been a 20% reduction in build times compared to the previous solution, with provisioning times dropping from nearly 90 seconds to 5 seconds and build times decreasing by 40%. The platform continues to improve and explore new use cases to unlock more value for developers.

Next.js Conf 2024 took place in San Francisco, with over 1,000 attendees and tens of thousands watching online. The event highlighted recent updates to the framework, including five new versions released since last year's conference, over 7 million weekly downloads, and a growing community of contributors. Key improvements discussed include refinements to data fetching and rendering with App Router, Turbopack for development becoming stable, and simplified caching features. The event also emphasized the importance of open-source contributions and community support in driving Next.js forward.

Svelte 5 introduces runes for universal reactivity, snippets for reusable markup, and compiler improvements. The release includes new runes like $state, $derived, and $effect to manage state and its dependencies within components. It also offers signals and fine-grained reactivity, universal reactivity with .svelte.js files, other runes that simplify common tasks, and compiler improvements for better performance and reduced bundle sizes. Additionally, Svelte 5 introduces snippets for reusable markup and logic within a component, native TypeScript support, and benefits from Vite's growing ecosystem.

Prompt engineering is crucial when using v0, a powerful tool for generating high-quality UIs and code. To get the best results, users should provide detailed prompts that include desired functionality, design preferences, libraries or frameworks to use, and context or use case for the component within their app. V0 excels in UI generation, third-party library support, fetching data from external sources, fonts and styling, 3D graphics, integration with Next.js, technical planning, and frontend development support. It can generate advanced React and Next.js features, provide thorough explanations for complex tasks, and even test simple JavaScript snippets within its chat interface.

Vercel, a platform for deploying and hosting web applications, has successfully implemented microfrontends to improve developer velocity while maintaining smooth user experience. By shifting from a single large Next.js application serving both website visitors and logged-in users, Vercel adopted vertical microfrontends, leading to a 40% improvement in preview build times and local development compilation. This approach also streamlined dependencies, reduced page weight, and boosted end-user performance. The company leveraged Turborepo for optimizing tasks and used Next.js Multi-Zones feature to support vertical microfrontends. Vercel's adoption of microfrontends has greatly improved developer velocity and cut build times, enabling teams to work more independently while staying aligned through shared packages.

The BNP Paribas Open, a prestigious tennis tournament held annually in Indian Wells, California, underwent a significant digital upgrade to enhance its global audience's experience. The marketing team recognized the need for a transformation as their website and mobile app were operating on separate CMS platforms, causing inconsistencies across digital touchpoints. Work & Co was chosen as the digital design and technology partner due to its track record with partners like Apple and Gatorade. Vercel was selected to power the BNP Paribas Open's frontend transformation for scalability, performance, rapid development, deployment agility, and an integrated ecosystem. The new platform successfully managed millions of users during the tournament, improving page load times, user engagement, SEO rankings, and personalized content experiences.

Vercel's philosophy on AI-native development emphasizes the use of evals, which are like end-to-end tests for AI and other probabilistic systems. These evals assess output quality against defined criteria using automated checks, human judgment, and AI-assisted grading. The three primary types of evals include code-based grading, human grading, and LLM-based grading. Evals are essential in the development of AI applications as they help navigate the complexities introduced by probabilistic behavior and provide continuous feedback for improvement. Vercel's v0 is built on eval-driven development, which has proven effective in maintaining quality and driving continuous improvement based on real-world feedback.

v0 is an AI-powered generative UI system that helps teams of all sizes generate functional code and user interfaces from best practices. It offers security features like SSO and data training controls, allowing for secure collaboration and sharing of knowledge across the team. With plans starting at $30 per user per month, v0 can help teams ship faster by elevating everyone's abilities in coding, designing, or strategizing. The Enterprise plan provides additional benefits such as higher rate limits and priority access.

The text introduces an AI-powered generative UI system called v0 that helps teams create functional code and user interfaces from best practices. It is now available to teams of all sizes with plans designed for collaboration, security, and scalability. Key features include SSO, data training controls, higher rate limits, and priority access. The v0 Team plan starts at $30 per user per month, while the Enterprise plan offers additional security features and a collaboration-centric workflow.

React Three Fiber (R3F) is a powerful tool for creating stunning 3D scenes on the web using React's component-based architecture. It simplifies building complex environments, animations, and interactive scenes even without expertise in math or physics. R3F supports v0, an AI-powered development assistant that enables users to incorporate 3D designs into their projects through natural language interaction. Key aspects of 3D development include organizing the scene, using basic shapes like spheres, boxes, and planes, defining meshes and materials, ensuring accessibility, working with advanced features such as importing GLB files, choosing cameras and lighting, enhancing scenes with environment maps, adding controls for user interaction, blending 3D elements with HTML and CSS, and applying postprocessing effects. With R3F and v0, users can create immersive and interactive 3D experiences on the web.

Emburse, a company managing travel and expense for over 12 million users across 120 countries, has significantly improved its website performance by partnering with Rangle, a leading digital transformation consultancy. Together, they implemented Vercel, Next.js, and Sanity to address key concerns for the marketing team, such as high costs, complexity, and inability to keep up with performance needs. The new technology stack allows for faster campaign launches, site updates, and supports essential localization features. Emburse's website now outperforms 99% of global sites, loading 4x faster than their previous site.

ChatPRD, an AI co-pilot for product managers, has scaled to 20,000 users in just a few months using the Vercel stack. Founder Claire Vo built the platform from scratch and focused on developing its core functionalities with the help of Vercel's infrastructure and logging tools. The AI SDK provided by Vercel simplified the implementation of streaming responses and generative UI components, significantly improving user experience and accelerating ChatPRD's time to market.

Chatbase, an AI platform that helps companies build chat-based agents for customer support, sales, and lead generation, has achieved significant growth in just 1.5 years, reaching over 500K monthly visitors and $4M ARR. The company attributes its success to its tech stack, which includes Vercel's AI SDK, Next.js, and other tools that enable rapid iteration, customization, and deployment of AI-driven features. By leveraging these technologies, Chatbase can focus on innovation and stay ahead in the competitive market.

The Vercel Marketplace for integrations has been successful in increasing signups for partner platforms like Supabase. Supabase's integration on the marketplace offers a seamless onboarding experience, allowing developers to easily set up and manage databases directly from the Vercel CLI or dashboard. Since its launch, Supabase has seen a significant increase in new signups, making it their largest partner channel. The benefits of Vercel Marketplace integrations include ease of use, frictionless onboarding, and integrated billing. Supabase's adoption by Vercel's developer base has accelerated due to the seamless integration and reduced setup time.

Ledger, a leading provider of hardware wallets, has successfully scaled its Web3 traffic with Next.js and Vercel, resulting in 100x more releases and 67% quicker load times. The company's previous reliance on Shopify Liquid presented challenges in implementing engineering best practices and synchronizing releases across multiple repositories. By adopting a serverless-first architecture with Next.js and Vercel, Ledger has achieved improved performance, faster deployment, and enhanced developer experience. This strategic move has enabled the company to respond rapidly to market changes and deliver a consistently smooth user experience in the volatile crypto market.

Vercel has introduced a new version of its serverless functions with support for in-function concurrency, offering significant efficiency improvements and cost reductions. The product is optimized specifically for interactive workloads such as server-rendering of web pages, APIs, and AI applications. In-function concurrency allows a single function instance to handle multiple calls simultaneously, potentially cutting costs by up to 50%. Vercel's private beta customers have reported efficiency improvements with some seeing up to a 50% reduction in compute usage. The new architecture enables automatic scaling, maintenance handling, and transparent security updates for operating system and runtime without any downtime or work for users.

Vercel has introduced a new version of its serverless functions with support for in-function concurrency, offering significant efficiency improvements and cost reductions. The product is optimized specifically for interactive workloads such as server-rendering of web pages, APIs, and AI applications. In-function concurrency allows a single function instance to handle multiple calls simultaneously, potentially cutting costs by up to 50%. Vercel's private beta customers have reported efficiency improvements with some seeing up to a 50% reduction in compute usage. The new architecture enables automatic scaling, maintenance handling, and transparent security updates for operating system and runtime without any downtime or work for users.

Vercel has introduced a new version of Vercel Functions with in-function concurrency, designed to optimize the efficiency of serverless computing by allowing a single function instance to handle multiple calls simultaneously. This development aims to significantly reduce compute usage and costs, by up to 50%, without impacting latency, making it particularly beneficial for interactive workloads such as server-rendering, APIs, and AI applications. The initiative stems from Vercel's exploration of alternatives to AWS Lambda, which struggled with dynamic workloads due to its one-to-one invocation model. By rewriting the runtime in Rust and establishing a new architecture, Vercel enables serverless functions to better utilize Node.js' concurrency capabilities, thus minimizing idle compute time. This approach has shown promising results among beta users, including Verse, which reported substantial efficiency gains and cost reductions. The feature is now in public beta for Pro and Enterprise customers, with the potential to enhance the efficiency of serverless computing while maintaining the automatic scaling and maintenance-free benefits of Vercel Functions.

Vercel has introduced new capabilities for its Web Application Firewall (WAF), including persistent actions, rate limiting, and a Firewall API. These enhancements aim to reduce the effects of DDoS attacks and improve traffic control. Persistent actions allow rules to be applied across all matching requests for a customizable duration, while rate limiting sets request limits on specific endpoints to prevent abuse. The Firewall API enables programmatic control over WAF settings, allowing for automation and integration with third-party tools. These improvements enable Vercel customers to better serve desired traffic while taking action against malicious behavior.