- {/* Header */}
-
- )
-}
diff --git a/consumer-guide/app/tuning/page.tsx b/consumer-guide/app/tuning/page.tsx
deleted file mode 100644
index 526002d23..000000000
--- a/consumer-guide/app/tuning/page.tsx
+++ /dev/null
@@ -1,823 +0,0 @@
-"use client"
-
-import { useState, useMemo } from "react"
-import {
- Monitor, Cpu, Film, Sparkles, Zap, HardDrive, BarChart3,
- Copy, Check, Info, ChevronDown, ChevronUp, Settings2,
- Layers, Clock, Database, Gauge
-} from "lucide-react"
-import Link from "next/link"
-
-// Types
-interface Config {
- // Category A - Model & Hardware
- model_id: string
- workload_type: string
- gpu: string
- num_gpus: number
- // Category B - Video Spec
- height: number
- width: number
- num_frames: number
- fps: number
- // Category C - Quality
- num_inference_steps: number
- guidance_scale: number
- embedded_cfg_scale: number
- flow_shift: number | null
- seed: number
- // Category D - Speed
- attention_backend: string
- VSA_sparsity: number
- dmd_denoising_steps: string
- // Category E - Memory
- dit_cpu_offload: boolean
- dit_layerwise_offload: boolean
- vae_cpu_offload: boolean
- text_encoder_cpu_offload: boolean
- image_encoder_cpu_offload: boolean
- pin_cpu_memory: boolean
- use_fsdp_inference: boolean
-}
-
-const modelOptions = [
- { id: "FastVideo/FastWan2.1-T2V-1.3B-Diffusers", name: "FastWan 1.3B (T2V)", size: "1.3B" },
- { id: "Wan-AI/Wan2.1-T2V-14B-Diffusers", name: "Wan 14B (T2V)", size: "14B" },
- { id: "Wan-AI/Wan2.1-I2V-14B-480P-Diffusers", name: "Wan 14B I2V 480P", size: "14B" },
- { id: "Wan-AI/Wan2.1-I2V-14B-720P-Diffusers", name: "Wan 14B I2V 720P", size: "14B" },
-]
-
-const workloadOptions = [
- { id: "t2v", name: "Text to Video", icon: Film },
- { id: "i2v", name: "Image to Video", icon: Sparkles },
- { id: "ti2v", name: "Text+Image to Video", icon: Layers },
- { id: "action", name: "Action", icon: Zap },
-]
-
-const gpuOptions = [
- { id: "rtx4090", name: "RTX 4090", vram: "24GB" },
- { id: "rtx5090", name: "RTX 5090", vram: "32GB" },
- { id: "a100", name: "A100", vram: "40/80GB" },
- { id: "h100", name: "H100", vram: "80GB" },
-]
-
-const resolutionPresets = [
- { height: 480, width: 832, label: "480p (832×480)" },
- { height: 720, width: 1280, label: "720p (1280×720)" },
- { height: 1080, width: 1920, label: "1080p (1920×1080)" },
-]
-
-const framePresets = [
- { frames: 49, label: "49 frames (~2s @24fps)" },
- { frames: 81, label: "81 frames (~3.4s @24fps)" },
- { frames: 121, label: "121 frames (~5s @24fps)" },
-]
-
-const attentionBackends = [
- { id: "FLASH_ATTN", name: "Flash Attention", desc: "Best quality-speed trade-off", speed: "Baseline" },
- { id: "VIDEO_SPARSE_ATTN", name: "Video Sparse Attention", desc: "~30% faster, minimal quality loss", speed: "Fast" },
- { id: "SAGE_ATTN", name: "Sage Attention", desc: "~40% faster, visible at high motion", speed: "Faster" },
- { id: "SLA_ATTN", name: "Sliding Tile Attention", desc: "Check model compatibility", speed: "Fast" },
-]
-
-// Tooltip component
-function Tooltip({ content }: { content: string }) {
- const [show, setShow] = useState(false)
- return (
-
-
-
-
-
-
-
-
- 
-
-
-
-
-
- Config Selector
-Choose your hardware and task to get a recommended configuration
-
- {/* Step 1: Task Selection */}
-
-
-
- {/* Step 2: Machine Specs */}
-
-
-
- {/* Step 3: Output Mode */}
-
-
-
- {/* Output Configuration */}
-
-
-
-
- 1
-
- What do you want to make?
-
- {TASKS.map(({ id, label, sub, icon: Icon }) => (
-
- ))}
-
-
- 2
-
- Your machine specs
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 3
-
- Output mode
-
- {TIERS.map(({ id, name, desc, badge }) => {
- const tierConfig = CONFIGS[task][id]
- return (
-
- )
- })}
-
- {warning && (
-
- {warning}
-
- )}
-
- ✓
-
- Your configuration
-
- {/* Meta Cards */}
-
-
-
- {/* Command Block */}
-
-
- Model
- {config.modelShort}
-
-
- Est. Generation Time
- {config.time}
-
-
- Peak VRAM
- {config.vram}
-
-
-
-
- {command}
-
-
-
- {show && (
-
- )
-}
-
-// Collapsible section
-function Section({
- title,
- icon: Icon,
- number,
- children,
- defaultOpen = true,
- color = "sky"
-}: {
- title: string
- icon: React.ElementType
- number: string
- children: React.ReactNode
- defaultOpen?: boolean
- color?: "sky" | "emerald" | "amber" | "violet" | "rose" | "slate"
-}) {
- const [open, setOpen] = useState(defaultOpen)
- const colorClasses = {
- sky: "bg-sky-500/20 text-sky-400",
- emerald: "bg-emerald-500/20 text-emerald-400",
- amber: "bg-amber-500/20 text-amber-400",
- violet: "bg-violet-500/20 text-violet-400",
- rose: "bg-rose-500/20 text-rose-400",
- slate: "bg-slate-500/20 text-slate-400",
- }
- const textColors = {
- sky: "text-sky-400",
- emerald: "text-emerald-400",
- amber: "text-amber-400",
- violet: "text-violet-400",
- rose: "text-rose-400",
- slate: "text-slate-400",
- }
-
- return (
-
- {content}
-
-
- )}
-
-
- {open &&
- )
-}
-
-// Input components
-function NumberInput({
- label,
- value,
- onChange,
- min,
- max,
- step = 1,
- tooltip,
- unit
-}: {
- label: string
- value: number
- onChange: (v: number) => void
- min?: number
- max?: number
- step?: number
- tooltip?: string
- unit?: string
-}) {
- return (
- {children}
}
-
-
-
- )
-}
-
-function SelectInput({
- label,
- value,
- onChange,
- options,
- tooltip
-}: {
- label: string
- value: string
- onChange: (v: string) => void
- options: { id: string; name: string; desc?: string }[]
- tooltip?: string
-}) {
- return (
-
- onChange(Number(e.target.value))}
- min={min}
- max={max}
- step={step}
- className="w-full rounded-lg border border-white/10 bg-slate-900/50 px-3 py-2.5 text-sm text-white focus:border-sky-500/50 focus:outline-none focus:ring-1 focus:ring-sky-500/50"
- />
- {unit && {unit}}
-
-
-
-
-
- )
-}
-
-function Toggle({
- label,
- checked,
- onChange,
- tooltip,
- disabled = false
-}: {
- label: string
- checked: boolean
- onChange: (v: boolean) => void
- tooltip?: string
- disabled?: boolean
-}) {
- return (
-
- )
-}
-
-export default function AdvancedTuningPage() {
- const [copied, setCopied] = useState(false)
- const [config, setConfig] = useState
- {/* Header */}
-
- )
-}
diff --git a/consumer-guide/components.json b/consumer-guide/components.json
deleted file mode 100644
index 4ee62ee10..000000000
--- a/consumer-guide/components.json
+++ /dev/null
@@ -1,21 +0,0 @@
-{
- "$schema": "https://ui.shadcn.com/schema.json",
- "style": "new-york",
- "rsc": true,
- "tsx": true,
- "tailwind": {
- "config": "",
- "css": "app/globals.css",
- "baseColor": "neutral",
- "cssVariables": true,
- "prefix": ""
- },
- "aliases": {
- "components": "@/components",
- "utils": "@/lib/utils",
- "ui": "@/components/ui",
- "lib": "@/lib",
- "hooks": "@/hooks"
- },
- "iconLibrary": "lucide"
-}
diff --git a/consumer-guide/components/theme-provider.tsx b/consumer-guide/components/theme-provider.tsx
deleted file mode 100644
index 55c2f6eb6..000000000
--- a/consumer-guide/components/theme-provider.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-'use client'
-
-import * as React from 'react'
-import {
- ThemeProvider as NextThemesProvider,
- type ThemeProviderProps,
-} from 'next-themes'
-
-export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
- return
-
-
-
-
-
-
-
-
-
-
-
-
- Quick Start
-
-
-
-
-
- Advanced Tuning Guide
-RTX 4090 / RTX 5090 - All 27 Parameters
-
- {/* Stats Bar */}
-
-
-
-
-
-
-
-
-
-
- {videoLength}s
-
-
-
-
- ~{estimatedTime}s
-
-
-
-
- {(totalPixels / 1000000).toFixed(1)}M
-
-
-
-
- {(computeCost / 1000000000).toFixed(2)}G
-
- {/* Left Column - Parameters */}
-
-
- {/* Category A - Model & Hardware */}
-
-
-
- {/* Category B - Video Spec */}
-
-
-
- {/* Category C - Quality */}
-
-
-
- {/* Category D - Speed */}
-
-
-
- {/* Category E - Memory */}
-
-
-
-
- {/* Right Column - Output */}
-
- updateConfig("workload_type", v)}
- options={workloadOptions.map(w => ({ id: w.id, name: w.name }))}
- tooltip="Task category. Determines which pipeline stages run."
- />
- updateConfig("gpu", v)}
- options={gpuOptions.map(g => ({ id: g.id, name: `${g.name} (${g.vram})` }))}
- tooltip="GPU model. Used for benchmark tracking and hardware-aware configuration."
- />
- updateConfig("num_gpus", v)}
- min={1}
- max={8}
- tooltip="Values > 1 require use_fsdp_inference = true."
- />
-
-
- updateConfig("model_id", v)}
- options={modelOptions.map(m => ({ id: m.id, name: `${m.name} (${m.size})` }))}
- tooltip="HuggingFace model path - uniquely identifies the model weights and architecture."
- />
-
-
-
-
-
-
-
- {resolutionPresets.map((preset) => (
-
- ))}
-
-
- updateConfig("height", v)}
- min={256}
- max={2160}
- step={8}
- unit="px"
- tooltip="Frame height in pixels. Must be divisible by 8 (VAE requirement)."
- />
- updateConfig("width", v)}
- min={256}
- max={3840}
- step={8}
- unit="px"
- tooltip="Frame width in pixels. Must be divisible by 8."
- />
-
-
-
-
-
- {framePresets.map((preset) => (
-
- ))}
-
-
- updateConfig("num_frames", v)}
- min={1}
- max={240}
- tooltip="Total number of frames to generate. Directly sets video duration at a given fps."
- />
- updateConfig("fps", v)}
- min={1}
- max={60}
- tooltip="Frames per second for the output video. Does NOT affect generation time."
- />
-
-
-
-
-
-
-
- updateConfig("num_inference_steps", Number(e.target.value))}
- className="flex-1 h-2 rounded-full bg-slate-700 appearance-none cursor-pointer [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-4 [&::-webkit-slider-thumb]:w-4 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-amber-400"
- />
- {config.num_inference_steps}
-
-
- Draft (10)
- Balanced (30)
- High (80)
-
-
-
-
-
- updateConfig("guidance_scale", Number(e.target.value))}
- className="flex-1 h-2 rounded-full bg-slate-700 appearance-none cursor-pointer [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-4 [&::-webkit-slider-thumb]:w-4 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-amber-400"
- />
- {config.guidance_scale}
-
-
- Loose (3)
- Balanced (5)
- Strict (8+)
-
-
- updateConfig("embedded_cfg_scale", v)}
- min={1}
- max={10}
- step={0.5}
- tooltip="Model-level CFG signal passed into the DiT. Default: 6.0. Rarely change."
- />
- updateConfig("seed", v)}
- min={-1}
- tooltip="Random seed. Set to -1 for random. Fix a seed for reproducibility."
- />
-
-
-
-
-
-
- {config.attention_backend === "VIDEO_SPARSE_ATTN" && (
-
- {attentionBackends.map((backend) => (
-
- ))}
-
-
-
-
- )}
- {isFastWanDMD && config.gpu === "rtx4090" && (
-
- updateConfig("VSA_sparsity", Number(e.target.value))}
- className="flex-1 h-2 rounded-full bg-slate-700 appearance-none cursor-pointer [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-4 [&::-webkit-slider-thumb]:w-4 [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-violet-400"
- />
- {config.VSA_sparsity}
-
-
-
- )}
-
-
-
- FastWan DMD uses 3-step distillation for ~10x faster generation.
-
-
- dmd_steps: {config.dmd_denoising_steps}
-
-
- updateConfig("dit_cpu_offload", v)}
- tooltip="Offload entire DiT to RAM. Saves ~4GB, ~2-3x slower."
- />
- updateConfig("dit_layerwise_offload", v)}
- tooltip="Layer-by-layer offload. Maximum VRAM saving (~8GB), ~4x slower."
- />
- updateConfig("vae_cpu_offload", v)}
- tooltip="Offload VAE decoder. Saves ~2GB. Minimal time penalty."
- />
- updateConfig("text_encoder_cpu_offload", v)}
- tooltip="Offload text encoder. Saves ~1-2GB. Runs once at start."
- />
- updateConfig("image_encoder_cpu_offload", v)}
- tooltip="I2V/TI2V only. Saves ~1-2GB."
- disabled={!isI2V}
- />
- updateConfig("pin_cpu_memory", v)}
- tooltip="Pins RAM pages for faster PCIe DMA transfers. Always enable with any offload flag."
- />
- updateConfig("use_fsdp_inference", v)}
- tooltip="Shards model weights across multiple GPUs via FSDP."
- disabled={config.num_gpus <= 1}
- />
-
-
-
-
- Tip: For 24GB VRAM with 14B models, enable dit_cpu_offload + vae_cpu_offload + pin_cpu_memory.
-
-
-
-
- {/* Generated Command */}
-
-
-
-
- {/* Quick Reference */}
-
-
-
-
-
-
- Generated Command
-
-
-
- {command}
-
-
-
- Quick Reference
-
-
-
- Resolution
- {config.width}x{config.height}
-
-
- Frames
- {config.num_frames}
-
-
- Steps
- {config.num_inference_steps}
-
-
- Backend
- {config.attention_backend}
-
-
- Offloading
-
- {[config.dit_cpu_offload && "DiT", config.vae_cpu_offload && "VAE"].filter(Boolean).join("+") || "None"}
-
-
- {children}
-
- {children}
-
-