Creating Fast Buttons for Mobile Web Applications
Enter Weinre. Weinre is a beta project written in Java that allows you to have a remote Webkit inspector-style debugging console on your desktop that can communicate with your mobile device. You can send alerts, do full console logging—even inspect the remote DOM tree. It’s in beta and occasionally a little buggy but totally useable.
To use it, run the java server on your local machine and add a single script tag to your project. You can also just download the Mac executable here. The full documentation is here – (its not very straightforward so post here if you have questions.)
At work, we use Charles to redirect production apps to our local dev server. My local server.properties file looks like this:
~/.weinre]$ cat server.properties
Thanks goes to coworker Jim for being the first Guinea Pig to try it out.
The first thing you learn building HTML5/CSS3 web apps is that enabling hardware acceleration is must for smooth animations and transitions. Here’s a great tip by Thomas Fuchs that explains how you can see what parts of your web app are hardware accelerated: http://mir.aculo.us/2011/02/08/visualizing-webkits-hardware-acceleration/