Downloaded 63 times
Uploaded byDave Balmer
Hello, Jo! Introduction to this lightweight HTML5 mobile app framework
The document presents an introduction to 'jo', a lightweight HTML5 mobile app framework by Dave Balmer, highlighting its key features such as a small footprint, compatibility with various platforms, and open-source nature. It emphasizes 'jo's' design principles and philosophical approach, comparing it to other mobile frameworks in terms of size. The presentation includes code examples and encourages contributions from the open-source community.
![Vibe Coding vs. Spec-Driven Development [Free Meetup]](https://cdn.slidesharecdn.com/ss_thumbnails/vibecodingvsspecdrivendevelopment-251209105622-43f455e7-thumbnail.jpg?width=640&height=640&fit=bounds)
Hello, Jo! Introduction to this lightweight HTML5 mobile app framework
- 1. Hello, Jo! The LightweightHTML5 Mobile App Framework Dave Balmer JSConf 2011 Portland
- 2. Introduction The “hello” partof my talk.
- 3. Who the Hellam I? • Programmer for 34 years • Occasional designer wanna-be • JavaScript freak (since 2004) • Open Source Community noob • Living proof that getting a little kid addicted to programming might not be a “good thing”
- 4. What the Hellis Jo? • JavaScript lovin’ mobile app framework • Touchable, tappable UI widgets • Simple data layer • Smallish footprint, ~12K gzipped • Plays with PhoneGap for iOS, Android, webOS, BlackBerry &
- 5. Jo with Browsers,Desktop Widgets, Your JS App Jo webkit • Works alongside other libs • Doesn’t force you to use it for everything
- 6. Jo with iOS/Android PhoneGap PhoneGap Your JS App Jo webkit • PhoneGap acts as a WebView wrapper • Your code is about the same
- 7. Jo & PhoneGapon webOS and Your JS App PhoneGap Jo webkit • PhoneGap acts as a compatibility layer • And your code is still about the
- 8. ...And it’s OpenSource (of course, of course) • FreeBSD license • Hosted on GitHub • Looking for more code contributors
- 9. Philosophy Jo is madefrom a few of my favorite things.
- 10. Jo’s Syntactic Sugar •Constructor nesting • Method chaining • Custom extend() method • Observer pattern • Supports either bind() or passing context
- 11. Jo’s Principles • Don’ttry to “fix” JavaScript • Let CSS3 do its job • Keep the code light
- 12. If Jo Werea Person...
- 13. If Jo Werea Person... Indiana Jones! • Smart • Flexible • Travels light • Can dress up (if he has to)
- 14. ...OK, More LikeYoung Indy Today • Capable • Reeking with potential • A little rough around the edges (Did I mention I’m looking for more code contributors?)
- 15. Comparison How to spotJo in a crowd of mobile frameworks.
- 16. Jo vs. TheVolcanos Obligatory Size Comparison Jo 2 XUI 3 Zepto 5 SproutCore 10 Dojo Mobile 11 Sencha Touch 12 jQuery Mobile 13 0 3 6 9 12 15
- 17. Jo vs. TheVolcanos Obligatory Size Comparison (using my favorite metric: bytes per framework name) Jo 2 XUI 3 Zepto 5 SproutCore 10 Dojo Mobile 11 Sencha Touch 12 jQuery Mobile 13 0 3 6 9 12 15
- 18. Jo’s Sweet Spot Minimal Zepto XUI Jo HTML JS jQuery Mobile Sencha Touch Sprout Core Massive Dojo Mobile
- 19. Code Examples Yadda yaddayadda... show me the code!
- 20. Hello, Jo! Sample <!DOCTYPEhtml> <html lang="en"> <head> <link rel="stylesheet" href="jo.css" type="text/css"> </head> <body> <script src="jo.js"></script> <script> var app = new joScreen(); app.alert(“Hello, Jo!”); </script> </body> </html>
- 21. More Samples... /* code > slides */
- 22. Q&A Session Because everytalk needs one.
- 23. Thank You!* Dave Balmer Twitter @Balmer http://joApp.com http://github.com/davebalmer/jo *see me after, I have Jo on flash drives as well