See how Amp Tab's advanced AI completion compares with other tools across real-world coding scenarios.
Click the link above to see side-by-side video comparisons.
- Side-by-side comparisons - Watch Amp Tab vs competitors simultaneously
- Independent controls - Each video has its own playback controls
- Mobile responsive - Perfect viewing on any device
- Zero dependencies - Just HTML + JavaScript, no servers needed
amp-tab-demos/
├── index.html # 🎬 Main comparison page (186 lines, demos embedded)
├── demos/ # 📁 Video files
│ ├── delete-interface-fields/
│ │ ├── README.md # Demo details & reproduction steps
│ │ ├── amp_tab.mp4 # Amp Tab demo
│ │ └── cursor_tab.mp4 # Competitor demo
│ └── delete-proxy-variable/
│ ├── README.md # Demo details & reproduction steps
│ ├── amp_tab.mp4
│ └── cursor_tab.mp4
├── .github/workflows/pages.yml # Auto-deploy to GitHub Pages
├── .gitattributes # Git attributes (no LFS)
├── .gitignore # Standard ignore rules
├── LICENSE # MIT License
└── README.md # This file
- Add videos to a new folder in
demos/
- Update the
DEMOS_DATA
object inindex.html
:{ "id": "new-demo", "title": "My New Demo", "description": "Description of what this demo shows...", "tags": ["completion", "refactoring"], "videos": { "amp": "demos/new-demo/amp_tab.mp4", "cursor": "demos/new-demo/cursor_tab.mp4" } }
- Commit and push - GitHub Pages will auto-deploy!
To add more competitors (VS Code, GitHub Copilot, etc.):
-
Add video paths to the
DEMOS_DATA
object inindex.html
:"videos": { "amp": "demos/demo-name/amp_tab.mp4", "cursor": "demos/demo-name/cursor_tab.mp4", "copilot": "demos/demo-name/github_copilot.mp4" }
-
Update the HTML template in
index.html
to render additional video containers.
The system is designed to be easily extensible for any number of AI completion tools.