Phonegap Day 2016: Ember/JS & Hybrid Apps Tips
Download as PPTX, PDF5 likes3,824 views
Talk about general profiling & performance for Hybrid Applications, as well as some Ember specific tips. For Cordova + PhoneGap. Presented on Jan 29 2016 at PhoneGap Day in Salt Lake City.
Ad
More Related Content
What's hot (20)
Similar to Phonegap Day 2016: Ember/JS & Hybrid Apps Tips (20)
Ad
More from Alex Blom (8)
Ad
Recently uploaded (20)
Phonegap Day 2016: Ember/JS & Hybrid Apps Tips
- 1. Hybrid Apps with Ember: Lessons Learned @alexblom [email protected]
- 2. Who am I • Programmer; • Started with Java/C; • Mostly Ruby/Rails; • Go; • Ember for ~2.5 years;
- 3. Isle of Code • Toronto + Chicago based development; • Focused on: • Prototyping; • Single sourcing mobile /w Ember.js & Cordova; and • A lot of beacon work.
- 6. The Ember way is not about Ember
- 9. The Hackiest Way • Process has come a long way
- 11. Lessons Learned
- 12. Good Code == Good Hybrid • Much of making effective mobile is simply writing good code; • Desktops let us be lazier; • JS ecosystem is littered with bad/leaky code;
- 13. Bind Phonegap to a Service
- 15. Hammer Example
- 16. Understand Viewport Android Viewport iOS 7+ Viewport
- 18. Which engine are you using? Probably Nitro of v8
- 19. Memory Leaks • Garbage Collection: 2 types: • Young Generation & Old Generation
- 22. Using too much memory has negative implications
- 23. Name closures for better profiling
- 24. https://developer.chrome.com/devtools/docs/javascript-memory-profiling
- 25. Manage Reflows
- 26. What causes Reflow? • Resizing the browser window; • using JavaScript methods involving computed styles; • adding or removing elements from the DOM; and • changing an element's classes. • https://developers.google.com/speed/articles/reflo w
- 29. Avoid Unnecessary Nesting • Especially with components;
- 31. Ember Hack
- 33. Ember Click Handler • Within Ember, there are many ways to receive clicks, such as:
- 36. These clicks are not the same
- 37. • Sub Tip: Coalesce similar listeners;
- 38. Run Loops • Ember.run.schedule(‘afterRender' • Other tools for scheduling asyncronous callbacks; • Solves many problems - but not all of them. We still can’t be animating while transitioning;
- 39. Workers/Threads
- 40. • Route animations can be choppy, as the UI thread is shared with items such as model hooks and expensive computations; • In native, it is easy enough to have 1 thread for the transition/animation (UI thread) and another for more complex work;
- 41. • More work around WebWorkers for handling background requests and pushing to the Ember store;
- 43. Ghost Clicks
- 44. Save Plugins • For the love of god, save plugins.
- 45. Infinite Scrolling • Smoke & Mirrors: https://github.com/runspired/smoke-and-mirrors
- 46. Occlusion
- 48. Animations
- 52. Canvas • Choppy and deal breaking. This is common when working with DOM; • Need to move to Canvas; • ~16ms target for animations, DOM can’t do this;