AI Compute Lab Dashboard

An interactive compute exploration and comparison tool for local Large Language Model (LLM) inference and cloud compute renting. This dashboard helps developers evaluate and compare compute platforms (Mac Studio, Custom workstations, and cloud GPU providers) specifically for running models ranging from 14B to 405B parameters.

Vercel Demo

A live demo of this project is maintained at: https://v0-hardware-lab.vercel.app/

🚀 Features

• Double Comparison Tabs:
  • Local compute: Compare owned hardware options (Mac Studio, RTX 4090/5090 PCs, workstations) running locally.
  • Cloud compute: Compare compute renting providers categorized intoWorkstations (Shadow PC, TrueCloud), Marketplaces (Vast.ai, TensorDock), and Neoclouds (RunPod, Spheron).
• Model Profiles: Switch between 14B, 30-35B, 70B+, and 405B frontier model profiles to see how compute setups handle different parameter sizes.
• Quantization Toggle: Compare 4-bit, 6-bit, and 8-bit quantization impacts on VRAM requirements and inference speed.
• Dynamic Cost Calculations: Compare hourly rates against monthly subscription models, adjusting for usage hours dynamically using a slider.
• Interactive Comparisons:
  • Starring: Highlight options for side-by-side evaluation.
  • Sorting: Sort options by VRAM, Speed/Efficiency, Agent Capacity, Cost, and more.
  • Collapsible Rows: Toggle visibility for specific "Specs", "Performance", or "Suitability" metrics to reduce vertical clutter.
• Layout & Usability Improvements:
  • Sticky table headers and row titles for seamless horizontal and vertical scrolling.
  • Smart warning indicator for options with insufficient VRAM (INSUFFICIENT VRAM).
  • Subtle grid borders and clean dynamic filter button state transitions.

🛠️ Tech Stack

• Framework: React 19 (TypeScript)
• Bundler: Vite
• Styling: Tailwind CSS (v3)
• Icons: Lucide React
• Design: Modern Glassmorphism with Dark/Light mode support.

📦 Project Structure

• src/App.tsx: Central configuration-driven dashboard logic.
• src/App.css: App-specific styling overrides (e.g. subtle borders).
• src/index.css: Global Tailwind directives and base styles.
• tailwind.config.js: Custom theme and content configuration.

🔧 Installation & Setup

1. Clone the repository (or navigate to the hardware-lab folder).
2. Install dependencies:

   npm install

3. Run in development mode:

   npm run dev

4. Build for production:

   npm run build

🛡️ Git Configuration

This project utilizes a standard Node.js/Vite .gitignore template. It is configured to ignore:

• node_modules/
• Production build output (dist/)
• Log files (*.log, npm-debug.log, etc.)
• Local environment variables (.env.local)
• IDE specific files (.vscode, .idea, .DS_Store)

---

Created for evaluating local and cloud AI compute ecosystems in 2026.