Hugging Face's logo

Spaces:
nlpetprolific
/
user-experience-leaderboard
Running

App Files Community
user-experience-leaderboard / leaderboard-app /README.md
Nora Petrova
Add project to new space
20e666e
preview code
|
raw
history blame
2.64 kB

LLM Comparison Leaderboard

An interactive dashboard for comparing the performance of state-of-the-art large language models across various tasks and metrics.

Features

  • Overall model rankings with comprehensive scoring
  • Task-specific performance analysis
  • Metric breakdowns across different dimensions
  • User satisfaction and experience metrics
  • Interactive visualizations using Recharts
  • Responsive design for all device sizes

Getting Started

Prerequisites

  • Node.js 16.8 or later
  • Python 3.8 or later (for data processing)
  • Python packages: pandas, numpy

Installation

  1. Clone the repository:
git clone https://github.com/yourusername/llm-comparison-leaderboard.git
cd llm-comparison-leaderboard
  1. Install dependencies:
npm install
  1. Install Python dependencies (if you plan to process data):
pip install pandas numpy

Using Sample Data

The repository includes a sample JSON file with placeholder data in public/llm_comparison_data.json. You can start the development server right away to see the dashboard with this data:

npm run dev

Visit http://localhost:3000 to see the dashboard.

Processing Your Own Data

If you have your own data, follow these steps:

  1. Place your CSV data file in the data directory:
mkdir -p data
cp /path/to/your/pilot_data_n20.csv data/
  1. Run the data processing script:
npm run process-data

This will:

  • Process the CSV data using the Python script
  • Generate a JSON file in the public directory
  • Format the data for the dashboard
  1. Start the development server:
npm run dev

Project Structure

  • app/ - Next.js App Router components
    • page.js - Main page component that loads data and renders dashboard
    • layout.js - Layout component with metadata and global styles
    • globals.css - Global styles including Tailwind CSS
  • components/ - React components
    • LLMComparisonDashboard.jsx - The main dashboard component
  • public/ - Static files
    • llm_comparison_data.json - Processed data for the dashboard
  • lib/ - Utility functions
    • utils.js - Helper functions for data processing
  • scripts/ - Data processing scripts
    • process_data.js - Node.js script for running Python processor
    • process_data.py - Python script for data processing

Building for Production

To build the application for production:

npm run build

To start the production server:

npm run start

License

This project is licensed under the MIT License - see the LICENSE file for details.