COMPARISON

import { defineAgent, defineTool, textResult } from '@fabrk/framework'

// Define a tool
const searchDocs = defineTool({
  name: 'search-docs',
  description: 'Search the documentation for a query',
  parameters: { query: { type: 'string', description: 'Search query' } },
  async execute({ query }) {
    const results = await vectorStore.search(query, { limit: 5 })
    return textResult(results.map(r => r.content).join('\n\n'))
  },
})

// Define the agent — framework handles the loop, streaming, and budget
export default defineAgent({
  model: 'claude-sonnet-4-5-20250514',
  systemPrompt: 'You are a docs assistant. Use search-docs to find relevant information.',
  tools: [searchDocs],
  budget: { daily: 5.0, perSession: 0.25 },
})

// Agent is automatically mounted at /agents/docs-assistant
// Client: import { useAgent } from '@fabrk/framework/client/use-agent'

import { streamText, tool } from 'ai'
import { anthropic } from '@ai-sdk/anthropic'
import { z } from 'zod'

// You define the route handler yourself
export async function POST(req: Request) {
  const { messages } = await req.json()

  // No built-in budget enforcement — add your own tracking
  // No agent loop — stream ends after one turn unless you build multi-turn

  const result = streamText({
    model: anthropic('claude-sonnet-4-5-20250514'),
    system: 'You are a docs assistant. Use searchDocs to find relevant information.',
    messages,
    tools: {
      searchDocs: tool({
        description: 'Search the documentation for a query',
        parameters: z.object({ query: z.string().describe('Search query') }),
        execute: async ({ query }) => {
          const results = await vectorStore.search(query, { limit: 5 })
          return results.map(r => r.content).join('\n\n')
        },
      }),
    },
    maxSteps: 5, // Tool loop — must opt in manually
  })

  return result.toDataStreamResponse()
}

// Client: useChat() from 'ai/react'
// Cost tracking: build your own middleware or use separate service
// Budget enforcement: build your own

import { StateGraph, MessagesAnnotation } from '@langchain/langgraph'
import { ChatAnthropic } from '@langchain/anthropic'
import { tool } from '@langchain/core/tools'
import { z } from 'zod'
import { ToolNode } from '@langchain/langgraph/prebuilt'

// Define the tool
const searchDocs = tool(
  async ({ query }) => {
    const results = await vectorStore.search(query, { limit: 5 })
    return results.map(r => r.content).join('\n\n')
  },
  {
    name: 'search_docs',
    description: 'Search the documentation for a query',
    schema: z.object({ query: z.string().describe('Search query') }),
  }
)

const model = new ChatAnthropic({ model: 'claude-sonnet-4-5-20250514' })
  .bindTools([searchDocs])

// Build the graph — powerful but verbose for simple agents
function shouldContinue({ messages }: typeof MessagesAnnotation.State) {
  const last = messages[messages.length - 1]
  return last.tool_calls?.length ? 'tools' : '__end__'
}

async function callModel(state: typeof MessagesAnnotation.State) {
  const response = await model.invoke(state.messages)
  return { messages: [response] }
}

const workflow = new StateGraph(MessagesAnnotation)
  .addNode('agent', callModel)
  .addNode('tools', new ToolNode([searchDocs]))
  .addEdge('__start__', 'agent')
  .addConditionalEdges('agent', shouldContinue)
  .addEdge('tools', 'agent')

export const graph = workflow.compile()

// Now you need to build: HTTP route, streaming, session management,
// budget enforcement, UI, and cost tracking — all separately

# Next.js + Vercel AI SDK
next                 — routing, SSR, RSC
ai (vercel AI SDK)  — streaming text, useChat hook
langchain/llamaindex — RAG (separate install)
stripe / resend / …  — payments, email (separate installs, manual wiring)
shadcn/ui            — UI components (separate install, copy-paste)
[No built-in cost tracking, budget, MCP, or agent testing]

# LangGraph
@langchain/langgraph  — agent orchestration (state machines)
@langchain/core       — tools, messages
[No web layer, no UI, no routing — bring your own everything]

# FABRK
@fabrk/framework      — Vite 7 runtime, routing, SSR, RSC streaming
                         defineAgent(), defineTool(), MCP server + client
                         agent loop, budget enforcement, cost tracking
                         dev dashboard (/__ai), agent testing framework
@fabrk/components     — 109+ UI components, 11 chart types, 18 themes
@fabrk/auth           — NextAuth, API keys (SHA-256), MFA (TOTP)
@fabrk/payments       — Stripe, Polar, Lemon Squeezy adapters
@fabrk/email          — Resend + console adapter, 4 templates
@fabrk/storage        — S3, Cloudflare R2, local filesystem
@fabrk/security       — CSRF, CSP, rate limiting, audit logging, GDPR
@fabrk/store-prisma   — 7 Prisma store adapters for production persistence