Performance Budget
A performance budget is the one page contract that sits at the top of every design brief and spells out the exact speed targets the entire team must hit before the first wireframe leaves Figma. In 2026 that contract contains eight non negotiable lines. LCP must land under 2.5 seconds on a 4G connection. INP stays below 200 milliseconds on any tap or click. CLS never exceeds 0.1 and the best teams target 0.05. Page weight caps at 1.5MB for the marketing home. The JavaScript bundle never exceeds 200KB before the first interaction. Font budget limits to two weights with ruthless subsetting. Hero images compress below 200KB in modern formats. Third party scripts cap at two and both defer until after paint. Design brand and marketing leads sign the document in the first week. The budget then travels with every deck every critique and every handoff. It forces the team to name the trade off every time a stakeholder requests an extra font weight a hero video or a new marketing pixel. Without this contract teams treat performance as an engineering problem instead of the first and most visible brand decision. The visitor does not see typography first. They see the delay before the page feels like a page. That delay reads as quality or it reads as neglect. The performance budget makes sure the brand reads exactly as intended.
A performance budget is not a list of technical tasks handed to engineering after designs are approved. It is not a suggestion that gets waived when the brand team falls in love with three font weights. It is not a post launch optimization exercise or a spreadsheet updated quarterly by the performance team. It is not the job of frontend developers to rescue a brief that includes an 8MB autoplay video three analytics suites a chat widget and a heatmap tool. The moment the budget becomes an engineering document instead of a design and brand document the project has already failed. Marketing adds late stage widgets. Design ships unoptimized illustrations. Brand insists on custom typography that blocks render. The site launches at six seconds LCP and everyone points at the build team. That pattern repeats across hundreds of Series B SaaS companies in 2025 and early 2026. The budget only works when it carries authority from the first meeting and when exceptions get debated in the language of brand perception not render blocking resources.
Take the Linear marketing site in 2026 as the concrete example other teams study. Their performance budget signed in 2024 still governs every change. The document sets LCP target at 800 milliseconds, INP at 100 milliseconds, CLS at 0.01, total weight at 900KB and JS at 140KB. It allows exactly two fonts. It bans hero video and autoplay. It permits one deferred third party script on the home page. When the growth team requested an embedded video carousel in late 2025 the design lead brought the signed budget into the meeting and asked which element of the fast brand identity they were willing to trade away. The carousel became a lightweight CSS implementation instead. The site continues to paint in under 750 milliseconds on 4G and feels instant on every interaction. The product sells speed and the marketing site delivers the same experience without compromise. Vercel takes the same approach but layers in edge delivery targets that keep global TTFB in the low double digits. Their budget treats the entire marketing presence as a live demo of the platform. Stripe applies the budget across marketing dashboard and checkout so the rhythm never breaks. A premium payments brand cannot afford lag anywhere in the experience. Apple writes the most theatrical version of the budget. Their product pages ship dense photography rich scroll choreography and sophisticated animations yet still hit LCP under 2.5 seconds and often under 1.8 seconds. They achieve this by requiring hand optimized images at multiple densities, heavily subset fonts, animation budgets that get profiled with every change, and strict CLS prevention through reserved aspect ratios on every image and embed. Notion follows suit with their marketing pages staying under 1.2MB while showcasing their buttery smooth product. Figma ships their site with the same discipline they expect from the canvas inside the product. Anthropic keeps their AI product pages clean and fast to match the precision of their models. The opposite pattern appears in the typical B2B SaaS home page we audited last month. A 6.8MB hero video set to autoplay. Three font files totaling 680KB. Five third party scripts warming on load including CRM pixels heatmaps and multiple A B testers. No image dimensions declared. LCP at 6.2 seconds. INP at 650 milliseconds. CLS spiking to 0.28 when the chat widget shoves content. Bounce rate at 67 percent. After the team adopted the eight point budget they cut the video dropped to two fonts deferred four scripts optimized every asset and reserved space for embeds. The new LCP of 2.1 seconds and INP of 180 milliseconds dropped bounce by 24 points without changing a single visual element.
Bring a performance budget to every project that shapes how customers first experience the brand. That includes the marketing home every campaign landing page the pricing table and any new product announcement surface. Create the budget in the kickoff meeting. Set the numbers based on competitive landscape. Match Linear if you want to own the fast identity. Sign it before mood boards get presented. Reference it in every review. Defend every exception by explaining how the added weight changes the brand read from premium to mid market. Tell leadership that Linear loads in 800ms while the proposed hero video pushes you to 3.2s which positions the entire company as the sluggish alternative in the visitor gut. Use it when trust compounds in the first three seconds and when SERP and AI answer engines reward speed. Use it when bounce rate directly impacts pipeline and when paid traffic needs to convert instead of tab away. Skip the full formal budget only on internal admin tools where no customer eyeballs will see the interface or on pure experimental microsites built for a single week long campaign. Even in those cases the Core Web Vitals still matter for basic usability. A slow internal tool destroys employee momentum the same way a slow marketing site destroys customer trust. The budget simply scales to the stakes of the project.
Speed is the brand and a performance budget is how designers make sure they ship the right one on purpose.
Read the full guide
Related terms
Keep exploring
Core Web Vitals
Google's three measurable user-experience metrics for loading, interactivity, and visual stability that act as both a search ranking input and a design quality signal.
Design Tokens
The atomic design values (colors, spacing, typography, shadows, motion) stored as platform-agnostic variables that every component in a design system references.
Brand Consistency
The discipline of expressing a brand identity the same way across every format, platform, and interaction.