+ All Categories
Home > Technology > 10 Golden Rules For Outstanding Titanium Apps

10 Golden Rules For Outstanding Titanium Apps

Date post: 06-May-2015
Category:
Upload: jamessugrue
View: 2,615 times
Download: 5 times
Share this document with a friend
Description:
Are you starting out with Titanium to develop cross platform apps? When creating mobile applications using Titanium, the first 80% of functionality works fine, it's the last 20% that will trip you up. In this talk you will learn some of the golden rules that a team of five developers discovered when porting their hybrid web application over to Titanium, to run on both iOS and Android. Learn how to get around some common speed bumps and accelerate your own app development.
59
Get there together 10 Golden Rules For Outstanding Titanium Apps
Transcript
Page 1: 10 Golden Rules For Outstanding Titanium Apps

Get there together

10 Golden Rules For Outstanding Titanium Apps

Page 2: 10 Golden Rules For Outstanding Titanium Apps

@sugrue www.jamessugrue.ie

Lead Architect / Growth Hacker

Author of Beginning Backbone.js

James Sugrue

Using Titanium since 2010

Page 3: 10 Golden Rules For Outstanding Titanium Apps

Carma Carpooling

Founded in early 2007, Carma is the world’s first social transportation network.

Page 4: 10 Golden Rules For Outstanding Titanium Apps

Choose a match & get in touch

Tap ‘Start Trip’ & log your journey

Tap ‘End Trip’ & share the Carma

How the App Works

Page 5: 10 Golden Rules For Outstanding Titanium Apps

Native to Native to Hybrid to Native

2010 2012 2013 2014

Page 6: 10 Golden Rules For Outstanding Titanium Apps

Replace your tables with list views

1

Page 7: 10 Golden Rules For Outstanding Titanium Apps

The Trouble With Tables

TableViews for tabular data seems natural !As row count increases, performance suffers !Use ListView for a performance boost !

Page 8: 10 Golden Rules For Outstanding Titanium Apps

ListView !== TableView!!Templates for each ‘row’ bound to a data object !Overall list events: no row events !Use lazy loading so that the template compilation doesn’t slow down your app !

http://www.shockoe.com/blog/titanium-tableview-listview-retrospective/

Page 9: 10 Golden Rules For Outstanding Titanium Apps

Beware of the single thread

2

Page 10: 10 Golden Rules For Outstanding Titanium Apps

The Most Frustrating User Experience Customers will not accept your excuses for an unresponsive app !

Page 11: 10 Golden Rules For Outstanding Titanium Apps

Keep Your App Moving

Ensure that multiple clicks does not mean multiple invocation Always keep the user informed, even if they have to wait

1

_.defer for UI blocking operations _.throttle to prevent duplicate actions2

Use activity indicators when necessary 3

4Try out graviton.TaskManager from Ronald Treur

Page 12: 10 Golden Rules For Outstanding Titanium Apps

Obsess over memory management

3

Page 13: 10 Golden Rules For Outstanding Titanium Apps

Don’t Leave It Until The EndSome developers assume there’s no need to worry about memory management in JavaScript !

!

!!

Page 14: 10 Golden Rules For Outstanding Titanium Apps

Some Quick Tips

Keep event listeners at a minimum Use call-backs instead of global event listeners. !!!

1

2 Create a module to manage global state

3 Dispose objects when you are finished with them.

Page 15: 10 Golden Rules For Outstanding Titanium Apps

Use require statements only when needed

4

Page 16: 10 Golden Rules For Outstanding Titanium Apps

Modules: A Delicate Balancing ActIt is tempting to add all require statements at the top of each Alloy controller. !!

Page 17: 10 Golden Rules For Outstanding Titanium Apps

Lazy Loading Modules

Ensure that you only require essential modules at the beginning !

1var event = require("/tracking/tracking_event"), analytics = require("/tracking/tracking_manager");

or

3Use require(“<path>”).<function> inline with your code !

require("facebook/facebook_manager").getFacebookId();

Store your module reference within the function !

