SanityArtificial IntelligenceProgramming

How Sanity Agent Rules Solved the Vibe Coding Quality Problem

AI coding assistants generate Sanity code fast but without guardrails, leading to "vibe coded" implementations with technical debt. Sanity Agent Rules enforce best practices.

10 min read
Abstract illustration of AI agents following structured rules to generate high-quality code

Let's talk about "vibe coding". Every developer from entry level to principle architects are doing it. Project managers are doing it. CEOs are doing it. Everyone is experimenting with it. That means the agency you hired to build your multi million dollar enterprise website is doing it. They write code fast... Really fast. Sometimes that code even works. But working and well-built are different things.

Oh right. Of course I do it. To be honest, developers have used coding assistants since the late 90s with Intelligence and code completion. This is absolutely different, let's not pretend it isn't... Although it still is pattern matching... I won't get into it here.

Anyways, I've spent the last few months using Claude Code and Cursor to build Sanity projects for clients. The speed is remarkable. The quality has been inconsistent. When you hit a wall it can be incredibly frustrating. You want to scream at the Agent RTFM! (I often do).

Then we started using Sanity Agent Rules.

The Vibe Coding Problem

AI agents are exceptional at pattern matching. Show them a few examples of Sanity schema definitions and they'll generate something that deploys without errors. But they don't know the accumulated wisdom that comes from implementing dozens of projects, debugging performance issues at scale, or maintaining systems five years after launch.

Here's what I kept seeing in AI-generated code:

A GROQ query that works perfectly with 100 documents but crawls when you hit 10,000. The agent used a -> join operator inside a filter expression because it saw that pattern somewhere and it compiled without errors. The performance implications only surface months later.

A schema with beautiful, descriptive field names like blueHighlightBox that becomes a maintenance nightmare when the design changes and suddenly highlights are green. The agent didn't understand the fundamental principle of separating content from presentation.

An image field missing hotspot: true configuration. The agent didn't know this is how you enable focal point cropping. Six months later when the marketing team wants hero images that work across mobile and desktop, you're migrating production data.

These aren't catastrophic failures. They're the kind of technical debt that accumulates quietly until you're spending half your sprint fixing things that should have been right from the start.

The Foundation We Built

Sanity released their Agent Toolkit in January 2026. It's a collection of rules and best practices packaged specifically for AI agents to consume. Think of it as documentation written for machines rather than humans.

The toolkit includes over 20 rule files covering everything from schema design to GROQ query optimization to framework-specific integration patterns. Each rule follows a consistent structure: explain the problem, show the wrong approach, demonstrate the right pattern.

When we installed these rules in our Claude Code and Cursor environments, something shifted. The agents stopped improvising and started following patterns we'd refined through years of production experience.

The rules cover critical areas that agents consistently got wrong:

Schema design patterns that enforce separation of content and presentation, proper field naming conventions, and reusable type definitions.

GROQ optimization including the golden rule to never use -> in filter expressions, proper projection syntax to minimize data transfer, and fragment reuse for complex queries.

Visual Editing configuration with proper Content Source Maps setup, stega string handling, and Presentation Tool wiring.

Framework integrations with specific patterns for Next.js App Router, Remix loaders, SvelteKit hooks, and other frameworks we build with regularly.

Migration strategies for bringing content from legacy systems without corrupting data structures or losing semantic meaning.

This isn't theoretical guidance. These are the patterns we've refined through actual client implementations, production debugging sessions, and performance optimization work.

How It Works in Practice

The Agent Skills format is an open standard that works across multiple AI coding tools. Install the rules once and they're available whenever your agent needs them.

For Claude Code users, the installation is straightforward:

bash
/plugin marketplace add sanity-io/agent-toolkit
/plugin install sanity-plugin@sanity-agent-toolkit


For Cursor and VS Code users working with the MCP server:

bash
npx sanity@latest mcp configure

Once installed, the agent references these rules automatically when writing Sanity code. You don't need to prompt it to follow best practices. The rules become the source of truth the agent consults.

When you ask the agent to create a page builder schema, it knows to use inline objects for content blocks rather than references, includes proper preview configuration, and sets up array validation correctly. When you request a GROQ query for recent blog posts, it structures the projection to fetch only needed fields and avoids performance-killing join patterns.

The difference is like working with a junior developer who's read the documentation versus one who's learned from senior engineers who've been through multiple production cycles.

Where This Saved Us Time

Let me give you concrete examples from recent client work.

Case 1: E-commerce Product Schema

We were building a headless commerce site with complex product variations. I asked Claude Code to create the product schema with variant support.

Without agent rules, the first attempt used separate document types for products and variants with references between them. This creates N+1 query problems when loading product pages and complicates inventory management.

With agent rules loaded, the schema used inline objects for variants with proper parent-child relationships. The structure matched Sanity's recommended patterns for product catalogs. What would have required a refactoring conversation and schema migration was right from the first generation.

Time saved: 4 hours of schema redesign and migration work.

Case 2: Content Migration from WordPress

