https://github.com/benallfree/van13k
A VanJS-based js13k starter kit
https://github.com/benallfree/van13k
css-modules js13k js13kgames js13kgames2025 typescript vanjs vite
Last synced: 3 months ago
JSON representation
A VanJS-based js13k starter kit
- Host: GitHub
- URL: https://github.com/benallfree/van13k
- Owner: benallfree
- Created: 2025-06-14T00:00:49.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2025-06-24T04:52:50.000Z (3 months ago)
- Last Synced: 2025-06-24T05:29:17.450Z (3 months ago)
- Topics: css-modules, js13k, js13kgames, js13kgames2025, typescript, vanjs, vite
- Language: TypeScript
- Homepage: https://van13k.benallfree.com/
- Size: 667 KB
- Stars: 3
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# Van13k - the js13k Starter Kit 🚀
## 📊 Build Stats
| Spec | Info |
| ----- | ------------------ |
| Build | 853 |
| Bytes | 2639 |A **2.6k** production-ready starter template for js13k game development featuring modern tooling, aggressive optimization, and real-time size monitoring.
## ✨ Features
### 🎯 **Ultra-Compact Framework**
- **van.js** - Minimal reactive framework (~1.2KB gzipped)
- **VanJS Routing** - Lightweight client-side routing
- Perfect for JS13K with minimal overhead
- Simple, reactive UI updates without bloat### 🔧 **Optimized Build System**
- **Vite** - Lightning-fast development server
- **Terser** - Aggressive minification and mangling
- **LightningCSS** - Fast CSS processing and optimization
- **ZIP** - Automated archive creation for submission
- Console stripping in production builds
- Module preload polyfill disabled for smaller bundles### 📏 **Real-time Size Monitoring**
- **Base starter size: ~2.6k** (leaves 10.4k for your game!)
- Automated 13KB limit checking after each build
- Live file watching with `bun size:watch`
- macOS notifications when approaching size limit
- Build stats automatically updated in README### 🛠️ **Developer Experience**
- **TypeScript** - Full type safety and IntelliSense
- **CSS Modules** - Scoped styling with class name hashing
- **Path aliases** - Clean imports (`@/`, `$util/`, `$components/`)
- **Prettier** - Consistent code formatting
- **Bundle analyzer** - Visualize what's taking up space### 📦 **Automated Workflow**
- Pre/post build scripts for version management
- Automatic README updates with build stats
- ZIP creation and size validation
- **Cloudflare Deployment** - Production hosting setup
- Ready for contest submission### 🎮 **JS13K Optimizations**
- Drop console statements in production
- Toplevel variable mangling
- Module preload polyfill removal
- Aggressive compression settings## 🚀 Quick Start
```bash
# Install dependencies
bun install# Start development server
bun dev# Build and check size
bun size# Watch for changes and auto-rebuild
bun size:watch# Analyze bundle composition
bun analyze
```## 🎯 Why This Starter?
**For JS13K Success:**
- ⚡ **Fast iteration** - Hot reload during development
- 📈 **Size awareness** - Constant feedback on bundle size
- 🔍 **Bundle analysis** - Identify optimization opportunities
- 🎨 **Modern DX** - TypeScript, path aliases, formatting
- 📱 **Production ready** - Optimized builds with aggressive compression**Perfect for:**
- First-time JS13K participants
- Developers wanting modern tooling
- Teams needing size monitoring
- Projects requiring reactive UI updatesStart building your JS13K masterpiece with confidence! 🎮