AgentIvy

AgentIvy autonomously analyzes your Angular components for accessibility issues and performance bottlenecks, delivering real-time recommendations

Comment

AgentIvy - AI-Powered Accessibility & Performance Testing Agent

Inspiration

While developing a DMV CRM system for a client, I encountered a critical requirement that was mentioned later in the project lifecycle: WCAG compliance. This experience highlighted the need for automated accessibility testing early in the development process. Rather than discovering compliance issues late in development, I envisioned a tool that could proactively identify and suggest fixes for accessibility and performance problems throughout the development cycle.

What it does

AgentIvy is an AI-powered code analysis agent that automatically:

  1. Clones your repository
  2. Scans the codebase to identify all components and pages
  3. Executes accessibility and performance tests on each component
  4. Identifies WCAG compliance issues and performance bottlenecks
  5. Suggests code fixes with direct references to the affected code

Currently, AgentIvy focuses on identifying issues and providing actionable recommendations to improve your application's accessibility and performance metrics.

How we built it

Technology Stack

Backend:

  • Java 17 with Spring Boot 3.x - Leveraged my existing expertise from corporate projects for rapid development
  • Google ADK - Agent framework powered by Gemini 3.5 Pro for advanced code generation and analysis capabilities
  • JGit - Repository cloning and management
  • Playwright - Browser automation for comprehensive accessibility and performance testing

Frontend:

  • Angular 17 - Utilized my existing proficiency for efficient UI development

Deployment:

  • Firebase - Frontend hosting with CDN distribution
  • Google Cloud Run - Dockerized backend deployment with auto-scaling

Challenges we ran into

Testing individual components was difficult because they have dependencies like services, authentication, and routing. Running isolated tests would break these connections.

Solution: I created a dynamic test harness - a smart container that automatically mocks all dependencies and provides a controlled environment. This lets AgentIvy test components as if they're running in a real app, without needing the full application setup.

Accomplishments that we're proud of

  • Successfully integrated Gemini 3.5 Pro for intelligent code analysis and context-aware suggestions
  • Built an end-to-end automated testing pipeline from repository cloning to issue detection
  • Implemented a dynamic test harness solving the component isolation challenge
  • Deployed a production-ready application on Google Cloud infrastructure with auto-scaling
  • Achieved sub-2-minute analysis time for medium-sized repositories
  • Integrated Playwright for comprehensive DOM analysis and performance monitoring

What we learned

Building AgentIvy taught me how to design AI agents for complex code analysis, manage browser automation at scale, and optimize async processing in containerized environments.

Key lesson: Start small and build up. Testing components individually, then pages, then the full app avoids overwhelming complexity while still delivering meaningful results.

What's next for AgentIvy

Phase 1: Enhanced Analysis & Automation

  1. Automated Code Fixes & Pull Requests

    • Generate fix commits automatically
    • Create PRs with detailed explanations and before/after comparisons
    • Support multiple fix strategies per issue (let developers choose)
    • Integration with GitHub, GitLab, and Bitbucket

  2. UI Responsiveness Testing

    • Viewport testing across devices (mobile, tablet, desktop)
    • Responsive design validation at breakpoints: ${320px, 768px, 1024px, 1440px}$
    • CSS breakpoint analysis and recommendations
    • Touch target size validation for mobile

  3. Batch Component Testing

    • Analyze multiple components simultaneously
    • Reduce overall analysis time by $\approx 60\%$ through parallel execution
    • Intelligent scheduling based on component dependencies
    • Progress tracking with estimated completion time

  4. Containerized Execution Environment

    • Create isolated Docker container per analysis run
    • Destroy containers post-completion for security
    • Resource limits: $\text{Memory} \leq 4GB$, $\text{CPU} \leq 2$ cores per container
    • Improved resource management and cost optimization

Phase 2: Developer Integration

  1. CLI Tool for CI/CD Pipelines

    • Integration with GitHub Actions, GitLab CI, Jenkins
    • Pre-commit hooks support
    • Exit codes for build failure on critical issues
    • JSON/HTML/XML report formats

  2. Code Quality Standards Enforcement

    • ESLint rule enforcement with custom rule sets
    • Naming convention validation:
      • Class names: PascalCase
      • Methods: camelCase
      • Constants: UPPER_SNAKE_CASE
    • Semantic analysis:
      • DOM structure validation
      • Action naming patterns
      • Model consistency checks
    • Integration with existing linters and formatters

  3. VS Code Extension

    • Real-time local analysis as you type
    • Inline suggestions and quick-fixes in editor
    • Accessibility violations highlighted with severity indicators
    • Performance metrics in status bar
    • Command palette integration: AgentIvy: Analyze Current File

Phase 3: Complete IDE Solution

Vision: Build a comprehensive IDE that eliminates the need for multiple tools and scripts

Share this project:

Updates