Exploring Agentic Frameworks

What Are Agentic Frameworks?

Agentic Frameworks are software platforms that simplify creating, deploying, and managing AI agents. They provide pre-built building blocks so you can focus on business logic instead of building from scratch.

Why Do We Need Frameworks?

AI Agent frameworks differ from traditional AI frameworks in that they enable:

• Agent Collaboration: Allow multiple agents to work together
• Task Automation: Automate complex, multi-step workflows
• Contextual Understanding: Agents understand context and adapt to changing environments

Comparing 4 Key Frameworks

1. Vercel AI SDK

A powerful TypeScript SDK with built-in React/Next.js integration. Focused on streaming, structured output, and tool calling.

import { generateText, tool } from "ai";
import { openai } from "@ai-sdk/openai";
import { z } from "zod";

const result = await generateText({
  model: openai("gpt-4o-mini"),
  tools: {
    weather: tool({
      description: "Get weather information",
      parameters: z.object({
        city: z.string().describe("City name")
      }),
      execute: async ({ city }) => {
        return { city, temp: "25°C", condition: "Sunny" };
      }
    })
  },
  maxSteps: 5, // Agent can call tools up to 5 times
  prompt: "What's the weather in Tokyo today?"
});

Pros:

• TypeScript-first, type-safe
• Excellent streaming UI components
• Built-in Next.js/React integration
• Multi-provider (OpenAI, Anthropic, Google, etc.)

Best for: Web apps, real-time chat, streaming UI

2. LangChain.js

The most popular framework for LLM applications. Massive ecosystem with chains, agents, memory, and integrations.

import { ChatOpenAI } from "@langchain/openai";
import { AgentExecutor, createOpenAIFunctionsAgent } from "langchain/agents";
import { DynamicTool } from "@langchain/core/tools";

const model = new ChatOpenAI({ modelName: "gpt-4o-mini" });

const tools = [
  new DynamicTool({
    name: "search",
    description: "Search for information on the internet",
    func: async (query: string) => {
      return `Results for: ${query}`;
    }
  })
];

const agent = await createOpenAIFunctionsAgent({
  llm: model,
  tools,
  prompt: "You are a helpful assistant. Use tools to answer questions."
});

const executor = new AgentExecutor({ agent, tools });
const result = await executor.invoke({
  input: "Find flight prices to Tokyo"
});

Pros:

• Massive ecosystem (100+ integrations)
• Chains for complex workflows
• Built-in RAG pipeline
• Large community, many examples

Best for: Complex pipelines, RAG, data processing

3. LangGraph

A graph-based framework from the LangChain team. Its power lies in branching, loops, and state management — completely different from a linear pipeline.

Actual LangGraph flow:

          ┌─────────┐
          │  Start   │
          └────┬─────┘
               │
          ┌────▼─────┐
     ┌────│ Research  │────┐
     │    └──────────┘     │
     │                     │
┌────▼─────┐        ┌─────▼────┐
│ Web Search│        │ DB Query │   ← Parallel branches
└────┬─────┘        └─────┬────┘
     │                     │
     └──────┬──────────────┘
            │
       ┌────▼─────┐
       │ Evaluate  │◄─────────┐
       └────┬─────┘           │
            │                 │
      ┌─────▼──────┐         │
      │ Good enough?│         │  ← Loop: retry if not good enough
      └──┬──────┬──┘         │
    Yes  │      │  No         │
         │      └─────────────┘
    ┌────▼─────┐
    │ Generate  │
    │  Report   │
    └──────────┘

import { StateGraph, Annotation, END } from "@langchain/langgraph";
import { ChatOpenAI } from "@langchain/openai";

const AgentState = Annotation.Root({
  messages: Annotation<BaseMessage[]>({ reducer: (a, b) => [...a, ...b] }),
  searchResults: Annotation<string[]>({ reducer: (a, b) => [...a, ...b] }),
  quality: Annotation<number>(),
  retryCount: Annotation<number>()
});

async function research(state: typeof AgentState.State) {
  // Call multiple sources in parallel inside the node
  const [webResults, dbResults] = await Promise.all([
    searchWeb(state.messages), queryDB(state.messages)
  ]);
  return { searchResults: [...webResults, ...dbResults] };
}

