If you’re interested in knowing more about it, check out the happyfrog.ca widget page. We had a lot of fun making it, and are looking forward to doing additional widgets for other organizations in the future.

We’ve added an often-requested feature, kinda.

Some have complained that the search & menu drop downs don’t work, along with the post-excerpt drop down functions, ajax, etc. Those effects are all done using Prototype-based javascript. On some installations, users may have other plugins which are loading similar scripts, and because WPtouch doesn’t interfere with the loading of those plugins, the scripts get loaded with WPtouch and effectively disable its effects and advanced features.

So we decided the best way around that was to create a fucntion which would change the way that javascript effects work with WPtouch, and bypass the loading of Prototype altogether. This has multiple advantages:

• Fixes the broken drop downs, replacing them with DOM javascript actions
• Kills 100KB of javascript from having to load, speeding up the loading of WPtouch considerably
• Loading WPtouch-enabled sites over 3G is now FAST! Even on EDGE, the speed is now very comfortable (this depends on what other plugins you use, and the scripts they load, however)

For those of you who have no issues with WPtouch the way it is, the advanced javascript will still load just fine, and the regular features that WPtouch employs will work just fine. You may want to try both, and see which you prefer.

What’s Included?

- In addition to the new javascript control feature, we’ve added:

• Proper styling of YouTube embedded videos in mobileSafari running on iPhone’s with the 2.0 software
• We’ve also baked in a fix for some of you who had issues with the switch links (between WPtouch and your site’s regular theme)
• A number of styling tweaks were made, cleaning up the appearance of shaded text, and some spacing issues for longer post and page titles
• A number of corrections and cleanups for redundant code

The update is available through your WordPress admin panel for WordPress 2.5+ users, WordPress’ plugin repository, and through the website, here.

OVERWEIGHT AND BLOATED?

Having taken the broadband world for granted, we wanted to include some Ajax functions and Scriptaculous-based effects naturally, to add ‘ohh and awe’ to the theme. Though Scriptaculous (being built on the 90k Prototype) is heavy duty when it comes to mobile Safari’s capability to swallow it, and it soon proved to be a major blockade to developing the theme in the ways we had imagined.

I don’t have real-world stats for the comparison on hand as I write this, but our testing revealed that we’d have to explore other options to accomplish a lighter bandwidth footprint and still have the features we wanted, because it was disastrously slow.

Our preference was to use Scriptaculous, mostly because we were both familiar with it, and had a library of prepared code to draw up to speed up the development cycle. In short- we were lazy and looking for a quick fix to the predicament.

Enter compression. Now, I don’t claim to be an authority on this matter, as are there who need to take advantage of compression for mission critical application use, but I do know that when it comes to the raw transfer time of compressed vs. uncompressed scripts that every kilobyte makes an enormous difference, especially when we’re talking EDGE on the iPhone.

SQUEEZING INTO THESE PANTS

The combined weight of the javascript effects on WPtouch is a staggering 48kb. Consider that Prototype, Scriptaculous (Effects only) and some custom iPhone/iPod touch specific code is contained in that tiny package. Uncompressed, it was over 170kb. That savings (nearly 4 times smaller) changed the page load times dramatically, and allowed us to go forward with our Prototype/Scriptaculous plans.

STYLE FIRST

We used CSS wherever possible to provide colours and shapes, and if it weren’t for the fact that mobile Safari doesn’t support its big brother’s capability for CSS transforms, we would have been able to skip out on Scriptaculous for effects and just transform everything using CSS only.

A PICTURE IS WORTH A THOUSAND BYTES

The same was true for images. Whenever I could, I used the smallest possible sizes for files using a combination of very tiny crops for repeating images, and the ‘Save for web’ option in Photoshop.

I could have saved likely 50% more in file size if I had chosen .jpg as the predominant file type, but I really loved the quality that .png images provided. Early testing showed the difference in load times with .jpgs was nominal compared to the washouts I was seeing in colour with them.

MORE WEIGHT TO LOSE

We continue to trim and squeeze more weight out of WPtouch, and as we move towards adding new features it will certainly be something that will remain a constant challenge. With the advent of theme-capability for the plugin, we imagine that users themselves will come up with some dazzling examples of optimization- something we’re looking forward to seeing. In the mean time we’ll be focused on improving the theme as it is, and dabbling with Mootools and jQuery in compressed forms, along with other scripts available on the web for performing the functions we need will be explored.

What’s your experience with compression and file-size trimming? Have you got tricks we (and our readers) would love to know about?