Die Großartigkeit der neuen Twitter-Mobile-App für iPhone/iPod/Android

Aus meiner Sicht gibt es eine neue technische Referenz in Sachen »Mobile Web-App«, und die heißt Twitter. Ich hatte ja vor einigen Monaten schon Spiegel Online gelobt für ihre beispielhaft schlanke und gut bedienbare mobile Website. Im Bereich der Web-Applikationen sitzt nun Twitter auf dem Thron. Hier ein paar Gründe und Beobachtungen:

Die App ist pfeilschnell und wirkt ungewöhnlich nativ, zumindest auf dem iPhone 4. Sie besitzt einen Footprint von initial 276 KB mit 23 HTTP-Requests. Zieht man die Avatar-Bildchen ab, sind es nur noch 7(!) Request und 220 KB. Wie kriegt man das so klein und handlich? Nun:

  • Es gibt nur eine einzige CSS und eine einzige JS-Datei. Beide sind per Code-Optimierer komprimiert und werden natürlich per gzip übertragen.
  • Das JavaScript ist mutmaßlich ohne großes Framework verfasst und enthält nur die notwendigsten Dinge.
  • Sämtliche dekorativen Bilder sind in einer einzigen 50 Pixel hohen sprite.png zusammengefasst

Eine entscheidende Frage stellt sich zusätzlich jedem mobilen App-Entwickler: natives oder nachgebautes Scrolling? Und obwohl es ja unter iOS 5 möglich wäre, per position: fixed; die Menüleiste festzukleben und darunter nativ zu scrollen, hat man sich bei Twitter für die nachgebaute Variante, und zwar die mit CSS3 3D-Transforms entschieden. (Auch ohne sichtbare 3D-Effekte sorgt der Einsatz dieser Technik nämlich dafür, dass der Grafikbeschleuniger-Chip des iPhone angesprochen wird, und das Scrolling so weich wird, dass Android nur neidisch sein kann.)

Die zweite entscheidende Frage: Mache ich beim Hinzufügen zum Home-Screen eine »abgeschlossene App« draus, werde dadurch Adressleiste und Footerleiste los und nehme dafür in Kauf, dass Hyperlinks nach draußen einen Sprung zu MobileSafari verursachen, wie in meinem Artikel neulich bemängelt? Twitter hat sich dagegen entschieden: Die Adresszeile wird durch intelligentes Anspringen von Ankern Koordinaten pixelgenau versteckt, und die hässliche hellblaue Fußleiste wird schlicht in Kauf genommen und für Vor- und Zurück-Operationen genutzt.

Visuell entspricht die iOS-Version der Web-App fast 1:1 der nativen Version. Geht man jedoch mit einem anderen User Agent als »iPhone/iPod/Android« auf mobile.twitter.com, erwartet einen eine komplett andere App, die deutlich weniger Bling-Bling mit sich bringt:

Ob diese Fokussierung auf eine bestimmte Plattform die modernen Plattformen das ist, was man unter »One Web« versteht, ist natürlich fragwürdig. Aber lässt man diese idealistischen Überlegungen außen vor, kann man hier viel lernen über Performance und intelligentes mobiles Webdesign. jQuery Mobile ist dagegen eine lahme Schnecke.

7 Kommentare

Patrick W.

„Geht man jedoch mit einem anderen User Agent als »iPhone/iPod« auf mobile.twitter.com, erwartet einen eine komplett andere App??“

Mit Android bekomme ich die gleiche App, wie du in deinen iPhone Screenshots zeigst.

Gerrit

Interessant. Dann gilt das nur für ältere/exotischere Clients!

Matthias Mees

Danke. Endlich mal jemand außer mir, der Twitter for … (in meinem Fall Android) gut findet.

Ja, Discover ist unnützt, ja, es wäre schöner, wenn Direct Messages leichter zu erreichen wären – aber abgesehen davon ist das eine flotte und schicke App, die bei mir TweetDeck for Android (das offenbar nach dem Aufkauf durch Twitter sukzessive lahmgelegt wird) rasend schnell ersetzt hat.

fwolf

Wer braucht schon jQuery (Mobile)? Ist doch sowieso totaler Overkill. Letztens hab ich mir ein Framework besorgt, dass von Haus auf »Mobile Platforms« ausgelegt ist, alles wichtige beherrscht, was jQuery / Mootools / usw. so macht, UND bei 20k eintickt.

Also genau die Größe, die jQuery ursprünglich mal interessant gemacht hat.

Den Rest gibt’s vorzugsweise in NATIVEM Javascript, oder man pflückt sich die wichtigeren Dinge via microjs.com zusammen.

cu, w0lf.

Mario

Wirklich sehr sauberes Handwerk! Und selbst auf meinem 3GS noch recht flott unterwegs.

Frank

Gerrit, ich muss dich aber auch mal loben! Ich hab gerade auf der heimischen Couch Deinen Blog mit trommel der neuesten Opera Inkarnation für Android angesurft – und sie funktioniert grandios. Mit dem Android Browser aber auch. Schnell und sauber. Ich find’s super. Frohe Weihnachten :-)

Leo

Sehr interessanter Artikel. Bin sonst nicht der Twitter User, aber das hab ich mir auch grad angeguckt. Wirklich gut gemacht.

Bin nämlich grad auch am gucken, ob ich eine App mache oder eine besser optimierte mobile Website. Ich glaube aber, der zentrale Vorteil der App ist, dass es eben nur 1 Klick entfernt ist. Die mobile Website kann man sich zwar bookmarken, aber ich glaube, daran scheitert es…das machen die meisten nicht…

Mich wundert allerdings gerade, dass die Adresszeile nicht mal durch nach oben scrollen aufgedeckt werden kann. D.h. ist man einmal auf twitter.com, ist das iPhone Browserfenster »verloren« und kann nur noch per Aufrufen eines Bookmarks gewechselt werden…

Kommentar verfassen