Entscheidungen, Entscheidungen – 3 Tage Javascript Days in Berlin

HTML5, CSS3 und Javascript werden in den letzten Jahren oft in einem Atemzug genannt, wenn man für moderne Websiten und Webapplikationen werben will. Dennoch sollte man nicht glauben, dass Javascript nur das nette Beiwerk zu den zuvor genannten Technologien ist. Was derzeit alles mit Javascript möglich ist und auch schon damit gemacht wird, sollten mir die drei Tage „Power Workshops“ auf den Javascript Days in Berlin zeigen. Und weil Javascript so ganz ohne HTML auch blöd ist, gab es für uns TeilnehmerInnen nicht nur sechs Workshops pro Tag zu ganz unterschiedlichen Javascript-Themen zur Auswahl, sondern auch im Rahmen der HTML5 Days jeweils zwei weitere Themen im Angebot. Wer die Wahl hat …

Erster Tag – Testing mit Javascript

Javascript Days 2014 - Frontend TestingDie Agenda war gut gefüllt. Nach dem Check-in und dem problemlosen Login ins Konferenz-WLAN fiel meine Wahl auf die zwei halbtägigen Workshops zu Frontend-Tests mit Sebastian Golasch. Dabei ging es in dem Vortrag weniger darum, wie man Javascript testet, sondern eher darum, mit Javascript basierten Tools Websiten aus Usersicht zu testen. Deshalb stand im ersten Teil nach einer Einführung in die Grundlagen von Webdriver das von Sebastian Golasch selbst entwickelte Tool DalekJS im Mittelpunkt. Spannend für mich waren dabei die Möglichkeiten, wie man mit diesen Tool verschiedene Browser fernsteuern und somit echte Userinteraktion automatisiert nachstellen kann. Wozu das Ganze? Weil Websiten oder -applikationen manchmal so komplex werden, dass das Durchklicken von diversen Szenarios in allen wichtigen Browsern zeitaufwändig und gleichzeitig immer fehleranfälliger wird. DalekJS ist ein Tool von Frontend-EntwicklerInnen für Frontend-EntwicklerInnen mit dem Anspruch der einfachen Bedienung. Derzeit noch stark in Entwicklung, lohnt es sich dieses Tool dennoch schon einzusetzen oder zumindest im Auge zu behalten.

Nicht alles ist automatisch gut testbar

Im zweiten Teil des Tages gab es einen Querschnitt zu diversen anderen Testing Tools zu den Themen Performance Regressionstests, Image Regessionstest, Stress Tests und CSS Regressions Tests. Hierzu gilt es bei den vorgestellten Tools genau abzuwägen, ob sich der Aufwand des Einsatzes wirklich lohnt und ob überhaupt relevante Ergebnisse zu erwarten sind. Sinnvoll war die Vorstellung allemal, da der Vortragende zu jedem Tool seine Erfahrungen teilte. Mein Fazit hierzu ist, dass die Tools in mehr als der Hälfte der Fälle netten Spielereien sind, die aber das Finden von Fehlern auf automatisierte Weise nicht wirklich effizienter gestalten. Somit ging der erste Tag mit der Erkenntnis zu Ende, dass DalekJS definitiv einen näheren Blick verdient und automatisierte Tests nicht immer besser als das altbekannte „4-Augen-Prinzip“ sind.

Zweiter Tag – Get in Touch

Javascript Days 2014 - Touch InterfacesAuch am zweiten Tag fiel die Wahl nicht leicht. Für den Vormittag entschied ich mich für „Touch-Interfaces“. Patrick Lauke stellte seine beeindruckenden Testergebnisse zum Verhalten von diversen mobilen Geräten bezüglich Touch und Mouse Events vor. Und wie schon bei den Browsern am Desktop, war ziemlich schnell klar: der Wildwuchs ist erstaunlich. Im weiteren Verlauf ging es im Vortrag um drei wesentliche Probleme vor den jedeR EntwicklerIn steht, die Websiten auch auf Touch Devices wirklich gut funktionieren lassen soll:

1. Es gibt zwischen Touch Events und Mouse Events auf den meisten Geräten eine Verzögerung von ca. 300ms. Hört sich wenig an, erweckt aber beim User oft den Eindruck, dass die Website auf dem mobilen Gerät nicht so schnell auf einen Klick (bzw. Tap) reagiert, wie am Desktop.

2. Mouseover gibt es auf Touch Devices nicht. Damit entfallen nicht nur viele Mikrointeraktionen, die durch den Mouse Hover starten, sondern es kann dazu führen, dass ganze Funktionalitäten am Handy oder Tablet nicht verfügbar sind (z.B. Ausklappmenü).

3. Das Mousemove Event wird nur einmal ausgelöst und somit funktionieren mausverfolgende Funktionen am Touch Device nicht.

Patrick Lauke stellte diese Probleme in kleinen Testfällen gut nach und zeigte Lösungen auf, wie diese durch Reagieren auf die Touch-Events, die auf den entsprechenden Geräten zusätzlich zu den Mouse-Events zur Verfügung stehen, umgangen werden können. Meine Haupterkenntnis dieses Workshops war, dass man nicht in Schubladen wie „Mobiles Gerät“ oder „Desktop“ denken und programmieren darf, da es jetzt schon viele hybride Geräte gibt, die sowohl mit Touchscreen als auch mit anderen Eingabegeräten wie Maus oder Tastatur steuerbar sind. Die Programmierung muss die Eingabe über alle Eingabegeräte reibungslos ermöglichen. Nicht zuletzt werden damit auch Anforderungen zur Barrierefreiheit erfüllt.

