diff options
Diffstat (limited to 'doc/CNN_V2_WEB_TOOL.md')
| -rw-r--r-- | doc/CNN_V2_WEB_TOOL.md | 56 |
1 files changed, 44 insertions, 12 deletions
diff --git a/doc/CNN_V2_WEB_TOOL.md b/doc/CNN_V2_WEB_TOOL.md index a5162a6..8c661b2 100644 --- a/doc/CNN_V2_WEB_TOOL.md +++ b/doc/CNN_V2_WEB_TOOL.md @@ -6,7 +6,7 @@ Browser-based WebGPU tool for validating CNN v2 inference with layer visualizati --- -## Status (2026-02-13 evening) +## Status (2026-02-13) **Working:** - ✅ WebGPU initialization and device setup @@ -19,8 +19,18 @@ Browser-based WebGPU tool for validating CNN v2 inference with layer visualizati - ✅ Layer naming matches codebase convention (Layer 0, Layer 1, Layer 2) - ✅ Static features split visualization (Static 0-3, Static 4-7) - ✅ All layers visible including output layer (Layer 2) +- ✅ Video playback support (MP4, WebM) with frame-by-frame controls +- ✅ Video looping (automatic continuous playback) +- ✅ Mip level selection (p0-p3 features at different resolutions) -**Recent Fixes:** +**Recent Changes (Latest):** +- Code refactoring: Extracted FULLSCREEN_QUAD_VS shader (reused 3× across pipelines) +- Added helper methods: `getDimensions()`, `setVideoControlsEnabled()` +- Improved code organization with section headers and comments +- Moved Mip Level selector to bottom of left sidebar (removed "Features (p0-p3)" label) +- Added `loop` attribute to video element for automatic continuous playback + +**Previous Fixes:** - Fixed Layer 2 not appearing (was excluded from layerOutputs due to isOutput check) - Fixed canvas context switching (force clear before recreation) - Added Static 0-3 / Static 4-7 buttons to view all 8 static feature channels @@ -38,8 +48,25 @@ Browser-based WebGPU tool for validating CNN v2 inference with layer visualizati ### File Structure - Single-file HTML tool (~1100 lines) - Embedded shaders: STATIC_SHADER, CNN_SHADER, DISPLAY_SHADER, LAYER_VIZ_SHADER +- Shared WGSL component: FULLSCREEN_QUAD_VS (reused across render pipelines) - Pure WebGPU (no external dependencies) +### Code Organization + +**Recent Refactoring (2026-02-13):** +- Extracted `FULLSCREEN_QUAD_VS` constant: Reused fullscreen quad vertex shader (2 triangles covering NDC) +- Added helper methods to CNNTester class: + - `getDimensions()`: Returns current source dimensions (video or image) + - `setVideoControlsEnabled(enabled)`: Centralized video control enable/disable +- Consolidated duplicate vertex shader code (used in mipmap generation, display, layer visualization) +- Added section headers in JavaScript for better navigation +- Improved inline comments explaining shader architecture + +**Benefits:** +- Reduced code duplication (~40 lines saved) +- Easier maintenance (single source of truth for fullscreen quad) +- Clearer separation of concerns + ### Key Components **1. Weight Parsing** @@ -168,18 +195,23 @@ For each CNN layer i: - Drop zone for .bin weight files ### Content Area -**Left:** Main canvas (CNN output display) -**Right:** Sidebar with panels: -1. **Layer Visualization Panel** (top, flex: 1) - - Mode tabs: Activations / Weights - - Layer selection buttons (Static L0, Layer 1, Layer 2, ...) - - 2×2 grid of channel views +**Left Sidebar (300px):** +1. Drop zone for .bin weight files +2. Weights Info panel (file size, layer table with min/max) +3. Weights Visualization panel (per-layer kernel display) +4. **Mip Level selector** (bottom) - Select p0/p1/p2 for static features + +**Main Canvas (center):** +- CNN output display with video controls (Play/Pause, Frame ◄/►) +- Supports both PNG images and video files (MP4, WebM) +- Video loops automatically for continuous playback -2. **Weights Info Panel** (bottom, collapsible) - - File size, layer count - - Per-layer table: size, weight count, min/max - - Click header to collapse/expand +**Right Sidebar (panels):** +1. **Layer Visualization Panel** (top, flex: 1) + - Layer selection buttons (Static 0-3, Static 4-7, Layer 0, Layer 1, ...) + - 2×2 grid of channel views (grayscale activations) + - 4× zoom view at bottom ### Footer - Status line (GPU timing, dimensions, mode) |