Codestrong 2012 breakout session i os internals and best practices

  • View
    442

  • Download
    2

Embed Size (px)

Text of Codestrong 2012 breakout session i os internals and best practices

  • 1.iOS Internals and Best Practices Blain Hamon & Max Stepanov Senior Software EngineersAppcelerator, Inc. @blainhamon @maxstepanovbhamon@appcelerator.com mstepanov@appcelerator.com

2. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 3. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 4. Ti.API.prehistory 2009: Versions 0.3-0.8 Based on web views Native via JSON service Drew upon Ti:Desktop 5. Ti.API.today 2010+: Versions 0.9+ Built-in Interpreters Native via JS callbacks Focused on Mobile 6. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 7. App To The Future Native OSNative OS 8. App To The Future Native OS OS Abstraction Layer OS Abstraction LayerNative OS 9. App To The Future Native OS OS Abstraction Layer Ti Binding (Kroll) OS Abstraction Layer Ti Binding (Kroll)Native OS 10. App To The Future Native OS OS Abstraction Layer Ti Binding (Kroll) Ti Foundation Layer Ti Foundation Layer OS Abstraction Layer Ti Binding (Kroll)Native OS 11. App To The Future Native OS OS Abstraction Layer UI App Network Other Modules Ti Binding (Kroll)Ti Foundation Layer Ti Foundation Layer OS Abstraction LayerTi Binding (Kroll) ModulesNative OS 12. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 13. Game of ThreadsUser taps buttonUI-triggered event:User taps button EventListener UI asynchronouslytriggers event listener UI is ready for moreaction while JSEventListenerprocesses. 14. Game of ThreadsJS-triggered events: fireEvent(foo); Still asychronous setTimeout(0,()); First in, first out queueEventListenerTimeout Function 15. Game of ThreadsUser taps buttonExpensive listeners:User taps buttonUser taps button EventListener Still first in, first out Delayed responses EventListener EventListener 16. Game of ThreadsUser taps buttonOptions:User taps buttonUser taps button EventListener Block userButton coveredinteraction, but onlyas a last resort EventListener EventListener 17. Game of ThreadsUser taps button 1Options:User taps button 2 EventListener 1 Block user EventListener 2interaction, but onlyas a last resort EventListener 1.1 Break up expensive EventListener 1.2listeners 18. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 19. My Little Memory In globalheld1 = {foo:5};namespace 20. My Little Memory In global held1 = {foo:5};namespace In a closure of a foo = (function(){function var held2=0; return function(){return held2++;};})(); 21. My Little Memory In global held1 = {foo:5};namespace In a closure of a foo = (function(){function var held2=0; return function() Property of aretained object {return held2++;};})();foo.bar = held3;foo.add(held4); 22. My Little Memory In global held1 = {foo:5};namespace In a closure of a foo = (function(){function var held2=0; return function() Property of aretained object {return held2++;};})(); Artificiallyretained viaTitaniumfoo.bar = held3;foo.add(held4);held5.open(); 23. My Little Memory Be aware ofheld1 = {foo:5};variable scope nulling outfoo = (function(){var held2=0;return function() {return held2++;}; })(); foo.bar = held3; foo.add(held4); held5.open(); 24. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 25. Class of the Titans Proxies representTitanium objectsTi Proxy Proxies arethreadsafeUIView Object Ti Binding Object JS Object Proxies store data asa native copy 26. Class of the Titans Proxies representTitanium objectsTi Proxy Proxies arethreadsafeUIView Object Ti Binding Object JS Object Proxies store data asa native copy (Method) JS Object Method objects aregenerated 27. Class of the Titans Native can beexpensiveTi Proxy Cache when possible Use propertiesUIView Object Ti Binding Object JS Objectinstead of setters Pass properties in (Method) JS Objectcreators Use applyProperties() 28. iOS Internals History Structure Responsive Apps Memory-Light Apps Fast-Performing Apps Fast-Drawing Apps 29. Epic View Time iOS uses OpenGL underneath Views cache as textures Opaque textures are faster Resizing can be expensive Transparency can be expensive 30. Epic View Time iOS uses OpenGL underneath Views cache as textures Opaque textures are faster Rendering happens often Some behaviors are expensive Resizing view sizes Transparent/views with alpha Dynamic graphics 31. Epic View Time var row = Ti.UI.createTableViewRow({ height:Ti.UI.SIZE, layout:horizontal }); row.add(Ti.UI.createImageView({ image: myUrl, top: 10, height:89, bottom:11, left: 0, width:125 })); row.add(Ti.UI.createLabel({ text: myText, left:5, width:Ti.UI.SIZE, height:Ti.UI.SIZE })); 32. Epic View Time var row = Ti.UI.createTableViewRow({ height:Ti.UI.SIZE, layout:horizontal }); row.add(Ti.UI.createImageView({ image: myUrl, top: 10, height:89, bottom:11, left: 0, width:125 })); row.add(Ti.UI.createLabel({ text: myText, left:5, width:Ti.UI.SIZE, height:Ti.UI.SIZE })); 33. Epic View Time var row = Ti.UI.createTableViewRow({ height:100 }); row.add(Ti.UI.createImageView({ image: myUrl, top: 10, height:89, bottom:11, left: 0, width:125, backgroundColor:white })); row.add(Ti.UI.createLabel({ text: myText, top:0, left:130, right:0, bottom:0, backgroundColor:white }); 34. iOS InternalsBeing responsive: Block UI as last resort Break up expensive tasksBeing memory-efficient: Mind native object referencesBeing fast: Cache when possible Reduce using native containers Concentrate property settingBeing fast-rendering: Aim for static, opaque views 35. iOS Debugging 36. New in TitaniumTitanium 1.7Titanium 3.0 iOS Simulator Physical Devices 37. Device Debugging Install with iTunes Requires network connectivity between development machine and a device Local WiFi or Hotspot iPhone Personal Hotspot via WiFi, Bluetooth or USB Titanium Studio will do the best to locate your device(s)! 38. Debugging Tips Turn off Auto-Lock on device Ensure same WiFi network Dont forget to launch your apphttp://docs.appcelerator.com/titanium/3.0/ Debugging on iOS Devices 39. Game of Threads User taps button 1EventListener 1 UI thread for handling var x = 1;user interactions Ti.API.log(x); openWin(x); JS thread for thepostlayout eventapplication logicGeo locationFunction Run Debugger thread forcommunications with EventListener 2Titanium Studio Line 1Line 2 Other iOS platformLine 3threads 40. Best Practices Use conditional breakpoints A block of JavaScript code Hit count Use Console logging with Ti.API functions 41. Blain Hamon & Max Stepanov@blainhamon @maxstepanovbhamon@appcelerator.com mstepanov@appcelerator.com