perfagent

# PerfAgent - AI-Powered Web Performance Analysis

PerfAgent is an advanced web performance analysis tool that leverages AI to help
developers analyze and optimize their web applications. It provides detailed
insights into Core Web Vitals and other performance metrics through interactive
visualizations and AI-assisted recommendations.

## Features

- **AI-Powered Analysis**: Utilizes large language models to analyze performance
  traces and provide actionable insights.
- **Performance Visualization**:
  - Flame graph visualization for CPU profile analysis
  - Network waterfall charts for request timing analysis
  - Interactive timeline views for user interactions
- **Core Web Vitals Analysis**: Comprehensive analysis of LCP, INP, CLS, and
  other performance metrics.
- **Chat Interface**: Engage with the AI assistant through a familiar chat
  interface to get targeted performance advice.
- **Trace Processing**: Upload and process Chrome DevTools performance traces
  for detailed analysis.
- **Report Generation**: Generate markdown reports with actionable optimization
  recommendations.

## Project Structure

### Main Directories

- `/app`: Next.js app router pages and API routes
  - `/api`: Backend API routes for AI integration, suggestions, and more
  - `/chat`: The main chat interface for interacting with the AI
  - `/actions`: Server actions for subscription management
  - `/workers`: Web workers for handling CPU-intensive tasks
- `/components`: React components
  - `/flamegraph`: Flame graph visualization components
  - `/network-activity`: Network request visualization
  - `/trace-details`: Components for displaying trace insights
  - `/app-sidebar`: Navigation and sidebar components
  - `/ui`: shadcn base components built with Radix UI
- `/lib`: Utilities and shared code
  - `/ai`: AI-related code and prompts
    - `/mastra`: Mastra AI agents and workflows
  - `/stores`: Zustand state management stores

### Core Components

- **Flame Graph Visualization**: Int