2function loginFacebook(fbManager) { var eventTracker = require(“/tracking/tracking_event");

Page 18: 10 Golden Rules For Outstanding Titanium Apps

Embrace native modules

5

Page 19: 10 Golden Rules For Outstanding Titanium Apps

Writing native modules is not cheating

Use your Objective-C/Swift/Java skills

Page 20: 10 Golden Rules For Outstanding Titanium Apps

Multiple Layer Scroller

Page 21: 10 Golden Rules For Outstanding Titanium Apps

Be Careful Crossing That Bridge

Reacting to every scroll event was really slow

Page 22: 10 Golden Rules For Outstanding Titanium Apps
Page 23: 10 Golden Rules For Outstanding Titanium Apps

Use fonts rather than images

6

Page 24: 10 Golden Rules For Outstanding Titanium Apps

Slim Down Your App With Icon Fonts

Don’t overload your app with images

Page 25: 10 Golden Rules For Outstanding Titanium Apps

Choose Your Icons http://fontastic.me

Page 26: 10 Golden Rules For Outstanding Titanium Apps

Add Font To Project

1

2 Update app.tss//// Icon Font// --------------------------------------------------".icon": { font: { fontFamily: "splinico" }}!".icon-camera": { text: "a"}!".icon-facebook": { text: "f"}!".icon-envelope": { text: "b"}

Page 27: 10 Golden Rules For Outstanding Titanium Apps

Use Your Font

3

<Button id="btnSignupWithFacebook" class="btn btn- fb-blue btn-lg col-abs-11”> <Label class="icon icon-facebook btn-icon”/> <View class="btn-vr"/> <Label class="lbl-large btn-text" text=“L(‘widget_home_btn_signup_facebook')"> </Label></Button>

Page 28: 10 Golden Rules For Outstanding Titanium Apps

Get consistent styling with app.tss

7

Page 29: 10 Golden Rules For Outstanding Titanium Apps

Keep Your Designer HappyKeep all your common app styles in one place !!!Use this image: http://upload.wikimedia.org/wikipedia/commons/3/3e/RedBikeLane.JPG

Page 30: 10 Golden Rules For Outstanding Titanium Apps

Keep Your Designer HappyKeep all your common app styles in one place: app.tss !!!!

!"Label":{ font: { fontFamily: 'Helvetica Neue Light', fontSize: '14dp', }, color: '#333333'}"Button":{ font: { fontFamily: 'HelveticaNeue-Light', fontSize: '14dp' }, height: '44dp', width: '100%'}"TableView":{ backgroundColor: 'transparent', width: '100%', height: Ti.UI.FILL}

Page 31: 10 Golden Rules For Outstanding Titanium Apps

Wriststrap

https://github.com/TNuzzi/wriststrap

Page 32: 10 Golden Rules For Outstanding Titanium Apps

Ti UX Patterns

http://www.uxmobilepatterns.com/

Page 33: 10 Golden Rules For Outstanding Titanium Apps

Use TiShadow for Rapid Development

8

Page 34: 10 Golden Rules For Outstanding Titanium Apps

Speed Up Development ExponentiallyHow much time do you waste in the cycle of building and deploying? !What about installing updated builds on all test devices?

Page 35: 10 Golden Rules For Outstanding Titanium Apps

You Have To See It to Believe It

1

titanium build -p android -T device --shadow !

Page 36: 10 Golden Rules For Outstanding Titanium Apps

HAPPY BIRTHDAY

DAVID

Page 37: 10 Golden Rules For Outstanding Titanium Apps

Start with Android

9

Page 38: 10 Golden Rules For Outstanding Titanium Apps

Cross Platform Development Is DifficultThe greatest appeal of Titanium is cross platform !With Titanium, iOS support has always been superior

Page 39: 10 Golden Rules For Outstanding Titanium Apps

3

Lessons Learned The Hard WayUse density pixels to gracefully handle varying resolutions !When adding events remember to use singletap for Android click for iOS ! !!!! if (OS_ANDROID) {!! ! textfield.addEventListener("singletap", textfield.clearError);!! }!! else {!! ! textfield.addEventListener("click", textfield.clearError);!! }!

!!!!!

Page 40: 10 Golden Rules For Outstanding Titanium Apps

Making Android More Appealing!Use Genymotion as your emulator !!!!!!

1

2 Ensure every developer has at least two phones

3 Utilise tishadow to easily deploy to all devices in real time

Page 41: 10 Golden Rules For Outstanding Titanium Apps

Go for the latest OS features

10

Page 42: 10 Golden Rules For Outstanding Titanium Apps

Push Your App to Be Cutting EdgeNever limit yourself to the lowest common denominator

Page 43: 10 Golden Rules For Outstanding Titanium Apps
Page 44: 10 Golden Rules For Outstanding Titanium Apps

"The reasonable man adapts himself to the

conditions that surround him... The unreasonable man adapts surrounding

conditions to himself... All progress depends on the

unreasonable man.” !

- George Bernard Shaw

Be Unreasonable

Page 45: 10 Golden Rules For Outstanding Titanium Apps

Get Involved in the Titanium CommunityDon’t be afraid to submit a pull request

Ask Ingo for what you need

Page 47: 10 Golden Rules For Outstanding Titanium Apps

Get there together

Carma Prize Your chance to make it big

Page 48: 10 Golden Rules For Outstanding Titanium Apps

What is the Carma Prize?

$1 million to Carma employee who enables +1,000 daily carpool trips

$1 million to 3rd party developer who enables +10,000 daily carpool trips

$500,000 to start-ups to take on the challenge

Page 49: 10 Golden Rules For Outstanding Titanium Apps
Page 50: 10 Golden Rules For Outstanding Titanium Apps

What is the problem?

The average annual cost of driving a sedan in the US = $9,122

The average passenger vehicle emits 5.1 tons of CO2 per year, making our car culture responsible for 33% of US emissions

The typical American spends a whole week and wastes 19 gallons of fuel sitting in traffic every year

Most of us drive to work alone, i.e. with three empty seats!

Page 51: 10 Golden Rules For Outstanding Titanium Apps

Highways full of “riderless cars”A road can be 100% full, but with only 25% capacity used. !

Once we know who the commuters are, and where they are going,

the game changes entirely.

Page 52: 10 Golden Rules For Outstanding Titanium Apps

Carma - a better way to commute

Save up to 75% on the cost of driving

Reduce your carbon footprint and fuel dependency

Get access to carpool/HOV lanes and get your free time back

Spend more time with your neighbours and colleagues

Page 53: 10 Golden Rules For Outstanding Titanium Apps

Paul | Sean

Open APIs for real-time carpool verification

Open APIs for real-time carpool matching

Open APIs for building occupancy-based apps

The Carma API

api.carmacarpool.com

Page 54: 10 Golden Rules For Outstanding Titanium Apps

Inspiration

api.carmacarpool.com

Plug-in for concerts / eventsSystem for sport teams/arenas

Competition for “school-pools” for kids / moms & dads

Ride Board for large campus / colleges

Systems for large employers

App for connected vehicles - Automotive companies

App to open parking garages / toll barriers when carpool comes

Page 55: 10 Golden Rules For Outstanding Titanium Apps

$1 million Third party developer

+10,000 daily carpool trips

Get there together

Page 56: 10 Golden Rules For Outstanding Titanium Apps

$1 million Carma employee

+1,000 daily carpool trips

Get there together

Page 57: 10 Golden Rules For Outstanding Titanium Apps

$500K Accelerator program funding for startups

Get there together

Page 58: 10 Golden Rules For Outstanding Titanium Apps

The Carma Prize

$1 million to Carma employee who enables +1,000 daily carpool trips

$1 million to 3rd party developer who enables +10,000 daily carpool trips

$500,000 to start-ups to take on the challenge

www.carmacarpool.com/prize

Page 59: 10 Golden Rules For Outstanding Titanium Apps

@TeamCarma

www.carmacarpool.com


Recommended