Mobile Version 1.0: jQuery Mobile

As an experiment, I have implemented a „mobile version“ for my website with jQuery Mobile. The downside of that framework is that even the customized (stripped-down), minimized format that I am using still consumes about 200 kilobytes, and that is more than the entirety of my desktop-version start page altogether.

This excessive network traffic consumption is mitigated to some degree by the DEFLATE filter active on my webserver for everything Javascript and CSS. I also do a lot of caching, so all the framework stuff is loaded only once even though my mobile version does a page reload on every navigation action (hitting a hyperlink or swiping to a different page).

Roundabout, swiping through the first 10 blog posts consumes 520 kilobytes of network traffic, which, if you ask me, is somewhere between „Well …“ and „Meh“. Being in part about music and hi-res photography, about half of my posts are featuring some sort of media, so it’s probably appropriate.

If you use one of the usual suspects in mobile webbrowsing (I mainly use Chrome on Android), the webserver should recognise this and send you off to the mobile version immediately. The mobile version then works like a slideshow that you can swipe to the right, browing backwards through the history of blog-postings. You can switch back to the desktop version at any time using the button conveniently placed at the start of each mobile page. You can also switch from the desktop- to the mobile version using the link at the bottom of every Desktop page.

This article is part of series "Mobile":
  1. Mobile Version 1.0: jQuery Mobile
  2. Mobile Version 2.0: jQuery With Specialized Plugins