Date: 2015-10-11
Last Update: 2016-01-10
This will be cleaned up - soon. (2016-01-10)
Generally, the tips come in two varities.
- Do this.
- Don't do this.
- Performance & UX Considerations For Successful PhoneGap Apps - Andrew Trice - March 11, 2013
- Hardware Acceleration
- The Impact of Content Reflow (7 points to analyze)
- Keep Graphics Simple
- Touch Interactivity (use touch events, not mouse)
- JavaScript Optimizations
- Native Performance
- UI & UX Considerations
- Test On Devices
- You half assed it. That is why your PhoneGap application sucks. - Brock Whitten - undated
Here are just a few rather obvious mistakes they make.
- Uses JQuery (and JQuery Mobile)
- Massive Footprint. 248k wowsers
- click instead of tap
- setTimeout animations
- BazaarJS: our criticisms of Angular - Stefano Verna – September 20, 2015
- Problem #1: Scope inheritance and dynamic scoping
- Problem #2: Dirty checking
- Problem #3: Dependency injection
- Problem #4: Pointless complexity
- Problem #5: Server-side rendering
- Apache Cordova: after 10 months, I won't be using it anymore - July 06, 2015
- ogv.js: An Ogg Theora and Vorbis Video Decoder in JavaScript - January 2nd 2014
- Top 10 Performance Techniques for PhoneGap and Hybrid Apps ? Slides Available - October 30, 2013 by Christophe Coenraets
- The Complete Guide to Building HTML5 Games with Canvas & SVG - undated, appears 2013
- HTML5 vs Native: The Mobile App Debate - June 3rd, 2011 by Michael Mahemoff
With the Android Webview you can reduce screen flicker *when changing orientation*, by reading below.
Cookie and Window Management
The standard behavior for an Activity is to be destroyed and recreated, when the device orientation or any other configuration changes. This will cause the WebView to reload the current page. If you don't want that, you can set your Activity to handle the orientation and keyboardHidden changes, and then just leave the WebView alone. It'll automatically re-orient itself as appropriate. Read Handling Runtime Changes for more information about how to handle configuration changes during runtime.
- Stephen Woods: "Creating Responsive HTML5 Touch Interfaces"
- http://yuiblog.com/blog/2012/02/23/video-stephen-woods-html5-touch/
- includes: swipe, snap back/forward, bounce, native scrolling, pinch to zoom + pro-tips.
Lodash, the JavaScript Library You're Already Using
http://www.infoq.com/news/2015/03/lodash-utility-library
Though lodash is popular with node.js developers, it is also used by browser-based projects. Web developers can use the experimental build tool to cherry-pick which methods their project needs rather than downloading the entire library. For node.js projects, individual methods can be included when the whole package isn't needed.
Comparing JavaScript Templating Engines: Jade, Mustache, Dust and More - November 11, 2014
https://strongloop.com/strongblog/compare-javascript-templates-jade-mustache-dust/
Lets talk templates, specifically JavaScript powered templates. Even more specifically ? template engines that work as well on the server side as they do on the client side.
Templating Engines (undated)
http://jster.net/category/templating-engines
These JavaScript templating engines allow you to perform string interpolation and then some using some specific templating syntax. Examples: mustache.js and Jade.
5 Ways to Make Your Site Smaller and Faster - February 8, 2015
https://davidwalsh.name/site-speed
To be a great everyday developer, we're almost destined to feel as though our work isn't good enough -- what a negative way to live our lives!
The good news is that there are a few methods for incredible easy gains in the performance and load time departments. Here are five gains you can complete in minutes to make your site faster for all users!