A client needed 5,000 blog posts migrated from WordPress to Sanity. The agent generated migration scripts to handle the import.

The initial version without rules created portable text blocks but didn't handle WordPress shortcodes properly, missed semantic heading structures, and dropped custom field metadata.

After loading the migration rules, the agent understood how to preserve heading hierarchy, transform shortcodes into custom Sanity blocks, and map WordPress custom fields to properly structured Sanity objects. The migration quality improved dramatically.

Time saved: 12+ hours of manual content cleanup and re-migration cycles.

Case 3: Visual Editing Setup for Next.js

Visual Editing is powerful but has specific configuration requirements. The agent needed to set up loaders, configure stega encoding, and wire up the Presentation Tool.

Without rules, it missed the studioUrl configuration, didn't strip stega strings from OpenGraph images, and configured the loaders inconsistently across different page types.

With rules loaded, the setup followed Sanity's documented patterns exactly. Everything worked on first deployment. The client could see their content changes in real-time immediately.

Time saved: 6 hours of debugging why preview mode wasn't working correctly.

Case 4: Performance Optimization

A client's editorial dashboard was loading slowly. The agent helped optimize GROQ queries.

The original queries used *[_type == "post" && category->slug.current == $slug] patterns extensively. Each query was doing unnecessary joins to resolve category references.

The agent rules taught it to restructure as *[_type == "post" && category._ref == $categoryId], comparing the reference ID directly. Query performance improved by 3-4x on their dataset of 50,000+ documents.

Time saved: Multiple optimization cycles that would have required manual query analysis and testing.

The Issues We Prevented

Beyond time savings, agent rules prevented entire categories of problems from reaching production:

Array Items Without Keys: The rules enforce that all array items include stable _key values. Without this, reordering content blocks or updating specific items becomes unreliable. We would have discovered this bug months later when editors complained about content blocks randomly reordering.

Image Hotspot Configuration: Every image field now includes hotspot: true and crop: true automatically. This enables focal point selection and responsive cropping. Without it, we'd be migrating schemas later when the client needs better image control.

Schema Field Deprecation: When removing fields, the rules teach proper deprecation patterns with hidden: true and deprecated: {reason: "..."} rather than immediate deletion. This prevents data loss and gives editors time to migrate content.

GROQ Projection Specificity: The "only request what you need" principle is enforced consistently. This prevents queries from fetching entire documents when only a title and date are needed, keeping response payloads minimal.

TypeScript Type Safety: Proper use of defineType, defineField, and defineArrayMember ensures TypeGen can generate accurate types. This prevents runtime errors from type mismatches that would be caught during development.

These aren't hypothetical concerns. These are issues we've debugged in production systems over the years. The rules prevent them from being introduced in the first place.

The Business Value

Here's what this means for our clients:

Faster delivery: Projects that would have taken 8 weeks with traditional development and multiple revision cycles are shipping in 5-6 weeks with higher initial quality. The agent generates production-ready code on first pass more consistently.

Better budget efficiency: Less time fixing preventable issues means more budget available for actual feature development. Clients get more value from the same investment.

Sustained velocity: Projects maintain development speed through later phases because the foundation is solid. There's no technical debt tax that slows everything down six months in.

Lower maintenance costs: Code that follows best practices from the start requires less ongoing maintenance. Future developers (human or AI) can understand and modify the system more easily.

This is the practical answer to the old project management triangle: you can't have it fast, cheap, and good. Pick two.

Agent rules break that constraint. With AI agents guided by accumulated expertise, you actually can deliver faster, within tighter budgets, with higher quality outcomes. The speed comes from automation. The quality comes from codified best practices. The budget efficiency comes from not paying to fix preventable mistakes.

Looking Forward

I've built on every major CMS platform over the past three decades. I've watched the industry cycle through different promises about how technology will make development faster and cheaper. Most of those promises crashed against the complexity of production systems.

AI coding assistants are different, but only if they're guided by real expertise. Raw AI generation is vibe coding at scale. It produces code that compiles and sometimes even deploys. But production systems require deeper knowledge.

Sanity's Agent Rules capture that deeper knowledge in a format machines can consume. The rules aren't complete and they'll evolve as platforms and best practices change. But they represent something important: the accumulated wisdom of teams who've built these systems repeatedly, debugged them at scale, and maintained them long-term.

For teams using AI coding assistants to build Sanity projects, these rules are essential. They're the difference between code that works today and code that works three years from now when someone else is maintaining it.

That's the foundation you want to build on. Not clever improvisation, but proven patterns refined through production experience. The same standards I'd hold a senior developer to, now available to guide AI agents.

Install the rules. Build something solid. Your future self will thank you.

Getting Started with Sanity Agent Rules:

Want to see how Sanity Agent Rules can improve your development workflow? Contact HT Blue to discuss your next project.

SanityAI agentsAgent SkillsDeveloper experienceGROQSchema designVisual EditingHeadless CMSPerformance optimization
Danny-William
The Arch of the North

Sr Solution Platform Architect

HT Blue