commit 0561c6da6f2e58d0a0c2534b924e52db07ee8f82 Author: hubian <908234780@qq.com> Date: Wed Apr 8 10:37:07 2026 +0800 初始化参数百科网站项目 - Next.js 14 + Tailwind CSS + Prisma - 模型数据库页面 (列表+详情) - GPU数据库页面 (列表+详情) - CPU数据库页面 - 显存计算器工具 - 参数对比工具 - 知识库页面 - 初始数据: 15个模型, 10个GPU, 3个CPU diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..f4a2356 --- /dev/null +++ b/.env.example @@ -0,0 +1,5 @@ +# Database +DATABASE_URL="postgresql://user:password@localhost:5432/paramhub" + +# Optional: Next.js +NEXT_PUBLIC_SITE_URL="http://localhost:3000" \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8f9936a --- /dev/null +++ b/.gitignore @@ -0,0 +1,43 @@ +# Dependencies +node_modules +.pnpm-store + +# Build output +.next +out +build +dist + +# Prisma +prisma/generated + +# Environment +.env +.env.local +.env.development.local +.env.test.local +.env.production.local + +# IDE +.vscode +.idea +*.swp +*.swo + +# Logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# OS +.DS_Store +Thumbs.db + +# Test +coverage +.nyc_output + +# Misc +*.log +*.tsbuildinfo \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..07a6b27 --- /dev/null +++ b/README.md @@ -0,0 +1,114 @@ +# ParamHub - 参数百科 + +> 一站式AI大模型参数与硬件参数速查与对比平台 + +## 功能特点 + +- **模型数据库**: GPT-4、Llama、Claude等100+大模型参数规格 +- **GPU数据库**: H100、A100、RTX 4090等GPU详细规格对比 +- **CPU数据库**: AMD EPYC、Intel Xeon等服务器级CPU参数 +- **实用工具**: 显存计算器、成本估算器、参数对比工具 +- **知识库**: 参数解释、选型指南、最佳实践 + +## 技术栈 + +- **框架**: Next.js 14 (React) +- **样式**: Tailwind CSS +- **数据库**: PostgreSQL (Prisma ORM) +- **图表**: Recharts + +## 快速开始 + +### 1. 安装依赖 + +```bash +npm install +``` + +### 2. 配置数据库 + +```bash +# 复制环境变量 +cp .env.example .env + +# 编辑 .env 文件，设置 DATABASE_URL +``` + +### 3. 初始化数据库 + +```bash +npm run db:generate +npm run db:push +npm run db:seed # 可选，填充初始数据 +``` + +### 4. 启动开发服务器 + +```bash +npm run dev +``` + +访问 http://localhost:3000 + +## 项目结构 + +``` +param-hub/ +├── src/ +│ ├── app/ # Next.js 页面 +│ │ ├── models/ # 模型数据库页面 +│ │ ├── gpus/ # GPU数据库页面 +│ │ ├── cpus/ # CPU数据库页面 +│ │ ├── tools/ # 计算工具页面 +│ │ ├── compare/ # 对比工具页面 +│ │ └── knowledge/ # 知识库页面 +│ ├── components/ # React组件 +│ ├── lib/ # 工具函数 +│ └── data/ # 初始数据 +├── prisma/ +│ ├── schema.prisma # 数据库schema +│ └── seed.ts # 数据填充脚本 +├── public/ # 静态资源 +└── README.md +``` + +## 数据库表结构 + +### models (模型数据) +- name, organization, parametersCount, architecture +- layers, hiddenSize, attentionHeads, contextLength +- benchmarkMmlu, benchmarkHumaneval +- isOpenSource, license + +### gpus (GPU数据) +- name, manufacturer, architecture +- cudaCores, tensorCores, memoryGb +- fp32Tflops, fp16Tflops, priceUsd + +### cpus (CPU数据) +- name, manufacturer, architecture +- cores, threads, baseClockGhz, boostClockGhz +- l3CacheMb, tdpWatts, priceUsd + +## 部署 + +### Vercel (推荐) + +```bash +vercel deploy +``` + +### Docker + +```bash +docker build -t param-hub . +docker run -p 3000:3000 param-hub +``` + +## 贡献数据 + +欢迎贡献新的模型/GPU数据！请提交PR或Issue。 + +## License + +MIT \ No newline at end of file diff --git a/next.config.js b/next.config.js new file mode 100644 index 0000000..8ffd97e --- /dev/null +++ b/next.config.js @@ -0,0 +1,8 @@ +/** @type {import('next').NextConfig} */ +const nextConfig = { + images: { + domains: ['huggingface.co', 'avatars.githubusercontent.com'], + }, +} + +module.exports = nextConfig \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..0ff0f7e --- /dev/null +++ b/package.json @@ -0,0 +1,41 @@ +{ + "name": "param-hub", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "next lint", + "db:generate": "prisma generate", + "db:push": "prisma db push", + "db:seed": "tsx prisma/seed.ts" + }, + "dependencies": { + "next": "14.2.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "@prisma/client": "^5.12.0", + "prisma": "^5.12.0", + "zustand": "^4.5.0", + "@tanstack/react-query": "^5.28.0", + "@tanstack/react-table": "^8.13.0", + "recharts": "^2.12.0", + "react-hook-form": "^7.51.0", + "zod": "^3.22.0", + "@hookform/resolvers": "^3.3.0", + "clsx": "^2.1.0", + "tailwind-merge": "^2.2.0", + "lucide-react": "^0.358.0" + }, + "devDependencies": { + "typescript": "^5.4.0", + "@types/node": "^20.11.0", + "@types/react": "^18.2.0", + "@types/react-dom": "^18.2.0", + "autoprefixer": "^10.4.0", + "postcss": "^8.4.0", + "tailwindcss": "^3.4.0", + "tsx": "^4.7.0" + } +} \ No newline at end of file diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..96bb01e --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +} \ No newline at end of file diff --git a/prisma/schema.prisma b/prisma/schema.prisma new file mode 100644 index 0000000..93495da --- /dev/null +++ b/prisma/schema.prisma @@ -0,0 +1,215 @@ +// Prisma schema for ParamHub - 参数百科数据库 + +generator client { + provider = "prisma-client-js" +} + +datasource db { + provider = "postgresql" + url = env("DATABASE_URL") +} + +// 大模型数据 +model Model { + id Int @id @default(autoincrement()) + name String + slug String @unique + organization String? + parametersCount BigInt? // 参数量（以B为单位存储实际数值） + architecture String? + layers Int? + hiddenSize Int? + attentionHeads Int? + contextLength Int? + trainingTokens BigInt? // 训练token数 + trainingCostUsd Float? + releaseDate DateTime? + isOpenSource Boolean @default(false) + license String? + description String? @db.Text + imageUrl String? + + // Benchmark 分数 + benchmarkMmlu Float? + benchmarkHumaneval Float? + benchmarkGsm8k Float? + benchmarkMath Float? + + // 部署要求 + minVramFp16 Int? // GB + minVramInt8 Int? + minVramInt4 Int? + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt + + // 关联 + apis ModelApi[] + categories ModelCategory[] + comparisonsA ModelComparison[] @relation("ModelA") + comparisonsB ModelComparison[] @relation("ModelB") + + @@index([organization]) + @@index([parametersCount]) + @@index([releaseDate]) +} + +// 模型API信息 +model ModelApi { + id Int @id @default(autoincrement()) + modelId Int + provider String // OpenAI, Azure, Together, etc. + apiName String? + inputPricePer1k Float? // 输入价格 $/1K tokens + outputPricePer1k Float? // 输出价格 $/1K tokens + contextLimit Int? + rateLimitRpm Int? + available Boolean @default(true) + + model Model @relation(fields: [modelId], references: [id]) + + @@index([provider]) +} + +// 模型分类 +model ModelCategory { + id Int @id @default(autoincrement()) + modelId Int + category String // chat, code, embedding, image, etc. + + model Model @relation(fields: [modelId], references: [id]) + + @@unique([modelId, category]) +} + +// 模型对比记录 +model ModelComparison { + id Int @id @default(autoincrement()) + modelAId Int + modelBId Int + comparisonType String? // performance, cost, etc. + notes String? @db.Text + createdAt DateTime @default(now()) + + modelA Model @relation("ModelA", fields: [modelAId], references: [id]) + modelB Model @relation("ModelB", fields: [modelBId], references: [id]) +} + +// GPU数据 +model Gpu { + id Int @id @default(autoincrement()) + name String + slug String @unique + manufacturer String // NVIDIA, AMD, Intel + architecture String? + cudaCores Int? + tensorCores Int? + memoryGb Float? + memoryType String? // GDDR6X, HBM2e, etc. + memoryBandwidthGbps Float? + fp32Tflops Float? + fp16Tflops Float? + int8Tops Float? + tdpWatts Int? + priceUsd Float? + releaseDate DateTime? + recommendedFor String[] // training, inference, gaming + imageUrl String? + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt + + @@index([manufacturer]) + @@index([memoryGb]) + @@index([priceUsd]) +} + +// CPU数据 +model Cpu { + id Int @id @default(autoincrement()) + name String + slug String @unique + manufacturer String // AMD, Intel + architecture String? + cores Int? + threads Int? + baseClockGhz Float? + boostClockGhz Float? + l3CacheMb Int? + tdpWatts Int? + memoryType String? + memoryChannels Int? + pcieLanes Int? + priceUsd Float? + releaseDate DateTime? + imageUrl String? + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt + + @@index([manufacturer]) + @@index([cores]) +} + +// 服务器配置 +model ServerConfig { + id Int @id @default(autoincrement()) + name String + slug String @unique + cpuConfig String? @db.Text // JSON + gpuConfig String? @db.Text // JSON + memoryGb Int? + storageConfig String? @db.Text // JSON + networkConfig String? @db.Text // JSON + totalTdpWatts Int? + priceUsd Float? + useCase String? + description String? @db.Text + imageUrl String? + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt +} + +// 知识库文章 +model Article { + id Int @id @default(autoincrement()) + title String + slug String @unique + category String // explanation, guide, best-practice + content String @db.Text // Markdown + tags String[] + author String? + publishedAt DateTime? + views Int @default(0) + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt + + @@index([category]) + @@index([tags]) +} + +// 用户 +model User { + id Int @id @default(autoincrement()) + email String @unique + name String? + avatar String? + role String @default("user") // user, admin, contributor + favorites String[] // 模型/GPU slug列表 + + createdAt DateTime @default(now()) + updatedAt DateTime @updatedAt +} + +// 计算器使用记录（可选，用于统计） +model CalculatorLog { + id Int @id @default(autoincrement()) + calculatorType String // vram, training-cost, inference-cost + inputParams String @db.Text // JSON + outputResult String @db.Text // JSON + createdAt DateTime @default(now()) + + @@index([calculatorType]) +} \ No newline at end of file diff --git a/src/app/compare/page.tsx b/src/app/compare/page.tsx new file mode 100644 index 0000000..04765de --- /dev/null +++ b/src/app/compare/page.tsx @@ -0,0 +1,278 @@ +'use client' + +import { useState } from 'react' +import { BarChart3, Plus, X, ArrowRightLeft } from 'lucide-react' +import { models, gpus } from '@/data/initial' + +type CompareItem = { + type: 'model' | 'gpu' + slug: string +} + +export default function ComparePage() { + const [items, setItems] = useState([]) + const [mode, setMode] = useState<'model' | 'gpu'>('model') + const [showSelector, setShowSelector] = useState(false) + + const addItem = (slug: string) => { + if (items.length < 5 && !items.find(i => i.slug === slug)) { + setItems([...items, { type: mode, slug }]) + setShowSelector(false) + } + } + + const removeItem = (slug: string) => { + setItems(items.filter(i => i.slug !== slug)) + } + + const getSelectedItem = (slug: string) => { + if (mode === 'model') return models.find(m => m.slug === slug) + return gpus.find(g => g.slug === slug) + } + + return ( +
+ {/* Header */} +
+
+

