https://cdnv.boomstream.com/balancer/JcFRrCxg-2uBj0vg0.mp4#t=0.001
Warriors
Challenge
Web
The Ultimate Constraint Event
72-Hour Battle Against Bloat
20 — 25
|
|
Warriors
Challenge
Web
The Ultimate Constraint Event
72-Hour Battle Against Bloat
20 — 25
■ Register Now ■
72-Hour Battle Against Bloat
The Ultimate Constraint Challenge
|
In an era of bloated frameworks and 10 MB JavaScript bundles, we’ve forgotten the raw power of vanilla web technologies — what if the web could be lightning-fast again? If constraints bred innovation instead of limitation?
The Thinking Of...
|
▓ Pure HTML, CSS, and JavaScript — No frameworks, no libraries, no shortcuts ✅
▓ Performance-first mindset — Every byte matters, every millisecond counts ✅
▓ Technical excellence — Prove that vanilla web can outperform any framework ✅
▓ Performance-first mindset — Every byte matters, every millisecond counts ✅
▓ Technical excellence — Prove that vanilla web can outperform any framework ✅
Build something extraordinary using only the fundamental web techs →
The Principal Challenge
Build with less. Create the impossible
적게 만들어 더 크게. 불가능을 창조하라
Choose 3 tracks from our 15 extreme constraint challenges and build one unified project that satisfies all three simultaneously. Each track represents a different technical frontier — from 1KB total file size to interfaces that work perfectly for your grandmother
The Real Challenge: Creating a single application that masters multiple constraints at once. Imagine building a CSS Alchemist + Byte Assassin + Grandma’s Digital Sage project — visual magic in under 1KB that your grandmother loves using!
Your Remit
Hack Over 15 — Choose 3
Track 1: The Byte Assassin
Build something genuinely useful in exactly 1KB of code total (HTML + CSS + JS combined). Every byte is a weapon.
Testing: Use wc -c or file size checker, must be ≤ 1024 bytes
Testing: Use wc -c or file size checker, must be ≤ 1024 bytes
Track 2: 2G Connection Ninja
Create a full experience that works perfectly on a 2G connection. Master the art of speed in the slowest conditions.
Testing: Chrome DevTools > Network > Slow 2G throttling
Testing: Chrome DevTools > Network > Slow 2G throttling
Track 3: Ancient Hardware Whisperer
Make something that loads instantly on a 2015 laptop with 4GB RAM and integrated graphics. Awaken the sleeping giants.
Testing: Chrome DevTools > Performance > CPU throttling 6x slowdown
Testing: Chrome DevTools > Performance > CPU throttling 6x slowdown
Track 4: Grandma's Digital Sage
Build something so intuitive that your grandmother becomes a power user without any explanation. Wisdom through simplicity.
Testing: Give to someone 65+ or simulate with vision/motor impairments
Testing: Give to someone 65+ or simulate with vision/motor impairments
Track 5: No-Script Sorcerer
Create the most complex, interactive experience possible using only HTML and CSS. Pure magic, no scripts.
Testing: Disable JavaScript entirely and verify full functionality
Testing: Disable JavaScript entirely and verify full functionality
Track 6: Single-Request Samurai
Everything must work from a single HTTP request. Honor the ancient way of one perfect strike.
Testing: Monitor network tab — only one request allowed
Testing: Monitor network tab — only one request allowed
Track 7: Offline Survivalist
Build something that works perfectly with zero internet connection after the initial load. Thrive in the digital wilderness.
Testing: Load page, then disconnect WiFi/disable network
Testing: Load page, then disconnect WiFi/disable network
Track 8: CSS Alchemist
Create something that looks impossible to build with just CSS. Transform base elements into gold.
Testing: Remove all JavaScript and verify visual magic still works
Testing: Remove all JavaScript and verify visual magic still works
Track 9: Lightning Bolt Engineer
Build any complex application, but it must achieve a complete page load in under 1 second on mobile 3G. Harness the storm.
Testing: Chrome DevTools > Network > Fast 3G + mobile device simulation
Testing: Chrome DevTools > Network > Fast 3G + mobile device simulation
Track 10: Universal Access Guardian
Create the most accessible web experience possible while maintaining visual appeal and functionality for all souls.
Testing: Use screen reader (NVDA/JAWS) + keyboard-only navigation + color blindness simulator
Testing: Use screen reader (NVDA/JAWS) + keyboard-only navigation + color blindness simulator
Track 11: Keyboard Sensei
Build something where 100% of functionality flows through keyboard shortcuts. The mouse is for amateurs.
Testing: Unplug your mouse and use only keyboard navigation
Testing: Unplug your mouse and use only keyboard navigation
Track 12: Memory Monk
Create a complex application that uses less than 10MB of RAM total. Achieve enlightenment through minimalism.
Testing: Chrome DevTools > Memory tab + Performance monitor
Testing: Chrome DevTools > Memory tab + Performance monitor
Track 13: Legacy Browser Archaeologist
Build something that works perfectly in Internet Explorer 11. Resurrect the ancient ones with modern grace.
Testing: Use IE11 developer tools or Edge IE mode
Testing: Use IE11 developer tools or Edge IE mode
Track 14: Text-Only Storyteller
Create the most engaging experience possible using only plain text and basic HTML formatting. Paint with words alone.
Testing: Strip all CSS and images — functionality must remain intact
Testing: Strip all CSS and images — functionality must remain intact
Track 15: Monolith Master
Build a complete application in a single HTML file. All power contained within one sacred scroll.
Testing: Check that only one .html file exists and works standalone
Testing: Check that only one .html file exists and works standalone
|
▓ Memory Monk + Lightning Bolt Engineer = ultra-fast, minimal resource usage
▓ Single-Request Samurai + Offline Survivalist = fully self-contained experiences
▓ No-Script Sorcerer + Universal Access Guardian = mastery in CSS accessibility
▓ Byte Assassin + 2G Connection Ninja = extreme optimization for global reach
▓ Single-Request Samurai + Offline Survivalist = fully self-contained experiences
▓ No-Script Sorcerer + Universal Access Guardian = mastery in CSS accessibility
▓ Byte Assassin + 2G Connection Ninja = extreme optimization for global reach
Technical Mastery — Constraint combination forces different optimization strategies ↓
Real-World Impact ↓
Byte Assassin teaches extreme optimization ✅
2G Connection Ninja serves 3+ billion users worldwide ✅
Grandma's Digital Sage makes the web accessible to everyone ✅
No-Script Sorcerer proves CSS is more powerful than we think ✅
Offline Survivalist works anywhere, anytime ✅
2G Connection Ninja serves 3+ billion users worldwide ✅
Grandma's Digital Sage makes the web accessible to everyone ✅
No-Script Sorcerer proves CSS is more powerful than we think ✅
Offline Survivalist works anywhere, anytime ✅
Why These Conditions Are Particularly Vital
No frameworks. No excuses. Just pure web
프레임워크 없음. 변명 없음. 오직 순수한 웹
Timeframe
Registration deadline & hackathon start
August 29, 2025 (Friday)
at 18:00 (UTC)
Submission deadline
September 1, 2025 (Monday)
at 18:00 (UTC)
Judging period
September 1 — September 15
Results announcement
September 15
August 29 (Friday)
August 29 (Friday)
Registration deadline & hackathon start
at 18:00 (UTC)
September 1 (Monday)
September 1 (Monday)
Submission deadline
at 18:00 (UTC)
September 1 —September 15
September 1 —September 15
Judging period
September 15
September 15
Results announcement
Implementation Pathways
Your vision can take many forms:
-
Utility Applications:
- Developer tools and calculators
- Data visualization dashboards
- Productivity applications
- Content management systems
-
Creative Experiences:
- Interactive art and animations
- Browser-based games
- Educational tools
- Storytelling platforms
-
Technical Demos:
- Performance showcases
- Accessibility demonstrations
- Browser capability explorations
- Optimization case studies
Our Desired Outcomes
- 50%
The Art of Constraint Mastery
Track Excellence:
How brilliantly you execute your chosen 3 constraint challenges
Code Craftsmanship:
Clean, efficient vanilla code that makes framework developers jealous
Performance Wizardry:
Measurable speed, size, and efficiency improvements that blow minds
Creative Problem-Solving:
Innovative solutions that make limitations look like superpowers
- 30%
User Experience Magic
Functional Beauty:
Does it work flawlessly and solve real problems elegantly?
Intuitive Flow:
Can users accomplish their goals without confusion or frustration?
Polish & Detail:
The difference between "works" and "works beautifully"
Inclusive Design:
Experiences that welcome everyone, regardless of ability or device
- 20%Innovation & ImpactOriginal Thinking:
Fresh approaches that make us see constraints differently
Real-World Value:
Solutions people would actually use in their daily lives
Technical Storytelling:
How well you communicate your optimization journey
Community Inspiration:
Projects that make other developers rethink what’s possible
Principal Jury Panel
Expertise and background summary.
Company / Country
Name Surname
Expertise and background summary.
Company / Country
Name Surname
Expertise and background summary.
Company / Country
Name Surname
Expertise and background summary.
Company / Country
Name Surname
Expertise and background summary.
Company / Country
Name Surname
Name Surname
Company / Country
Expertise and background summary.
$ 300
Community Choice
Chosen by public vote one week after the hackathon. A spotlight for the boldest, most beloved build — where code meets crowd power.
$ 200
Celebrates a project that shows strong potential and clean execution under pressure. Selected by the jury for smart constraint handling.
Third Place
$ 300
Second Place
Given to a team that creatively pushed the boundaries of what's possible with vanilla code — delivering both speed and usability.
$ 1000
First Place
Awarded to the most mind-blowing project that masters extreme constraints with elegance. Innovation, raw performance, and technical precision will lead the way.
The Ultimate Constraint Challenge ↓
Rewards
Build with less. Create the impossible
적게 만들어 더 크게. 불가능을 창조하라
|
▓ DevTools throttling for network and CPU constraints
▓ File size checkers for byte limits
▓ Accessibility tools for inclusive design
▓ Browser compatibility testing
▓ Performance monitoring for resource usage
▓ File size checkers for byte limits
▓ Accessibility tools for inclusive design
▓ Browser compatibility testing
▓ Performance monitoring for resource usage
Each track includes specific testing methods using standard developer tools ↓
Scrutinising Your Limitations
All Our Judges
|
Whether you’re crafting a remarkably swift tool, an accessible gem, or indeed a CSS-only wonder — the crux is demonstrating that standard web technologies can deliver exceptional experiences within stringent limitations.
▓ Choose your 3 tracks — Pick constraint combinations that excite and challenge you
▓ Design one unified project — Plan how all three constraints work together in a single application
▓ Set up testing environment — Configure DevTools for all your chosen constraints
▓ Start small — Build a minimal viable version that satisfies all tracks
▓ Iterate rapidly — Test all constraints frequently during development
▓ Document your journey — Share how you solved the multi-constraint puzzle
▓ Design one unified project — Plan how all three constraints work together in a single application
▓ Set up testing environment — Configure DevTools for all your chosen constraints
▓ Start small — Build a minimal viable version that satisfies all tracks
▓ Iterate rapidly — Test all constraints frequently during development
▓ Document your journey — Share how you solved the multi-constraint puzzle
Get Going 🔥
Organized solely for social good [and fun] and designed by Hackathon Raptors. A non-profit community — UK [C.I.C] — 15 557 917.
Stay in touch with the Vanilla Web Hackathon team on all platforms. Join the community, ask questions, or share your progress — we’re here to support you on your web journey.
Contact & Support