async function evaluate(state: typeof AgentState.State) {
  const model = new ChatOpenAI({ modelName: "gpt-4o" });
  const score = await model.invoke(`Rate quality 1-10: ${state.searchResults}`);
  return { quality: Number(score), retryCount: state.retryCount + 1 };
}

// ROUTING: this is the key difference — conditional branching + loop
function decideNext(state: typeof AgentState.State) {
  if (state.quality >= 7) return "generate";     // ✅ Good enough → generate
  if (state.retryCount >= 3) return "generate";   // ⚠️ Max retries → generate anyway
  return "research";                               // 🔄 Loop back to research
}

const workflow = new StateGraph(AgentState)
  .addNode("research", research)
  .addNode("evaluate", evaluate)
  .addNode("generate", generateReport)
  .addEdge("__start__", "research")
  .addEdge("research", "evaluate")
  // Conditional edges: branch based on state
  .addConditionalEdges("evaluate", decideNext, {
    research: "research",    // Loop back
    generate: "generate"     // Move forward
  })
  .addEdge("generate", END);

const app = workflow.compile();
const result = await app.invoke({
  messages: ["Research AI trends 2025"],
  retryCount: 0
});

Pros:

• Branching: Branch based on results — not a straight line
• Loops: Auto-retry until quality is good enough
• Stateful: All nodes read/write shared state (quality, retryCount…)
• Persistence: Checkpoint state, resume after crashes
• Human-in-the-loop: Insert human approval nodes anywhere in the graph

Best for: Agent workflows needing conditional logic, loops, and error recovery

4. CrewAI (Python)

Framework specialized for multi-agent systems. Each agent has its own role, goal, and backstory.

from crewai import Agent, Task, Crew

# Create agents with specific roles
researcher = Agent(
    role="Senior Researcher",
    goal="Find accurate information about AI trends",
    backstory="You are a top AI researcher...",
    tools=[search_tool],
    llm="gpt-4o-mini"
)

writer = Agent(
    role="Content Writer",
    goal="Write engaging blog posts from research",
    backstory="You are a skilled tech writer...",
    llm="gpt-4o-mini"
)

# Create tasks
research_task = Task(
    description="Research top 5 AI Agent trends in 2025",
    agent=researcher,
    expected_output="Detailed report on 5 trends"
)

write_task = Task(
    description="Write a blog post from research",
    agent=writer,
    expected_output="500-word blog post"
)

# Crew = team of agents
crew = Crew(
    agents=[researcher, writer],
    tasks=[research_task, write_task],
    verbose=True
)

result = crew.kickoff()

Pros:

• Powerful multi-agent collaboration
• Role-based agent design
• Process orchestration (sequential, hierarchical)
• Easy for beginners to understand

Best for: Multi-agent workflows, content pipelines, research automation

Comparison Table

Criteria	Vercel AI SDK	LangChain.js	LangGraph	CrewAI
Language	TypeScript	TypeScript/Python	TypeScript/Python	Python
Focus	Streaming UI + Tools	Chains + Agents	Stateful Graphs	Multi-Agent
Learning curve	Low	Medium	High	Low
Multi-agent	Basic	Yes	Yes (graph nodes)	Specialized
Streaming	Excellent	Good	Good	No
State management	Basic	Basic	Excellent	Basic
Ecosystem	Vercel/Next.js	Very large	LangChain	Growing
Production-ready	✅	✅	✅	⚠️

Which Framework to Choose?

Need streaming UI + Next.js?         → Vercel AI SDK
Need common RAG pipelines?           → LangChain.js
Need state machines, loops, branching? → LangGraph
Need multiple agents collaborating?  → CrewAI
Quick prototyping?                   → Vercel AI SDK
Enterprise, complex control flow?    → LangGraph

Summary

• Vercel AI SDK is the best choice for TypeScript developers building web apps
• LangChain.js excels when you need many integrations and complex pipelines
• LangGraph is the strongest for stateful agents with conditional logic and loops
• CrewAI is excellent for multi-agent collaboration
• In this series, we’ll primarily use Vercel AI SDK (TypeScript) and CrewAI (Python)