+ + 参数对比工具 +

+

+ 选择多个模型或GPU，进行参数和性能对比 +

+
+
+ +
+ {/* Mode selector */} +
+ 对比类型: + + +
+ + {/* Selected items */} +
+
+

已选择 {items.length} 个项目

+ {items.length < 5 && ( + + )} +
+ +
+ {items.map((item) => ( +
+ {getSelectedItem(item.slug)?.name} + +
+ ))} + {items.length === 0 && ( + 点击"添加"开始选择 + )} +
+ + {/* Item selector */} + {showSelector && ( +
+

选择要添加的{mode === 'model' ? '模型' : 'GPU'}:

+
+ {(mode === 'model' ? models : gpus).map((item) => ( + + ))} +
+
+ )} +
+ + {/* Comparison table */} + {items.length >= 2 && ( +
+ + + + + {items.map((item) => ( + + ))} + + + + {mode === 'model' ? ( + <> + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + ) : ( + <> + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + + {items.map((item) => ( + + ))} + + + )} + +
参数 + {getSelectedItem(item.slug)?.name} +
参数量 + {models.find(m => m.slug === item.slug)?.parametersCount + ? `${models.find(m => m.slug === item.slug)?.parametersCount}B` + : '未公开'} +
开源 + {models.find(m => m.slug === item.slug)?.isOpenSource ? '是' : '否'} +
上下文长度 + {models.find(m => m.slug === item.slug)?.contextLength >= 1000 + ? `${models.find(m => m.slug === item.slug)?.contextLength / 1000}K` + : models.find(m => m.slug === item.slug)?.contextLength || '-'} +
MMLU分数 + {models.find(m => m.slug === item.slug)?.benchmarkMmlu + ? `${models.find(m => m.slug === item.slug)?.benchmarkMmlu}%` + : '-'} +
HumanEval分数 + {models.find(m => m.slug === item.slug)?.benchmarkHumaneval + ? `${models.find(m => m.slug === item.slug)?.benchmarkHumaneval}%` + : '-'} +
FP16显存需求 + {models.find(m => m.slug === item.slug)?.minVramFp16 + ? `${models.find(m => m.slug === item.slug)?.minVramFp16}GB` + : '-'} +
显存 + {gpus.find(g => g.slug === item.slug)?.memoryGb}GB +
显存类型 + {gpus.find(g => g.slug === item.slug)?.memoryType} +
显存带宽 + {gpus.find(g => g.slug === item.slug)?.memoryBandwidthGbps} GB/s +
CUDA核心 + {gpus.find(g => g.slug === item.slug)?.cudaCores?.toLocaleString()} +
FP16算力 + {gpus.find(g => g.slug === item.slug)?.fp16Tflops?.toLocaleString()} TFLOPS +
功耗 + {gpus.find(g => g.slug === item.slug)?.tdpWatts}W +
价格 + ${gpus.find(g => g.slug === item.slug)?.priceUsd?.toLocaleString()} +
+
+ )} + + {items.length < 2 && ( +
+ +

请至少选择2个项目进行对比

+
+ )} +
+
+ ) +} \ No newline at end of file diff --git a/src/app/cpus/page.tsx b/src/app/cpus/page.tsx new file mode 100644 index 0000000..59da29b --- /dev/null +++ b/src/app/cpus/page.tsx @@ -0,0 +1,127 @@ +import { useState } from 'react' +import { Search, ArrowUpDown, Cpu } from 'lucide-react' +import { cpus, Cpu } from '@/data/initial' + +export default function CpusPage() { + const [search, setSearch] = useState('') + const [sortBy, setSortBy] = useState<'name' | 'cores' | 'price'>('name') + const [filterManufacturer, setFilterManufacturer] = useState<'all' | 'AMD' | 'Intel'>('all') + + const filteredCpus = cpus + .filter((c) => { + if (search && !c.name.toLowerCase().includes(search.toLowerCase())) return false + if (filterManufacturer !== 'all' && c.manufacturer !== filterManufacturer) return false + return true + }) + .sort((a, b) => { + if (sortBy === 'cores') return (b.cores || 0) - (a.cores || 0) + if (sortBy === 'price') return (a.priceUsd || 0) - (b.priceUsd || 0) + return a.name.localeCompare(b.name) + }) + + return ( +
+ {/* Header */} +
+
+

+ + CPU数据库 +

+

+ 收录 {cpus.length} 款服务器级CPU，包含核心数、频率、缓存规格 +

+
+
+ + {/* Filters */} +
+
+
+
+ + setSearch(e.target.value)} + className="bg-transparent border-none outline-none ml-2 text-sm w-full" + /> +
+ + + +
+ + +
+ +
+ 显示 {filteredCpus.length} 款CPU +
+
+
+ + {/* CPU table */} +
+ + + + + + + + + + + + + + {filteredCpus.map((cpu) => ( + + + + + + + + + + ))} + +
CPU名称厂商核心/线程频率缓存功耗价格
{cpu.name} + + {cpu.manufacturer} + + {cpu.cores}核 / {cpu.threads}线程{cpu.baseClockGhz}GHz / {cpu.boostClockGhz}GHz{cpu.l3CacheMb}MB{cpu.tdpWatts}W + ${cpu.priceUsd?.toLocaleString()} +
+ + {filteredCpus.length === 0 && ( +
+ 没有找到匹配的CPU +
+ )} +
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/globals.css b/src/app/globals.css new file mode 100644 index 0000000..356324a --- /dev/null +++ b/src/app/globals.css @@ -0,0 +1,84 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +:root { + --foreground-rgb: 0, 0, 0; + --background-start-rgb: 248, 250, 252; + --background-end-rgb: 255, 255, 255; +} + +@media (prefers-color-scheme: dark) { + :root { + --foreground-rgb: 255, 255, 255; + --background-start-rgb: 15, 23, 42; + --background-end-rgb: 30, 41, 59; + } +} + +body { + color: rgb(var(--foreground-rgb)); + background: linear-gradient( + to bottom, + transparent, + rgb(var(--background-end-rgb)) + ) + rgb(var(--background-start-rgb)); + min-height: 100vh; +} + +@layer utilities { + .text-balance { + text-wrap: balance; + } +} + +/* Custom scrollbar */ +::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +::-webkit-scrollbar-track { + background: #f1f5f9; +} + +::-webkit-scrollbar-thumb { + background: #cbd5e1; + border-radius: 4px; +} + +::-webkit-scrollbar-thumb:hover { + background: #94a3b8; +} + +/* Table styles */ +.data-table { + @apply w-full text-sm text-left; +} + +.data-table thead { + @apply text-xs uppercase bg-slate-100 dark:bg-slate-800; +} + +.data-table th { + @apply px-4 py-3 font-semibold; +} + +.data-table td { + @apply px-4 py-3; +} + +.data-table tbody tr { + @apply border-b border-slate-200 dark:border-slate-700 hover:bg-slate-50 dark:hover:bg-slate-800/50 transition-colors; +} + +/* Card hover effect */ +.card-hover { + @apply transition-all duration-200 hover:shadow-lg hover:-translate-y-0.5; +} + +/* Gradient text */ +.gradient-text { + @apply bg-clip-text text-transparent bg-gradient-to-r from-primary-500 to-primary-700; +} \ No newline at end of file diff --git a/src/app/gpus/[slug]/page.tsx b/src/app/gpus/[slug]/page.tsx new file mode 100644 index 0000000..4bf2db9 --- /dev/null +++ b/src/app/gpus/[slug]/page.tsx @@ -0,0 +1,161 @@ +import { notFound } from 'next/navigation' +import { + ArrowLeft, Cpu, MemoryStick, Zap, DollarSign, + Gauge, Calendar, Factory +} from 'lucide-react' +import Link from 'next/link' +import { gpus } from '@/data/initial' + +interface GpuDetailPageProps { + params: { slug: string } +} + +export default function GpuDetailPage({ params }: GpuDetailPageProps) { + const gpu = gpus.find((g) => g.slug === params.slug) + + if (!gpu) { + notFound() + } + + return ( +
+
+ {/* Back link */} + + + 返回GPU列表 + + + {/* Header */} +
+
+
+

{gpu.name}

+
+ + + {gpu.manufacturer} + + {gpu.architecture && ( + | {gpu.architecture} + )} +
+
+
+ + {/* Use case badges */} +
+ {gpu.recommendedFor.map((use) => ( + + {use === 'training' ? '适合训练' : use === 'inference' ? '适合推理' : use} + + ))} +
+
+ + {/* Main content grid */} +
+ {/* Memory specs */} +
+

+ + 显存规格 +

+
+
+ 显存容量 + {gpu.memoryGb}GB +
+
+ 显存类型 + {gpu.memoryType || '-'} +
+
+ 显存带宽 + + {gpu.memoryBandwidthGbps ? `${gpu.memoryBandwidthGbps} GB/s` : '-'} + +
+
+
+ + {/* Compute specs */} +
+

+ + 计算性能 +

+
+
+ CUDA核心 + + {gpu.cudaCores ? gpu.cudaCores.toLocaleString() : '-'} + +
+
+ Tensor核心 + + {gpu.tensorCores ? gpu.tensorCores.toLocaleString() : '-'} + +
+
+ FP32 性能 + + {gpu.fp32Tflops ? `${gpu.fp32Tflops} TFLOPS` : '-'} + +
+
+ FP16 性能 + + {gpu.fp16Tflops ? `${gpu.fp16Tflops.toLocaleString()} TFLOPS` : '-'} + +
+
+
+ + {/* Power & Price */} +
+

+ + 功耗与价格 +

+
+
+ 功耗 (TDP) + {gpu.tdpWatts}W +
+
+ 参考价格 + + {gpu.priceUsd ? `$${gpu.priceUsd.toLocaleString()}` : '-'} + +
+
+
+
+ + {/* Actions */} +
+ + 加入对比 + + + 显存计算器 + +
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/gpus/page.tsx b/src/app/gpus/page.tsx new file mode 100644 index 0000000..fa28e4f --- /dev/null +++ b/src/app/gpus/page.tsx @@ -0,0 +1,117 @@ +import { useState } from 'react' +import { Search, Filter, ArrowUpDown, Cpu } from 'lucide-react' +import { gpus, Gpu } from '@/data/initial' +import { GpuCard } from '@/components/gpus/GpuCard' + +export default function GpusPage() { + const [search, setSearch] = useState('') + const [sortBy, setSortBy] = useState<'name' | 'memory' | 'price'>('name') + const [filterManufacturer, setFilterManufacturer] = useState<'all' | 'NVIDIA' | 'AMD'>('all') + const [filterUseCase, setFilterUseCase] = useState<'all' | 'training' | 'inference'>('all') + + const filteredGpus = gpus + .filter((g) => { + if (search && !g.name.toLowerCase().includes(search.toLowerCase())) return false + if (filterManufacturer !== 'all' && g.manufacturer !== filterManufacturer) return false + if (filterUseCase !== 'all' && !g.recommendedFor.includes(filterUseCase)) return false + return true + }) + .sort((a, b) => { + if (sortBy === 'memory') return (b.memoryGb || 0) - (a.memoryGb || 0) + if (sortBy === 'price') return (a.priceUsd || 0) - (b.priceUsd || 0) + return a.name.localeCompare(b.name) + }) + + return ( +
+ {/* Header */} +
+
+

+ + GPU数据库 +

+

+ 收录 {gpus.length} 款GPU，包含显存规格、算力指标、价格对比 +

+
+
+ + {/* Filters */} +
+
+
+ {/* Search */} +
+ + setSearch(e.target.value)} + className="bg-transparent border-none outline-none ml-2 text-sm w-full" + /> +
+ + {/* Manufacturer filter */} +
+ + +
+ + {/* Use case filter */} + + + {/* Sort */} +
+ + +
+ + {/* Results count */} +
+ 显示 {filteredGpus.length} 款GPU +
+
+
+ + {/* GPU grid */} +
+ {filteredGpus.map((gpu) => ( + + ))} +
+ + {filteredGpus.length === 0 && ( +
+ 没有找到匹配的GPU +
+ )} +
+
+ ) +} \ No newline at end of file diff --git a/src/app/knowledge/page.tsx b/src/app/knowledge/page.tsx new file mode 100644 index 0000000..cc15615 --- /dev/null +++ b/src/app/knowledge/page.tsx @@ -0,0 +1,140 @@ +import { BookOpen, FileText, Lightbulb, Wrench } from 'lucide-react' +import Link from 'next/link' + +const articles = [ + { + category: 'explanation', + icon: FileText, + title: '参数量是什么意思？', + slug: 'what-is-parameters', + description: '详解大模型参数量的含义，如何计算，以及对模型性能的影响', + tags: ['基础', '参数'], + }, + { + category: 'explanation', + icon: FileText, + title: 'Hidden Size的影响', + slug: 'hidden-size-impact', + description: '隐藏层维度如何影响模型的表达能力和计算成本', + tags: ['架构', '参数'], + }, + { + category: 'explanation', + icon: FileText, + title: '上下文长度解析', + slug: 'context-length-explained', + description: '上下文窗口大小的意义、扩展方法及其对应用的影响', + tags: ['基础', '推理'], + }, + { + category: 'guide', + icon: Lightbulb, + title: '如何选择适合的GPU？', + slug: 'gpu-selection-guide', + description: '根据模型大小、预算和用途，选择最合适的GPU配置', + tags: ['选型', 'GPU'], + }, + { + category: 'guide', + icon: Lightbulb, + title: '训练7B模型需要什么配置？', + slug: 'training-7b-config', + description: '从硬件到软件，完整介绍训练7B参数模型的配置方案', + tags: ['训练', '配置'], + }, + { + category: 'best-practice', + icon: Wrench, + title: '显存优化技巧', + slug: 'vram-optimization', + description: '充分利用显存的技巧：量化、梯度检查点、Flash Attention等', + tags: ['优化', '推理'], + }, + { + category: 'best-practice', + icon: Wrench, + title: '推理加速方案', + slug: 'inference-acceleration', + description: '从模型优化到硬件选择，全面提升推理速度的方案', + tags: ['优化', '推理'], + }, +] + +export default function KnowledgePage() { + const categories = [ + { key: 'explanation', label: '参数解释', color: 'blue' }, + { key: 'guide', label: '选型指南', color: 'green' }, + { key: 'best-practice', label: '最佳实践', color: 'purple' }, + ] + + return ( +
+ {/* Header */} +
+
+

+ + 知识库 +

+

+ 参数解释、选型指南、最佳实践，帮助你理解和使用AI模型 +

+
+
+ +
+ {/* Category tabs */} +
+ {categories.map((cat) => ( + + {cat.label} + + ))} +
+ + {/* Articles grid */} +
+ {articles.map((article) => ( + +
+ + + {categories.find(c => c.key === article.category)?.label} + +
+

{article.title}

+

{article.description}

+
+ {article.tags.map((tag) => ( + + {tag} + + ))} +
+ + ))} +
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/layout.tsx b/src/app/layout.tsx new file mode 100644 index 0000000..8b84bc4 --- /dev/null +++ b/src/app/layout.tsx @@ -0,0 +1,33 @@ +import type { Metadata } from 'next' +import { Inter } from 'next/font/google' +import './globals.css' +import { Header } from '@/components/Header' +import { Footer } from '@/components/Footer' + +const inter = Inter({ subsets: ['latin'] }) + +export const metadata: Metadata = { + title: '参数百科 - AI模型与硬件参数速查平台', + description: '一站式AI大模型参数、GPU参数、CPU参数速查与对比平台，提供显存计算器、成本估算器等实用工具', + keywords: ['AI模型', 'GPU', '参数', '大模型', 'LLM', 'H100', 'A100', 'GPT-4', 'Llama'], +} + +export default function RootLayout({ + children, +}: { + children: React.ReactNode +}) { + return ( + + +
+
+
+ {children} +
+
+
+ + + ) +} \ No newline at end of file diff --git a/src/app/models/[slug]/page.tsx b/src/app/models/[slug]/page.tsx new file mode 100644 index 0000000..13d0412 --- /dev/null +++ b/src/app/models/[slug]/page.tsx @@ -0,0 +1,185 @@ +import { notFound } from 'next/navigation' +import { + ArrowLeft, Lock, Unlock, BarChart2, MemoryStick, + Calendar, Building2, FileText, ExternalLink +} from 'lucide-react' +import Link from 'next/link' +import { models } from '@/data/initial' + +interface ModelDetailPageProps { + params: { slug: string } +} + +export default function ModelDetailPage({ params }: ModelDetailPageProps) { + const model = models.find((m) => m.slug === params.slug) + + if (!model) { + notFound() + } + + const formatParams = (params: number | null) => { + if (params === null) return '未公开' + if (params >= 1000) return `${params / 1000}T` + return `${params}B` + } + + const formatContext = (ctx: number | null) => { + if (!ctx) return '-' + if (ctx >= 1000000) return `${ctx / 1000000}M` + if (ctx >= 1000) return `${ctx / 1000}K` + return ctx.toString() + } + + return ( +
+
+ {/* Back link */} + + + 返回模型列表 + + + {/* Header */} +
+
+
+

{model.name}

+
+ + + {model.organization} + + {model.isOpenSource ? ( + + + 开源 + + ) : ( + + + 闭源 + + )} +
+
+
+ + {model.architecture && ( +
+ 架构: {model.architecture} +
+ )} + + {model.license && ( +
+ + 许可证: {model.license} +
+ )} +
+ + {/* Main content grid */} +
+ {/* Parameters */} +
+

+ + 模型参数 +

+
+
+ 参数量 + {formatParams(model.parametersCount)} +
+
+ 层数 + {model.layers || '-'} +
+
+ 隐藏层维度 + {model.hiddenSize || '-'} +
+
+ 注意力头数 + {model.attentionHeads || '-'} +
+
+ 上下文长度 + {formatContext(model.contextLength)} +
+
+
+ + {/* Performance */} +
+

+ + 性能评分 +

+
+
+ MMLU + + {model.benchmarkMmlu ? `${model.benchmarkMmlu}%` : '-'} + +
+
+ HumanEval + + {model.benchmarkHumaneval ? `${model.benchmarkHumaneval}%` : '-'} + +
+
+
+ + {/* Deployment requirements */} + {model.minVramFp16 && ( +
+

+ + 部署要求 +

+
+
+ FP16 推理显存 + {model.minVramFp16}GB +
+ {model.minVramInt8 && ( +
+ INT8 推理显存 + {model.minVramInt8}GB +
+ )} + {model.minVramInt4 && ( +
+ INT4 推理显存 + {model.minVramInt4}GB +
+ )} +
+
+ )} +
+ + {/* Actions */} +
+ + 加入对比 + + + 计算显存需求 + +
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/models/page.tsx b/src/app/models/page.tsx new file mode 100644 index 0000000..63a78b0 --- /dev/null +++ b/src/app/models/page.tsx @@ -0,0 +1,109 @@ +import { useState } from 'react' +import { Search, Filter, ArrowUpDown, Layers } from 'lucide-react' +import { models, Model } from '@/data/initial' +import { ModelCard } from '@/components/models/ModelCard' + +export default function ModelsPage() { + const [search, setSearch] = useState('') + const [sortBy, setSortBy] = useState<'name' | 'params' | 'mmlu'>('name') + const [filterSource, setFilterSource] = useState<'all' | 'open' | 'closed'>('all') + + const filteredModels = models + .filter((m) => { + if (search && !m.name.toLowerCase().includes(search.toLowerCase())) return false + if (filterSource === 'open' && !m.isOpenSource) return false + if (filterSource === 'closed' && m.isOpenSource) return false + return true + }) + .sort((a, b) => { + if (sortBy === 'params') { + return (b.parametersCount || 0) - (a.parametersCount || 0) + } + if (sortBy === 'mmlu') { + return (b.benchmarkMmlu || 0) - (a.benchmarkMmlu || 0) + } + return a.name.localeCompare(b.name) + }) + + return ( +
+ {/* Header */} +
+
+

+ + 模型数据库 +

+

+ 收录 {models.length} 个大语言模型，包含参数规格、性能指标、部署要求 +

+
+
+ + {/* Filters */} +
+
+
+ {/* Search */} +
+ + setSearch(e.target.value)} + className="bg-transparent border-none outline-none ml-2 text-sm w-full" + /> +
+ + {/* Source filter */} +
+ + +
+ + {/* Sort */} +
+ + +
+ + {/* Results count */} +
+ 显示 {filteredModels.length} 个模型 +
+
+
+ + {/* Model grid */} +
+ {filteredModels.map((model) => ( + + ))} +
+ + {filteredModels.length === 0 && ( +
+ 没有找到匹配的模型 +
+ )} +
+
+ ) +} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx new file mode 100644 index 0000000..9c98c85 --- /dev/null +++ b/src/app/page.tsx @@ -0,0 +1,204 @@ +import Link from 'next/link' +import { + Database, Cpu, Wrench, BookOpen, ArrowRight, + TrendingUp, Zap, DollarSign, BarChart3 +} from 'lucide-react' +import { ModelCard } from '@/components/models/ModelCard' +import { GpuCard } from '@/components/gpus/GpuCard' +import { models, gpus } from '@/data/initial' + +export default function HomePage() { + return ( +
+ {/* Hero Section */} +
+
+
+
+

+ 参数百科 + + AI模型与硬件参数速查平台 + +

+

+ 一站式查询大模型参数、GPU规格、CPU性能，提供智能对比和实用计算工具 +

+ + {/* Quick Search */} +
+
+ + +
+
+ + {/* Quick Stats */} +
+
+
100+
+
AI模型
+
+
+
50+
+
GPU型号
+
+
+
30+
+
CPU型号
+
+
+
10+
+
实用工具
+
+
+
+
+
+ + {/* Quick Entry Cards */} +
+
+
+ + +

模型数据库

+

+ GPT-4、Llama、Claude等100+大模型参数规格 +

+ + 浏览模型 + + + + + +

GPU数据库

+

+ H100、A100、RTX 4090等GPU详细规格对比 +

+ + 浏览GPU + + + + + +

计算工具

+

+ 显存计算、成本估算、参数量计算 +

+ + 使用工具 + + + + + +

知识库

+

+ 参数解释、选型指南、最佳实践 +

+ + 阅读文章 + + +
+
+
+ + {/* Featured Models */} +
+
+
+

热门模型

+ + 查看全部 + +
+
+ {models.slice(0, 4).map((model) => ( + + ))} +
+
+
+ + {/* Featured GPUs */} +
+
+
+

热门GPU

+ + 查看全部 + +
+
+ {gpus.slice(0, 4).map((gpu) => ( + + ))} +
+
+
+ + {/* Tools Highlight */} +
+
+

实用工具

+
+ + +

显存计算器

+

+ 计算模型推理和训练所需的显存大小 +

+ + + + +

训练成本估算

+

+ 估算模型训练的时间和成本 +

+ + + + +

参数对比

+

+ 对比多个模型或GPU的性能参数 +

+ +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/tools/page.tsx b/src/app/tools/page.tsx new file mode 100644 index 0000000..d4c23cd --- /dev/null +++ b/src/app/tools/page.tsx @@ -0,0 +1,228 @@ +'use client' + +import { useState, useMemo } from 'react' +import { Calculator, MemoryStick, AlertCircle, CheckCircle2 } from 'lucide-react' +import Link from 'next/link' +import { gpus } from '@/data/initial' + +export default function ToolsPage() { + // Calculator inputs + const [paramsB, setParamsB] = useState(7) + const [precision, setPrecision] = useState<'fp32' | 'fp16' | 'int8' | 'int4'>('fp16') + const [batchSize, setBatchSize] = useState(1) + const [seqLength, setSeqLength] = useState(2048) + + // Calculate VRAM requirements + const vramCalc = useMemo(() => { + const bytesPerParam = { + fp32: 4, + fp16: 2, + int8: 1, + int4: 0.5, + } + + // Model weights (params * bytes per param) + const modelParams = paramsB * 1e9 + const weightBytes = modelParams * bytesPerParam[precision] + const weightGB = weightBytes / (1024 ** 3) + + // Activation memory (rough estimate) + // For transformer: roughly 2 * batch_size * seq_len * hidden_size * layers * bytes + const hiddenSize = paramsB <= 7 ? 4096 : paramsB <= 14 ? 5120 : paramsB <= 70 ? 8192 : 12288 + const layers = paramsB <= 7 ? 32 : paramsB <= 14 ? 40 : paramsB <= 70 ? 80 : 96 + const activationBytes = 2 * batchSize * seqLength * hiddenSize * layers * bytesPerParam[precision] + const activationGB = activationBytes / (1024 ** 3) + + // KV Cache (rough estimate) + // 2 * batch_size * seq_len * 2 * hidden_size * layers * bytes / attention_heads_ratio + const kvBytes = 2 * batchSize * seqLength * 2 * hiddenSize * layers * bytesPerParam[precision] / 2 + const kvGB = kvBytes / (1024 ** 3) + + const totalGB = weightGB + activationGB + kvGB + 2 // +2GB overhead + + return { + weights: Math.round(weightGB), + activations: Math.round(activationGB), + kvCache: Math.round(kvGB), + total: Math.round(totalGB), + } + }, [paramsB, precision, batchSize, seqLength]) + + // Recommended GPUs + const recommendedGpus = useMemo(() => { + return gpus + .filter(g => g.memoryGb && g.memoryGb >= vramCalc.total) + .sort((a, b) => (a.memoryGb || 0) - (b.memoryGb || 0)) + .slice(0, 5) + }, [vramCalc.total]) + + return ( +
+ {/* Header */} +
+
+

+ + 实用工具 +

+

+ 显存计算器、成本估算器、参数对比工具 +

+
+
+ +
+ {/* Tool cards */} +
+ + +

显存计算器

+

计算模型推理和训练所需的显存大小

+ + + + +

训练成本估算

+

估算模型训练的时间和成本

+ + + + +

参数对比

+

对比多个模型或GPU的性能参数

+ +
+ + {/* VRAM Calculator */} +
+

+ + 显存计算器 +

+ +
+ {/* Input */} +
+

输入参数

+
+
+ + setParamsB(Number(e.target.value))} + className="w-full bg-slate-100 dark:bg-slate-700 rounded-lg px-4 py-2 border-none outline-none" + /> +
+ +
+ + +
+ +
+ + setBatchSize(Number(e.target.value))} + min={1} + className="w-full bg-slate-100 dark:bg-slate-700 rounded-lg px-4 py-2 border-none outline-none" + /> +
+ +
+ + setSeqLength(Number(e.target.value))} + min={1} + className="w-full bg-slate-100 dark:bg-slate-700 rounded-lg px-4 py-2 border-none outline-none" + /> +
+
+
+ + {/* Output */} +
+

计算结果

+
+
+
+ 模型权重 + {vramCalc.weights} GB +
+
+ 激活值 + {vramCalc.activations} GB +
+
+ KV Cache + {vramCalc.kvCache} GB +
+
+ 总计显存需求 + {vramCalc.total} GB +
+
+
+ + {/* Recommended GPUs */} +

推荐GPU配置

+ {recommendedGpus.length > 0 ? ( +
+ {recommendedGpus.map((gpu) => ( +
+
+ + {gpu.name} +
+ {gpu.memoryGb}GB +
+ ))} +
+ ) : ( +
+ + 没有找到足够显存的GPU，需要多卡配置 +
+ )} +
+
+ + {/* Formula explanation */} +
+

计算公式说明:

+
    +
  • 模型权重 = 参数量 × 字节/参数 (FP32=4, FP16=2, INT8=1, INT4=0.5)
    • +
  • 激活值 ≈ 2 × batch × seq_len × hidden_size × layers × bytes
    • +
  • KV Cache ≈ 2 × batch × seq_len × 2 × hidden_size × layers × bytes
    • +
+
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/app/tools/vram-calculator/page.tsx b/src/app/tools/vram-calculator/page.tsx new file mode 100644 index 0000000..64b8697 --- /dev/null +++ b/src/app/tools/vram-calculator/page.tsx @@ -0,0 +1,2 @@ +// Redirect to main tools page +export { default } from '../page' \ No newline at end of file diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx new file mode 100644 index 0000000..5245f2e --- /dev/null +++ b/src/components/Footer.tsx @@ -0,0 +1,59 @@ +import Link from 'next/link' +import { Database, Github, Twitter } from 'lucide-react' + +export function Footer() { + return ( +
+
+
+ {/* Brand */} +
+ +
+ +
+ 参数百科 + +

+ 一站式AI大模型参数与硬件参数速查平台，为开发者、研究人员和工程师提供快速查询、智能对比和实用工具。 +

+ +
+ + {/* Quick Links */} +
+

快速链接

+
    +
  • 模型库
    • +
  • GPU库
    • +
  • CPU库
    • +
  • 对比工具
    • +
+
+ + {/* Tools */} +
+

实用工具

+
    +
  • 显存计算器
    • +
  • 训练成本估算
    • +
  • 推理成本计算
    • +
  • 知识库
    • +
+
+
+ +
+

© 2024 参数百科 ParamHub. All rights reserved.

+
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/Header.tsx b/src/components/Header.tsx new file mode 100644 index 0000000..6eb2e25 --- /dev/null +++ b/src/components/Header.tsx @@ -0,0 +1,89 @@ +'use client' + +import Link from 'next/link' +import { useState } from 'react' +import { Search, Menu, X, Cpu, Database, Wrench, BookOpen } from 'lucide-react' + +export function Header() { + const [isMenuOpen, setIsMenuOpen] = useState(false) + + const navItems = [ + { href: '/models', label: '模型库', icon: Database }, + { href: '/gpus', label: 'GPU库', icon: Cpu }, + { href: '/cpus', label: 'CPU库', icon: Cpu }, + { href: '/tools', label: '工具', icon: Wrench }, + { href: '/knowledge', label: '知识库', icon: BookOpen }, + ] + + return ( +
+
+
+ {/* Logo */} + +
+ +
+ 参数百科 + + + {/* Desktop Navigation */} + + + {/* Search & Actions */} +
+
+ + + + ⌘K + +
+ + {/* Mobile menu button */} + +
+
+ + {/* Mobile Navigation */} + {isMenuOpen && ( +
+ +
+ )} +
+
+ ) +} \ No newline at end of file diff --git a/src/components/gpus/GpuCard.tsx b/src/components/gpus/GpuCard.tsx new file mode 100644 index 0000000..5786e38 --- /dev/null +++ b/src/components/gpus/GpuCard.tsx @@ -0,0 +1,89 @@ +'use client' + +import Link from 'next/link' +import { Cpu, MemoryStick, Zap, DollarSign } from 'lucide-react' +import { Gpu } from '@/data/initial' + +interface GpuCardProps { + gpu: Gpu +} + +export function GpuCard({ gpu }: GpuCardProps) { + const manufacturerColor = { + NVIDIA: 'text-green-600 bg-green-100 dark:bg-green-900/30', + AMD: 'text-red-600 bg-red-100 dark:bg-red-900/30', + Intel: 'text-blue-600 bg-blue-100 dark:bg-blue-900/30', + }[gpu.manufacturer] || 'text-slate-600 bg-slate-100' + + return ( + +
+ {/* Header */} +
+
+

{gpu.name}

+ + {gpu.manufacturer} + +
+
+ + {/* Key specs */} +
+ {gpu.memoryGb && ( +
+ + 显存 + + {gpu.memoryGb}GB {gpu.memoryType} +
+ )} + + {gpu.cudaCores && ( +
+ + CUDA核心 + + {gpu.cudaCores.toLocaleString()} +
+ )} + + {gpu.fp16Tflops && ( +
+ + FP16算力 + + {gpu.fp16Tflops.toLocaleString()} TFLOPS +
+ )} + + {gpu.priceUsd && ( +
+ + 价格 + + + ${gpu.priceUsd >= 10000 ? `${(gpu.priceUsd / 1000).toFixed(0)}K` : gpu.priceUsd.toLocaleString()} + +
+ )} +
+ + {/* Architecture & Use case */} +
+ {gpu.architecture} +
+ {gpu.recommendedFor.map((use) => ( + + {use} + + ))} +
+
+
+ + ) +} \ No newline at end of file diff --git a/src/components/models/ModelCard.tsx b/src/components/models/ModelCard.tsx new file mode 100644 index 0000000..e4b3553 --- /dev/null +++ b/src/components/models/ModelCard.tsx @@ -0,0 +1,84 @@ +'use client' + +import Link from 'next/link' +import { Lock, Unlock, BarChart2, MemoryStick } from 'lucide-react' +import { Model } from '@/data/initial' + +interface ModelCardProps { + model: Model +} + +export function ModelCard({ model }: ModelCardProps) { + const formatParams = (params: number | null) => { + if (params === null) return '未公开' + if (params >= 1000) return `${params / 1000}T` + return `${params}B` + } + + return ( + +
+ {/* Header */} +
+
+

{model.name}

+

{model.organization}

+
+ {model.isOpenSource ? ( +
+ + 开源 +
+ ) : ( +
+ + 闭源 +
+ )} +
+ + {/* Key specs */} +
+
+ 参数量 + {formatParams(model.parametersCount)} +
+ + {model.contextLength && ( +
+ 上下文 + + {model.contextLength >= 1000 ? `${model.contextLength / 1000}K` : model.contextLength} + +
+ )} + + {model.benchmarkMmlu && ( +
+ + MMLU + + {model.benchmarkMmlu}% +
+ )} + + {model.minVramFp16 && ( +
+ + 显存(FP16) + + {model.minVramFp16}GB +
+ )} +
+ + {/* Architecture badge */} + {model.architecture && ( +
+ {model.architecture} +
+ )} +
+ + ) +} \ No newline at end of file diff --git a/src/data/initial.ts b/src/data/initial.ts new file mode 100644 index 0000000..7eb9bc2 --- /dev/null +++ b/src/data/initial.ts @@ -0,0 +1,544 @@ +// 初始数据 - 用于展示 + +export interface Model { + name: string + slug: string + organization: string + parametersCount: number | null // in billions + architecture: string | null + layers: number | null + hiddenSize: number | null + attentionHeads: number | null + contextLength: number | null + isOpenSource: boolean + license: string | null + benchmarkMmlu: number | null + benchmarkHumaneval: number | null + minVramFp16: number | null + minVramInt8: number | null + minVramInt4: number | null +} + +export interface Gpu { + name: string + slug: string + manufacturer: string + architecture: string | null + cudaCores: number | null + tensorCores: number | null + memoryGb: number | null + memoryType: string | null + memoryBandwidthGbps: number | null + fp32Tflops: number | null + fp16Tflops: number | null + tdpWatts: number | null + priceUsd: number | null + recommendedFor: string[] +} + +// 模型数据 +export const models: Model[] = [ + { + name: "GPT-4", + slug: "gpt-4", + organization: "OpenAI", + parametersCount: null, // 未公开 + architecture: "Transformer (MoE)", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 128000, + isOpenSource: false, + license: null, + benchmarkMmlu: 92.3, + benchmarkHumaneval: 87.1, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "GPT-4 Turbo", + slug: "gpt-4-turbo", + organization: "OpenAI", + parametersCount: null, + architecture: "Transformer (MoE)", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 128000, + isOpenSource: false, + license: null, + benchmarkMmlu: 92.3, + benchmarkHumaneval: 88.2, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Llama 3 70B", + slug: "llama-3-70b", + organization: "Meta", + parametersCount: 70, + architecture: "Transformer", + layers: 80, + hiddenSize: 8192, + attentionHeads: 64, + contextLength: 8192, + isOpenSource: true, + license: "Llama 3 Community License", + benchmarkMmlu: 85.6, + benchmarkHumaneval: 68.2, + minVramFp16: 140, + minVramInt8: 70, + minVramInt4: 40, + }, + { + name: "Llama 3 8B", + slug: "llama-3-8b", + organization: "Meta", + parametersCount: 8, + architecture: "Transformer", + layers: 32, + hiddenSize: 4096, + attentionHeads: 32, + contextLength: 8192, + isOpenSource: true, + license: "Llama 3 Community License", + benchmarkMmlu: 66.7, + benchmarkHumaneval: 35.1, + minVramFp16: 16, + minVramInt8: 8, + minVramInt4: 5, + }, + { + name: "Claude 3 Opus", + slug: "claude-3-opus", + organization: "Anthropic", + parametersCount: null, + architecture: "Transformer", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 200000, + isOpenSource: false, + license: null, + benchmarkMmlu: 90.1, + benchmarkHumaneval: 84.9, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Claude 3 Sonnet", + slug: "claude-3-sonnet", + organization: "Anthropic", + parametersCount: null, + architecture: "Transformer", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 200000, + isOpenSource: false, + license: null, + benchmarkMmlu: 79.0, + benchmarkHumaneval: 73.0, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Claude 3 Haiku", + slug: "claude-3-haiku", + organization: "Anthropic", + parametersCount: null, + architecture: "Transformer", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 200000, + isOpenSource: false, + license: null, + benchmarkMmlu: 75.2, + benchmarkHumaneval: 75.2, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Mistral Large", + slug: "mistral-large", + organization: "Mistral AI", + parametersCount: null, + architecture: "Transformer", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 32000, + isOpenSource: false, + license: null, + benchmarkMmlu: 84.0, + benchmarkHumaneval: 75.0, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Mixtral 8x7B", + slug: "mixtral-8x7b", + organization: "Mistral AI", + parametersCount: 47, // 有效参数量 + architecture: "Transformer (MoE)", + layers: 32, + hiddenSize: 4096, + attentionHeads: 32, + contextLength: 32000, + isOpenSource: true, + license: "Apache 2.0", + benchmarkMmlu: 70.6, + benchmarkHumaneval: 50.8, + minVramFp16: 90, + minVramInt8: 45, + minVramInt4: 26, + }, + { + name: "Mistral 7B", + slug: "mistral-7b", + organization: "Mistral AI", + parametersCount: 7, + architecture: "Transformer (Sliding Window)", + layers: 32, + hiddenSize: 4096, + attentionHeads: 32, + contextLength: 8192, + isOpenSource: true, + license: "Apache 2.0", + benchmarkMmlu: 62.5, + benchmarkHumaneval: 36.8, + minVramFp16: 14, + minVramInt8: 7, + minVramInt4: 4, + }, + { + name: "Qwen 2 72B", + slug: "qwen-2-72b", + organization: "Alibaba", + parametersCount: 72, + architecture: "Transformer", + layers: 80, + hiddenSize: 8192, + attentionHeads: 64, + contextLength: 131072, + isOpenSource: true, + license: "Apache 2.0", + benchmarkMmlu: 84.2, + benchmarkHumaneval: 64.6, + minVramFp16: 145, + minVramInt8: 72, + minVramInt4: 40, + }, + { + name: "DeepSeek V2", + slug: "deepseek-v2", + organization: "DeepSeek", + parametersCount: 236, // 总参数量，有效21B + architecture: "Transformer (MoE)", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 128000, + isOpenSource: true, + license: "DeepSeek License", + benchmarkMmlu: 78.5, + benchmarkHumaneval: 68.5, + minVramFp16: 80, // 活跃参数约21B + minVramInt8: 40, + minVramInt4: 21, + }, + { + name: "Gemini 1.5 Pro", + slug: "gemini-1-5-pro", + organization: "Google", + parametersCount: null, + architecture: "Transformer (MoE)", + layers: null, + hiddenSize: null, + attentionHeads: null, + contextLength: 1000000, + isOpenSource: false, + license: null, + benchmarkMmlu: 85.9, + benchmarkHumaneval: 71.9, + minVramFp16: null, + minVramInt8: null, + minVramInt4: null, + }, + { + name: "Gemma 7B", + slug: "gemma-7b", + organization: "Google", + parametersCount: 7, + architecture: "Transformer", + layers: 28, + hiddenSize: 3072, + attentionHeads: 16, + contextLength: 8192, + isOpenSource: true, + license: "Gemma Terms of Use", + benchmarkMmlu: 64.3, + benchmarkHumaneval: 32.7, + minVramFp16: 14, + minVramInt8: 7, + minVramInt4: 4, + }, + { + name: "Phi-3 Medium", + slug: "phi-3-medium", + organization: "Microsoft", + parametersCount: 14, + architecture: "Transformer", + layers: 40, + hiddenSize: 5120, + attentionHeads: 40, + contextLength: 128000, + isOpenSource: true, + license: "MIT", + benchmarkMmlu: 78.0, + benchmarkHumaneval: 62.5, + minVramFp16: 28, + minVramInt8: 14, + minVramInt4: 8, + }, +] + +// GPU数据 +export const gpus: Gpu[] = [ + { + name: "NVIDIA H100 80GB", + slug: "h100-80gb", + manufacturer: "NVIDIA", + architecture: "Hopper", + cudaCores: 16896, + tensorCores: 528, + memoryGb: 80, + memoryType: "HBM3", + memoryBandwidthGbps: 3352, + fp32Tflops: 67, + fp16Tflops: 1979, // with sparsity + tdpWatts: 700, + priceUsd: 30000, + recommendedFor: ["training", "inference"], + }, + { + name: "NVIDIA H100 80GB (PCIe)", + slug: "h100-80gb-pcie", + manufacturer: "NVIDIA", + architecture: "Hopper", + cudaCores: 16896, + tensorCores: 528, + memoryGb: 80, + memoryType: "HBM3", + memoryBandwidthGbps: 3352, + fp32Tflops: 67, + fp16Tflops: 1979, + tdpWatts: 700, + priceUsd: 25000, + recommendedFor: ["training", "inference"], + }, + { + name: "NVIDIA A100 80GB", + slug: "a100-80gb", + manufacturer: "NVIDIA", + architecture: "Ampere", + cudaCores: 6912, + tensorCores: 432, + memoryGb: 80, + memoryType: "HBM2e", + memoryBandwidthGbps: 2039, + fp32Tflops: 19.5, + fp16Tflops: 312, + tdpWatts: 400, + priceUsd: 15000, + recommendedFor: ["training", "inference"], + }, + { + name: "NVIDIA A100 40GB", + slug: "a100-40gb", + manufacturer: "NVIDIA", + architecture: "Ampere", + cudaCores: 6912, + tensorCores: 432, + memoryGb: 40, + memoryType: "HBM2e", + memoryBandwidthGbps: 1555, + fp32Tflops: 19.5, + fp16Tflops: 312, + tdpWatts: 400, + priceUsd: 10000, + recommendedFor: ["training", "inference"], + }, + { + name: "NVIDIA RTX 4090", + slug: "rtx-4090", + manufacturer: "NVIDIA", + architecture: "Ada Lovelace", + cudaCores: 16384, + tensorCores: 512, + memoryGb: 24, + memoryType: "GDDR6X", + memoryBandwidthGbps: 1008, + fp32Tflops: 82.6, + fp16Tflops: 165.2, + tdpWatts: 450, + priceUsd: 1599, + recommendedFor: ["inference", "development"], + }, + { + name: "NVIDIA RTX 4080", + slug: "rtx-4080", + manufacturer: "NVIDIA", + architecture: "Ada Lovelace", + cudaCores: 9728, + tensorCores: 304, + memoryGb: 16, + memoryType: "GDDR6X", + memoryBandwidthGbps: 717, + fp32Tflops: 52.2, + fp16Tflops: 104.4, + tdpWatts: 320, + priceUsd: 1199, + recommendedFor: ["inference", "development"], + }, + { + name: "NVIDIA A6000", + slug: "a6000", + manufacturer: "NVIDIA", + architecture: "Ampere", + cudaCores: 10752, + tensorCores: 336, + memoryGb: 48, + memoryType: "GDDR6", + memoryBandwidthGbps: 768, + fp32Tflops: 38.7, + fp16Tflops: 77.4, + tdpWatts: 300, + priceUsd: 4650, + recommendedFor: ["inference", "workstation"], + }, + { + name: "NVIDIA A10", + slug: "a10", + manufacturer: "NVIDIA", + architecture: "Ampere", + cudaCores: 7296, + tensorCores: 224, + memoryGb: 24, + memoryType: "GDDR6", + memoryBandwidthGbps: 600, + fp32Tflops: 31.2, + fp16Tflops: 62.5, + tdpWatts: 150, + priceUsd: 3000, + recommendedFor: ["inference"], + }, + { + name: "AMD MI300X", + slug: "mi300x", + manufacturer: "AMD", + architecture: "CDNA 3", + cudaCores: null, + tensorCores: null, + memoryGb: 192, + memoryType: "HBM3", + memoryBandwidthGbps: 5300, + fp32Tflops: 81, + fp16Tflops: 1300, + tdpWatts: 750, + priceUsd: 35000, + recommendedFor: ["training", "inference"], + }, + { + name: "AMD MI250X", + slug: "mi250x", + manufacturer: "AMD", + architecture: "CDNA 2", + cudaCores: null, + tensorCores: null, + memoryGb: 128, + memoryType: "HBM2e", + memoryBandwidthGbps: 3276, + fp32Tflops: 38, + fp16Tflops: 383, + tdpWatts: 560, + priceUsd: 15000, + recommendedFor: ["training", "inference"], + }, +] + +// CPU数据 +export interface Cpu { + name: string + slug: string + manufacturer: string + architecture: string | null + cores: number | null + threads: number | null + baseClockGhz: number | null + boostClockGhz: number | null + l3CacheMb: number | null + tdpWatts: number | null + memoryType: string | null + memoryChannels: number | null + pcieLanes: number | null + priceUsd: number | null +} + +export const cpus: Cpu[] = [ + { + name: "AMD EPYC 9654", + slug: "epyc-9654", + manufacturer: "AMD", + architecture: "Zen 4", + cores: 96, + threads: 192, + baseClockGhz: 2.4, + boostClockGhz: 3.7, + l3CacheMb: 384, + tdpWatts: 360, + memoryType: "DDR5-4800", + memoryChannels: 12, + pcieLanes: 128, + priceUsd: 10500, + }, + { + name: "AMD EPYC 9554", + slug: "epyc-9554", + manufacturer: "AMD", + architecture: "Zen 4", + cores: 64, + threads: 128, + baseClockGhz: 3.1, + boostClockGhz: 3.8, + l3CacheMb: 256, + tdpWatts: 360, + memoryType: "DDR5-4800", + memoryChannels: 12, + pcieLanes: 128, + priceUsd: 7100, + }, + { + name: "Intel Xeon w9-3595X", + slug: "xeon-w9-3595x", + manufacturer: "Intel", + architecture: "Sapphire Rapids", + cores: 56, + threads: 112, + baseClockGhz: 2.0, + boostClockGhz: 4.0, + l3CacheMb: 105, + tdpWatts: 350, + memoryType: "DDR5-4800", + memoryChannels: 8, + pcieLanes: 112, + priceUsd: 5500, + }, +] \ No newline at end of file diff --git a/tailwind.config.js b/tailwind.config.js new file mode 100644 index 0000000..d85982d --- /dev/null +++ b/tailwind.config.js @@ -0,0 +1,27 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = { + content: [ + './src/pages/**/*.{js,ts,jsx,tsx,mdx}', + './src/components/**/*.{js,ts,jsx,tsx,mdx}', + './src/app/**/*.{js,ts,jsx,tsx,mdx}', + ], + theme: { + extend: { + colors: { + primary: { + 50: '#f0f9ff', + 100: '#e0f2fe', + 200: '#bae6fd', + 300: '#7dd3fc', + 400: '#38bdf8', + 500: '#0ea5e9', + 600: '#0284c7', + 700: '#0369a1', + 800: '#075985', + 900: '#0c4a6e', + }, + }, + }, + }, + plugins: [], +} \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..56e0fa9 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true, + "plugins": [ + { + "name": "next" + } + ], + "paths": { + "@/*": ["./src/*"] + } + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], + "exclude": ["node_modules"] +} \ No newline at end of file