Raumplanung in der vituellen Welt

Der Nachmittag sollte für mich eine Herausforderung werden, da der Vortrag von Kore Nordmann zu „Web Application Architecture“ in keinster Weise leichte Kost war. Software Architektur ist vergleichbar mit Raumplanung in der realen Welt und der Vergleich zeigt, dass dies durchaus eine komplexe Aufgabenstellung ist. Eine Flut an Begrifflichkeiten von Caching über Multi-Master Setup bis zu Layered-Code-On-Demand-Client-Cache-Stateless-Server (LCODC$SS) und deren Vor- und Nachteile wurden erklärt. Anhand von drei Beispiel-Anforderungen konnte in Teams eine Software-Architektur entwickelt werden. Mein Fazit dazu: Man muss nicht alles wissen, aber gut wenn man weiß, wen man fragen kann.

Lightning Talks – ein unterhaltsames Abendprogramm

Javascript Days 2014 - QuadcopterEin gelungener und sehr unterhaltsamer Abschluss des Tages waren die Kurzvorträge zu Themen, die es sonst nie auf eine Konferenz schaffen würden. So wurden Tools wie Codepen, Ionic Framework, UserSnap oder Consul vorgestellt oder aber über Quadcopter, persönliche Fitness oder Lesen von Spezifikationen referiert. Letzteres wurde von Peter Kröner in einem unglaublichen Sprechtempo und mit sehr viel Witz transportiert, dass mir danach nicht nur klar war, warum „chucknorris“ ein gültiger Farbwert ist sondern auch, dass 42 nicht die Antwort auf alles ist.

Dritter Tag – AngularJS und Grunt

Der letzte Tag begann für mich am Vormittag mit einer Einführung in AngularJS. Das Javascript Framework von Google wurde anhand einer Mitmach-Beispiel-App von Sascha Brink und Philipp Tarasiewicz – beides Teammitglieder der deutschsprachigen Plattform für AngularJS – vorgestellt. Nachdem Philipp die Features von AngularJS theoretisch erklärt hatte, führte Sascha durch die Entwicklung der Beispiel App für einen Color Picker. Die beiden stellten die App gleichzeitig auf Github zur Verfügung (wie übrigens viele der anderen Vortragenden auch). Es war ein guter Einstieg und für mich wertvoller als das Selbststudium eines Fachbuches dazu, weil natürlich viel interaktiver auf Fragen eingegangen wurde.

 Grunt und Yeoman – Abläufe vereinheitlichen

Javascript Days 2014 - GruntStefan Baumgartner erklärte was alles mit Grunt – dem Javascript Taskrunner – im Entwicklungsprozess automatisiert ablaufen kann. Grunt gibt es seit 2012 und es erfreut sich bei vielen Frontend-Projekten schon großer Beliebtheit. Wenn Frontend häufig in ähnlicher Weise entwickelt wird (also das Projektsetup gleich ist) lohnt sich die Erstellung von Grunt-Tasks für Prozesse wie Syntaxcheck, Minifizieren von CSS und Javascript oder Livereload während der Entwicklung. Dabei gilt es zu beachten, dass es für Grunt schon eine Vielzahl von Plugins gibt, die aber selbst unterschiedliche Qualität aufweisen. Ein guter Leitfaden sind die offiziellen (contrib) Plugins, welche regelmäßig weiterentwickelt werden.

Yeoman ist ein Tool, mit dem man sich Setups für bestimmten Projekttypen (z.B. AngularJS) generieren kann, d.h. es wird eine Verzeichnisstruktur angelegt und schon diverse Dateien mit Beispiel-Code hineinkopiert. Hier gibt es eine Vielzahl verfügbarer Generatoren, aber man kann sich auch für die eigenen Projekte einen spezifischen Generator schreiben. Wie einfach das geht (wenn man erst mal weiß wie, da vieles davon undokumentiert ist) zeigte Stefan im zweiten Teil seines Vortrags.

Mein Fazit zu diesen Tools ist, dass wir bei datenwerk Grunt noch intensiver nutzen können, um unserer Frontend-Entwicklungs-Tasks effizienter ablaufen zu lassen.

Fazit

Auf so vollgepackten Konferenzen wünsche ich mir manchmal einen Zeitumkehrer wie in Harry Potter um bei allen Vorträgen dabei sein zu können. Da diese Art von Magie leider nicht existiert, hilft der Veranstalter mit einem umfangreichen Download-Package zu allen Vorträgen der Konferenz. Außerdem konnte man sich in den Pausen auch gut mit den anderen TeilnehmerInnen austauschen und erfahren, was in den parallelen Workshops passiert. Insgesamt war es ein toller Einblick in sehr unterschiedliche Themen mit dem Schwerpunkt Javascript auf einer perfekt organisierten Konferenz mit durchweg kompetenten Vortragenden.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.