Sencha Touch has been used by Infinum since 2010 for mobile web app development. While it worked well on iPhone/iPad, early versions had performance issues on Android devices. Specific issues included slow scrolling, animations, and rounded corners on lower-end Android phones. Infinum communicated to clients that apps may not work everywhere. They also discuss alternatives to Sencha Touch and ways it could be improved.

1. SENCHA TOUCH IN THE WILD

2. INFINUM
Software development
Mobile Development
Ruby on Rails
Android
iPhone
iPad
www.infinumdigital.com

3. WON $100.000
Samsung Global Developer Challenge

4. Business Design
MY BACK 20% 20%
HISTORY
Know who you’re dealing with
Development
60%

5. Templating
Layouting Dataviews
mobile web app development
STUFF WE INVENTED
Proxies
IN EARLY 2010
Event
Handling

6. USING SENCHA SINCE 0.9.X
Buggy, worked really bad on Android

7. VC FUNDING
$14M

8. SENCHA TOUCH & INFINUM
We’ve been friends for a long time...

9. XTemplate
Learning
curve
Layout
Managers
WHAT WE LOVE
ABOUT SENCHA
TOUCH
Data Stores Listeners

10. IPHONE & IPAD
generally works fine

11. ANDROID
Top level (HDPI) Androids work almost fine

12. WHAT’S
CAUSING
PERFORMANCE
ISSUES?
Scrolling
Animations
Gradients
Rounded corners
Bunch of elements
Input elements

13. COMMUNICATE TO CLIENTS
“It won’t work everywhere”

14. ANDROID
SEGMENTATION
High Density (HDPI)
480x854
Medium Density (MDPI)
320x480
Low Density (LDPI)
240x320
~Android 2.2

15. BEWARE
iPhone 3G, crappy Androids
(low CPU, lack of GPU acceleration)

16. ANDROID VERSIONS
>=2.1 95%

17. KINETIC SCROLLING & BOUNCE
turn it off if scrolling is slow

18. UNSUPPORTED PLATFORMS
Nokia, bada, Blackberry (not any more actually)

19. FIRST EXPERIENCE
Not good, needs work

20. NOKIA
Native Browser != QT Webkit

21. NOKIA
document.querySelectorAll non existent (use Sizzle)
scrolling doesn’t work, most cool things don’t work

22. SENCHA TOUCH ON QT
Didn’t manage to get it to work properly

23. LO-FI VERSION?
any point?

24. BADA
dolphin webkit, works rather well, on par with Android

25. BADA PROBLEMS
drop shadows don’t work, native browser UI, smaller screen

26. IMPROVING SENCHA TOUCH
let’s talk about that

27. STACKABLE PANEL
Like UINavigationController on iPhone - manages screen stacks

28. GRID COMPONENT
very common pattern

29. OPEN SOURCE
but with community submissions

30. “REAL” NATIVE LOOK AND FEEL
the Cupertino theme helps but...

31. “REAL” NATIVE LOOK AND FEEL
iOS <> Sencha Touch

32. LISTENERS
we’ve had problems
(show, activate...)

33. INLINE HTML TEMPLATES
hard to mantain

34. OUR SOLUTION
Dedicated folder for templates

35. ONE FILE PER TEMPLATE
Syntax highlighting, easier maintenance

36. CODE DECOUPLING
Extract specific components

37. ALTERNATIVES?
jQuery mobile

38. BEST SOLUTION
even for small applications

39. THANK YOU!
Questions?
Tomislav Car
twitter.com/tomislav_car
www.infinumdigital.com