WebKit Webapps für den IEMobile/9.0 anpassen

Mit dem Release von Mango hat Microsoft einen Browser auf die Windows Phone 7 Platform gebracht, der gar nicht mal so schlecht ist, wie der Name Internet Explorer verlauten würde.

Zwar hinkt der Browser der Konkurrenz auf iPhone und Android nach wie vor meilenweit hinterher (html5test.com bescheinigt ihm gerade mal 30-40% der Punkte, die ein WebKit-Smartphone bekommt), jedoch kann der Browser, wenn er richtig eingesetzt wird, durchaus auch sehr schöne Webapps auf den Bildschirm zaubern.

Falle 1: Console.who?

Wenn die Webapp gar nicht laufen will, dann liegt es aller Voraussicht nach daran, dass im JavaScript Code irgendwo ein console.log() verwendet wurde. Das bringt (fast) jeden Internet Explorer zu Fall. Am Einfachsten wird das Problem umgangen, wenn einfach vor dem ganzen anderen JavaScript console.log definiert wird, wenn es nicht bereits vorhanden ist.

if ( window.console == undefined )
	window.console = { log: function( msg ) { } };

Dadurch müssen die nützlichen console.log Ausgaben nicht gelöscht werden und sogar im Internet Explorer 9 auf dem Desktop verwendet werden, wenn über F12 die Entwicklertools eingeschaltet sind.

Falle 2: window.setTimeout( callback, time, [ ] )

Die zweite Falle, in die ich mehrmals getappt bin, war die die Sache, dass der Internet Explorer keine Argumente für den callback in window.setTimeout unterstützt. Auch hierfür gibt es aber eine sehr einfache Lösung.

// das funktioniert im IEMobile nicht
window.setTimeout( myCallback, 100, arg1, arg2, arg3 );

// das funktionert im IEMobile einwandfrei
window.setTimeout( function() {
	myCallback( arg1, arg2, arg3 );
}, 100 );

Falle 3: no transitions (yet)

Microsoft wird erst mit dem Internet Explorer 10 CSS3 Transitionen und Animationen unterstützen. Dafür wird dann der -ms- Prefix verwendet werden.

Setzt die Webapp Transitionen voraus, sollte ein Fallback gebastelt werden. JavaScript Animationen sind zwar sehr aufwendig und langsam, als letzter Ausweg kann man sie aber durchaus in Betracht ziehen. jQuery bietet hier eine sehr schöne API dafür.

Und wie teste ich das Ganze?

Webapps für das Windows Phone 7 zu testen, ist nicht einfach. Weinre funktioniert leider nur mit WebKit Browsern und das fehlen einer console macht auch simpelstes Logging unmöglich. Zum Glück ist die Browser Engine des IEMobile der des Internet Explorer 9 auf dem Browser sehr ähnlich und bei eingeschalteten Developer Tools (F12) kann der Browser auch Debuggen, console.log. Oben drein gibt es dann auch einen Inspector, wie man ihn vielleicht von FireBug oder den WebKit Inspector kennt.

**update**

I have no touchevent and I must touch

Das wohl größte Problem des IEMobile 9.0 ist das Fehlen der Touch Events. Die in Desktop-Browsern verwendeten Drag’n’Drop Events werden leider auch nicht unterstützt. Einzig click wird als Event unterstützt. Das macht in gewissen Maßen mobile Entwicklung komplizierter als nötig.

Alternativen habe ich bis Dato leider keine gefunden. Da muss wohl Microsoft dran und die Events weiter reichen. Lustigerweise müssen sie sich dadurch ja auch selbst beschneiden. So bietet z.B. Nokia mittlerweile in den Webversionen ihrer Maps Anwendung für iOS und Android Offline Daten an. Im IEMobile/9.0 kann nicht mal die Online-Variante verwendet werden.

Der PlayStation Vita Browser

Seit ein paar Tagen ist die PlayStation Vita nun in meinem Besitz. Neben den bereits lang und breit diskutierten Vorzügen der portablen Konsole von Sony, stach vorab für mich vor allem die Tatsache hervor, dass das Gerät einen WebKit Browser mit sich bringt.

