Next.js build taking too long on a Sanity site: causes and the fix
Next.js build taking too long on your Sanity site? Learn why static builds crawl, what slow deploys cost your team, and the fix path in order.
Tag
Performance
Web performance techniques for Next.js and Sanity — Core Web Vitals, LCP, INP, bundle size, and edge caching strategies.
57 posts
6 min read
Vercel bill too high on a Next.js site? What drives it and how to cut it
Vercel bill too high on your Next.js site? Here are the usual cost drivers on Sanity-backed builds, how to confirm each, and the fixes in order.
Sanity API bill spiking? Why requests explode on Next.js sites
Sanity API bill spiking on your Next.js site? Learn the usual causes of runaway requests, what ignoring it costs, and the fix path.
Next.js website audit: what a paid one covers and how to judge it
A Next.js website audit should end in a ranked fix list, not a PDF of scores. Here is what a paid performance and Sanity audit covers and how to judge it.
Fix Core Web Vitals on a Next.js + Sanity Site: Fix Order and Timeline
How to fix Core Web Vitals on a Next.js Sanity site: which metric fails and why, the order to fix it, and how long Search Console takes to go green.
Upgrade Next.js 15 to 16: What Breaks on Sanity Sites and What It Costs
How to upgrade Next.js 15 to 16 on a Sanity-backed site: what changed, typical breakages, the cost of staying behind, and effort by codebase size.
Next.js website maintenance cost: what a Sanity site runs per month
Next.js website maintenance cost for a Sanity site: monthly ranges for upgrades, Sanity and Vercel plans, monitoring and content support.
Sanity website slow? How to find the cause and what a fix costs
Sanity website slow on Next.js? Learn to tell GROQ waterfalls, uncached fetches, heavy images and bundle bloat apart, and what a fix engagement looks like.
Migrate Gatsby to Next.js App Router: what the path actually looks like
Gatsby's plugin ecosystem has stalled. Here's the real migration path to Next.js App Router, keeping Sanity, URL parity, and your editors sane.
Cloudinary vs Sanity CDN for Next.js Images: An Honest Comparison
Cloudinary vs Sanity CDN for Next.js image delivery — formats, transforms, pricing thresholds, and which to pick for your project.
Cloudflare Images Pricing 2026: Storage Limits, Delivery Costs & When to Upgrade
Cloudflare Images pricing breakdown: free tier limits, per-image storage costs, delivery fees, and when a Next.js or Sanity project should upgrade.
Vercel Blob Pricing 2026: Free Tier Limits, Storage Costs & When to Upgrade
Vercel Blob's Hobby tier gives you 1 GB of storage — here's exactly what storage, data transfer, and operations cost before and after you hit the limits.
Sanity vs Ghost for Next.js in 2026: An Honest Comparison
Sanity vs Ghost for Next.js projects: schema flexibility, pricing, editor experience, and API delivery compared with no vendor bias.
Cloudflare R2 Free Tier 2026: Limits, Pricing & Egress
Cloudflare R2 free tier: 10 GB storage, 1M Class A and 10M Class B operations a month, no egress fees. Paid rates, cost examples, and how it compares with S3.
Cloudflare Pages Pricing 2026: Free Tier Limits & Workers Paid
Cloudflare Pages free plan: 500 builds a month, 1 concurrent build. Pro is $20/month billed annually; Workers Paid starts at $5. What forces an upgrade in 2026.
Bunny Stream Pricing 2026: Storage, Delivery & Free Trial
Bunny Stream has a 14-day free trial, then pay-as-you-go storage and delivery with free encoding. 2026 rates, cost examples, and when Mux or Cloudinary fit.
Netlify Pricing 2026: Credit Plans, Free Tier & Bandwidth
Netlify moved new accounts to credit-based plans in Sept 2025: Free gets 300 credits, Personal is $9 and Pro is $20/month. What the free tier covers and costs.
Cloudinary Pricing 2026: Free Tier Limits, Transformation Costs & When to Upgrade
Cloudinary's free tier looks generous until transformations stack up. Real numbers on credits, paid plans, and what triggers an upgrade in 2026.
How I plan and ship web apps for startups: discovery to launch
A practical process for building web apps for startups — discovery brief, thin-slice milestones, staging from day one, and a launch checklist.
Next.js hosting cost in 2026: Vercel vs Netlify vs Railway vs VPS
What Next.js hosting actually costs in 2026 across Vercel, Netlify, Railway, Render, Fly, and a VPS — with real monthly figures and hidden cost traps.
Next.js in 2026: honest practitioner take on what's working and what isn't
Next.js in 2026 is more capable than ever — and more complicated. A practitioner's view on RSC, PPR, caching, and upgrade churn from production work.
How I build a Next.js Tailwind marketing site in hours, not days
A practical Next.js Tailwind workflow: design tokens as CSS variables, reusable component conventions, and a build sequence for shipping pages fast.
How I set up Next.js TypeScript for production from day one
A production next.js typescript setup: strict tsconfig, typed routes, Zod boundaries, safe env vars, and a CI type-check gate that catches real bugs.
How I structure React Next.js patterns across every client project
The React Next.js patterns I reuse on every project: server components by default, colocated data fetching, typed API boundaries, and error conventions.
Next.js 16 + Tailwind: create-next-app vs Starter Templates
Set up Next.js 16 with Tailwind CSS v4: the create-next-app flags that matter, and how the default setup compares with popular starter boilerplates over time.
Next.js as a backend: honest limits for production apps
Next.js route handlers and server actions work for many backend needs, but have real limits. Here's where they hold and where they break.
Hire a Next.js developer who can actually ship production
Vetting guide for founders and PMs: portfolio signals, App Router interview questions, Core Web Vitals checks, and real rate benchmarks for 2026.
The Next.js + React stack explained: what each layer does and when it's wrong
A practical guide to the Next React stack — React, Next.js, hosting, CMS, and styling — what each layer does, why this combination won, and when to walk away.
Next.js API routes vs route handlers: when to use each
Pages Router API routes vs App Router route handlers compared — caching, streaming, edge runtime, and a clear migration path with real code examples.
Vercel pricing 2026: what you actually pay for a real Next.js project
Hobby, Pro, and Enterprise Vercel pricing explained with real usage line items, per-seat maths, and a realistic monthly total for a mid-traffic marketing site.
Marketing website performance: what fast pages are actually worth
Marketing website performance affects conversions, ad ROI, and SEO rank. Here's what the numbers mean in business terms and what to demand from any build.
How I build a Next.js blog that stays fast at 100+ posts
Static generation, pagination, image handling, and bundle discipline for a Next.js blog that doesn't slow down as content grows. Practical code included.
How to choose a CMS for SEO: rendering, structured data, and Core Web Vitals
Pick the right SEO CMS by understanding rendering strategy, structured data support, sitemap control, and editorial workflow. A practical guide for 2026.
Hire a web designer: what performance-aware buyers should check first
Thinking about hiring a web designer? This guide covers portfolio signals, performance questions, and the designer vs developer trade-off. Read before you sign.
Tailwind CSS in 2026: what actually changed for teams
Tailwind CSS v4 rewired how teams configure, share, and ship styles. Here's what the CSS-first engine means in practice.
Sanity video hosting in 2026: Mux vs Cloudinary vs Bunny Stream
Comparing Mux, Cloudinary, and Bunny Stream for sanity video hosting — upload workflow, adaptive streaming, pricing, and LCP poster handling.
Sanity image-url hotspot not working: four causes and fixes
Sanity hotspot not applying to your rendered image? Here are the four real causes and exact fixes for each one.
Sanity Embeddings: Semantic Search in a Next.js App Router Site
Step-by-step guide to indexing Sanity content with native Embeddings, running a semantic query, and wiring a debounced search UI in Next.js App Router.
Sanity + Mux Signed HLS Video Playback in Next.js
Step-by-step guide to Sanity Mux video playback in Next.js: signed URLs, hls.js adaptive streaming, poster images, and LCP optimisation.
Tailwind CSS v3 to v4 Migration Guide: Next.js Steps & Gotchas
Tailwind v4 migration in Next.js, step by step: the upgrade codemod, CSS-based @theme config, dropped utilities like bg-opacity-*, PostCSS changes, and production gotchas.
Advanced GROQ Queries: Joins, Coalesce & Array Flattening
Deep dive into advanced GROQ queries in Sanity: inline joins, the coalesce() function, conditional projections, and array flattening with real payload sizes measured.
Next.js Partial Prerendering (PPR) in Production: What Works
An honest look at Next.js partial prerendering PPR in production — what it solves, where it breaks, and which page patterns benefit most.
Next.js Bundle Size: Analyzing and Cutting Chunk Bloat
A practical walkthrough of Next.js bundle size analysis with the Turbopack Bundle Analyzer or @next/bundle-analyzer, and the fixes that usually shrink first-load JS.
Mux Video in Next.js + Sanity CMS: Upload & Playback Guide
Step-by-step guide to Mux video hosting in Next.js and Sanity CMS: sanity-plugin-mux-input setup, direct uploads, signed playback URLs, and poster images for fast LCP.
Core Web Vitals Monitoring in Next.js with Vercel Analytics
A practical guide to wiring up Vercel Analytics and @vercel/speed-insights/next for real-user Core Web Vitals monitoring in Next.js, with a workflow for catching regressions fast.
Next.js App Router Tutorial 2026: Pages Router to Production
A practical Next.js App Router tutorial guide for 2026. Covers layouts, route groups, Server Components, data fetching, static export, and the metadata API.
Sanity Studio Bloat: Audit & Prune Unused Document Types
A step-by-step approach to identifying orphaned Sanity schemas, measuring Studio bundle impact, and safely removing dead document types without breaking production.
GROQ Conditional Projections: Cut Query Payload by 60%
A pattern for projecting only the fields your Next.js components actually render, using GROQ's select() and type filters to prune unused blocks from a union array.
Avoiding N+1 Queries: Modeling Sanity References in RSC
A pattern for structuring Sanity references and GROQ projections that eliminates query waterfalls in server components by resolving references in a single round-trip.
Sanity Image Placeholders Under 50 kB: Palette, Not Base64 LQIP
Cut LQIP overhead on Sanity + Next.js sites to nearly zero using Sanity's built-in metadata.palette instead of inline Base64 blur data. Exact GROQ and component code.
Multi-Locale Navigation in Sanity Without Bloating Queries
A singleton pattern for i18n navigation that keeps GROQ queries fast, using dynamic field access (field[$param]) instead of string interpolation.
Structuring Sanity Schemas to Avoid Query Waterfalls
Denormalising references and embedding common fields in Sanity schemas keeps list queries lean and fast in Next.js server components. Here's the pattern I ship.
Next.js TTFB Optimization: Sub-200ms with PPR, Edge & Sanity
Next.js TTFB optimization in practice: Partial Prerendering for the shell, cached and streamed dynamic fragments, and tight GROQ projections — with illustrative before/after targets.
Cutting Next.js Bundle Size: Server-Render and Lazy-Load Portable Text
Portable Text can bloat client bundles when it renders inside a client component. Here's how to keep it in Server Components, lazy-load only the heavy interactive blocks, and where lazy-loading trades away SEO visibility.
INP for React Apps: Profiling and Eliminating Long Tasks
INP is responsiveness. Learn how to find long tasks, profile React re-renders, reduce main-thread work, and ship fast interactions consistently.
How to Fix LCP on Image-Heavy Pages (Next.js Patterns That Work)
LCP is usually one big image. Here’s how to identify the true LCP element, reduce TTFB, ship the right image bytes, and consistently hit <2.5s on real devices.
Core Web Vitals in 2026: Thresholds, Ranking Impact & Fixes
Core Web Vitals 2026 explained: LCP, INP, and CLS thresholds, how much they really affect Google rankings, field vs lab data, and the fixes that consistently move each metric.