A week of hard work pays off: Between 21.02.2011 and 25.02.2011, the OpenSource JavaScript library OpenLayers was extended to support mobile devices. This makes it possible to provide the full potential of web-based map applications to users of so-called smartphones.

The Mobile Code Sprint was initiated and organized primarily by Cedric Moullet (Swisstopo) and Claude Phillipona (camptocamp), who, thanks to the numerous sponsors (including terrestris), were able to invite a group of 15 JavaScript developers to the Ecole Polytechnique Fédérale (EPFL) in Lausanne. Thanks to terrestris, I, Marc Jansen, was able to travel to Switzerland.

The goals set by the team around the core developers Christopher Schmidt, Tim Schaub, Andreas Hocevar, Eric Lemoine, Pierre Giraud, Frédéric Junod and Bart van den Eijnden were high:

• Operation of the map displayed by OpenLayers using fingertip gestures. The OpenLayers map should feel like a native smartphone application (so-called app)
• Exemplary surface design analogous to the visual representation of native apps with the help of the well-known and widely used JavaScript libraries Sencha Touch and jQuery Mobile
• Optimization of the loading times of an OpenLayers map application
• Performance increases in internal programming processes to provide smooth operation
• Evaluation and, if necessary, use of new technologies such as the Geolocation API, Web Storage, CSS transformations, etc.
• Support also for older smartphones without multitouch interfaces, such as those offered by iPhones or some Android devices from various manufacturers
• Updating and redevelopment of numerous examples that show the use of OpenLayers.

The goals listed above have been largely achieved, so that OpenLayers can now be used for the development of mobile web-based map applications. The easiest way to illustrate the new or modified functionality is by means of examples:

• Mobile Navigation (Pinch, Pan, DoubleTap, TapToPan)
• more complex interfaces with Sencha Touch and Mobile jQuery
• Geolocation
• further mobile examples in a listing adapted to mobile devices

In order to reduce the initial loading time of maps with OpenLayers, the JavaScript compressor and optimizer Google Closure will be used in the future when creating special OpenLayers variants. In addition, the integration of tools such as csstidy and pngcrush has improved the external CSS stylesheets and the graphics used.

With regard to the optimization of internal processes, the reduction of the time required by JavaScript to move the map in functions by an incredible 75% is an example. The so-called panning (see examples above) feels very natural and provides a good user experience. OpenLayers maps that are not primarily requested by smartphones also benefit from this improvement.

The changes, which were developed, quality-assured and documented jointly, have not yet been published in a new release OpenLayers 2.11. However, a corresponding version is expected to be available shortly.

At this point, I would like to express my sincere thanks as a fellow sprinter to the organizers, sponsors and other participants of the sprint. The technical conditions at EPFL, the family atmosphere and the tireless efforts of the participants contributed to the further development of OpenLayers and to prepare it for the mobile future.

01.03.2011: Core developers Pierre Giraud and Frédéric Junod added, spelling