Der User Agent ist Mozilla/5.0 (PlayStation Vita 1.61) AppleWebKit/531.22.8 (KHTML, like Gecko) Silk/3.2. Auf dem Papier klingt das sehr vielversprechend. Die Engine der aktuellen Chrome Verison ist gerade mal AppleWebKit/535.11 und der Build des Mobile Safari des iPhones lag beim Release weit unter 500. Also sollte das Ding doch eine Waffe sein, oder?

Oder?

Leider nicht! Sony hat den Browser offensichtlich so kastriert, dass schlussendlich nichts übrig bleibt, was diesen Browser von einem Internet Explorer 7 abhebt.

Die Seite html5test.com bescheinigt dem Browser gerade mal 53 von 475 Punkten. Chrome kriegt 374+13, der IE auf dem Windows Phone 141+5 und der Safari am iPad 305+9. Was sich Sony dabei gedacht hat, wissen wohl nur sie selber.

Und im Klartext?

Im Klartext bedeutet das, dass der Browser für 90% der Aufgaben nicht gewachsen ist! Nicht einmal ein Video auf Youtube kann angeschaut werden, da weder Flash, noch HTML5 Video tags unterstützt werden.

Seiten mit Frames werden zwar unterstützt und der Browser versucht auch die Anordnung richtig zu machen. Das Scrollen funktioniert dann allerdings nur über Scrollbalken, die mikrig klein und kaum zu ertasten sind. Wurde der Scrollbalken einmal mit Glück erwischt, scrollt er einfach automatisch ans Ende der Seite.

Alles in Allem macht der Browser den Eindruck als würde er in einer Form von Emulation auf der PSVita laufen. Anders lassen sich das extrem langsame Rendering und die vielen Darstellungsfehler nicht erklären. Wird über JavaScript z.B. die DOM manipuliert, muss erst gescrollt werden, dass das Browser merkt, dass er neu rendern sollte.

Und zu guter Letzt gibt es nicht einmal einen Portraitmodus. Das hängt aber wohl an verschiedenen Einschränkungen des Systems zusammen. Den Modus sollte Sony aber definitiv nachreichen.

Dass Sony so dermaßen hinter aktuellen Smartphones her hinkt, hätte ich in dieser Form nicht erwartet. Die überlegene Rechenleistung wird hier gänzlich vergeudet und dass nicht einmal YouTube geht, ist peinlich.

M! Forum – Aus der Statistik

Ich habe gerade festgestellt, dass ich im September erstmals die 300k PIs mit der für Smartphones mit Webkit Browser angepassten Version des M! (aka Maniac) Forums überschritten habe. War mir gar nicht aufgefallen, dass sich die täglichen Visits seit Anfang des Jahres nahezu verdreifacht haben.

Platzhirsch ist immer noch das iPhone mit knapp 60% der Zugriffe. Nummer 2 ist bereits das iPad mit über 18%, der iPod folgt mit etwas über 12%. Android User benutzen wohl eher alternative Varianten wie Robos App, denn sie kommen auf gerade mal 6,58% der Zugriffe.

Meistgelesenes Board ist das OT. Das Smalltalk Board ist aber knapp dahinter (gerade mal 11k PIs). Die anderen Foren stinken im Vergleich ziemlich ab.

Die Meistgelesenen Threads seit 1.1.2010:
  1. Welche Spiele für iPhone/Ipod Touch lohnen sich? II – Spaceace – 22.11.09 16:51
  2. Best Price-Thread – Part 35 – bubbabenali – 31.05.10 16:02
  3. Best Price-Thread – Part 36 – KemoSabe – 09.08.10 15:30
  4. Best Price-Thread – Part 34 – Jannes – 17.03.10 19:32
  5. Der 20. hochoffizielle Apple-Thread – Yann – 01.07.10 22:29
  6. Der 21. hochoffizielle Apple-Thread – JPS – 04.08.10 20:27
  7. Neue Downloads auf dem Xbox-Live Marktplatz 19 – JPS – 22.03.10 10:38
  8. Der 19. hochoffizielle Apple-Thread – JPS – 14.06.10 23:31
  9. Durchgezockt Nr. 21 – Mr.B. – 27.05.10 15:43
  10. Best Price-Thread – Part 33 – Onrop – 13.01.10 21:18
Das Antworten Formular wurde über 4’000 Mal betätigt. Dabei gibt es es noch gar nicht einmal so lange, wenn ich mich richtig erinnere…