jQuery Europe 2013, Tag 1

Am 20 bis 22. Februar fand der europäische Ableger der jQuery Conference statt. Als Austragungsort wurde das verschneite Wien gewählt; und mit dem Palais Liechtenstein ein würdiger Veranstaltungsort gefunden (siehe Bilder unten).

Rund 400 Besucher trafen sich in Österreich um sich an einem Workshop-Tag und zwei Konferenz-Tagen mit Themen rund um das jQuery-Ökosystem zu beschäftigen. Nachfolgend führen wir (Thomas Junghans & Daniel Koch) die Beiträge kurz auf, verlinken Informationen und liefern Zusammenfassungen von ausgewählten Talks.

jQuery Conference Europe 2013A device continuumDiversity withinSerious diversity2011-2012: 27 Browser, 115 VersionsReality: most popular resolutions

The State of jQuery – Richard Worth

Richard D. Worth eröffnet die Konferenz in seiner Funktion als Direktor der jQuery Foundation und gibt einen kleinen Einblick in die Entwicklungsgeschichte, in die Arbeitsweise und die Visionen hinter den einzelnen Teilprojekten (jQuery UI, jQuery Mobile, Team, Community). Dabei wurden einige interessante Zahlen/Fakten genannt:

  • jQuery ist 7 Jahre alt
  • 55,7% aller Websites nutzen jQuery
  • 63.2% der Top 10’000 Website verwenden jQuery
  • 90,7% aller Websites mit JavaScript nutzen jQuery
  • jQuery ist damit weiterhin die Standard JavaScript-Bibliothek
  • Die Vision ist weiterhin identisch: small and fast, write less, do more.

4 Aufgaben

Der Fokus und die Hauptaufgaben, damals wie heute werden weiter verfolgt. Seit Version 1 konzentriert sich jQuery auf folgende vier Bereiche:

Der Umfang (Scope) von jQuery (Core) ist erreicht. jQuery macht nicht mehr und nicht weniger, und dies entspricht den bis heute noch aktuellen Zielen des jQuery-Projektes. Für weitere Funktionen bietet jQuery eine Plugin-Architektur an, die ein wichtiger Bestandteil ist, um Erweiterungen zu integrieren und zu ergänzen.

Was steht in Zukunft noch an?

  • Es sollen weitere CSS3 Selektoren implementiert werden
  • Die Unterstütztung von „Source Maps“ ist gerade für den Entwicklungsprozess ein hilfreiches Mittel

Broken Code

Ein weiterer starker Fokus folgender jQuery-Versionen wird die „Verschlankung des Cores“ sein. Die effektivste Möglichkeit Code zu verschlanken (engl. streamline) ist Code zu entfernen. Aus diesem Grund ist auch von broken code die Rede.
Dafür werden in Zukunft verstärkt Funktionalitäten aus der Streamline API (mehr dazu im jQuery Blog) identifiziert und veraltete Funktionen entfernt. Eines der wohl markantesten „Features“ (Optimierung) der kommenden Version 2.x ist die fehlende Unterstützung für den Internet Explorer 6-8.

Sofern diese Browser dennoch unterstützt werden sollen, bietet sich das Einbinden der Version 1.9 mittels Conditional Comments an.

Zusammengefasst:

  • jQuery v. 1.9: Includes IE-Support
  • jQuery v. 2.0: Drop support for IE 6 – 8)

Beide Versionen werden gepflegt. Die API-Kompatibllität ist gewährleistet, es gilt die folgende Gleichung:
1.9 API = 2.0 API

Für das Updrade auf eine höhere jQuery-Version exisitiert seit kurzer Zeit das jQuery Migrate-Plugin. Eingebunden liefert es in der Browser-Konsole Hinweise zur Kompatibiltiät des eigenen Projektes.

jQuery UI

Zum jQuery UI-Projekt stehen, nach langer Release-Pause und dem kürzlichen Erscheinen der Version 1.9, folgende Themen für 2.0 auf dem Plan:

  • Erneuerung des Projektes (Auffrischung)
  • Simplere API
  • Bessere Stabilität mit ausführlicher Dokumentation und Test-Suite für jedes Plugin

jQuery UI ist mittlerweile vier Jahre alt. 2,5 Jahre und 24 point releases gingen allein für die Entwicklung von Version 1.8 bis 1.9. Die Release-Zyklen sollen von 2,5 Jahre auf 3 Monate reduziert werden. Version 1.10 ist bereits erhältlich. Ab Version 1.9 fehlt die IE6-Unterstützung.

jQuery Mobile

Das Team um das jQuery Mobile-Projekt konnte vor wenigen Tage die Version 1.3.0 final veröffentlichen. Es besteht mittlerweile aus 50 aktiven Team-Mitglieder, die alle Aufgaben von Implementierung, Testing, Infrastruktur, Standards bis hin zu Events übernehmen. Es fehlt noch an Fachkräften. Wer mithelfen will kann sein Interesse via contribute.jquery.org bekunden.

jQuery Sites

Während der kürzlichen Überarbeitung der Website http://jquery.com wurden ebenfalls folgende Plattformen erstellt oder erneuert:

Jeder kann aktiv via Pullrequest teilnehmen, da es sich um öffentliche Github-Projekte handelt.

Die Slides von Richard Worth sind online abrufbar.

The jQuery UI Widget Factory – Adam Sontag, Corey Frang

Corey Frang stellt mit der Widget Factory in seiner Präsentation einen wichtigen Baustein der jQuery UI-Komponenten-Library vor. Die Prinzipien lassen sich auch für andere jQuery-Plugins anwenden und helfen dabei, den Code zu strukturieren und damit wartbarer sowie übersichtlich zu halten.

Die Slides sowie weitere Informationen zur Widget Factory gibt es auch auf der jQuery-Website.

CSS3 Transitions, Animations and jQuery – Doug Neiner

Welche CSS-Strategien gibt es bei der Animation von Teilen einer Website? Doug Neiner stellt drei unterschiedlichen Ansätze vor mit denen CSS angewendet werden kann. Zu diesen gehören

  1. strategische Klassen
  2. globale <style>-Manipulation
  3. direkte Inline-Style-Manipulation (im Attribut)

Mit „strategischen Klassen” sind CSS-Klassen wie

.is-hidden

und

.is-visible

gemeint (diese werden von CSS-Guru Jonathan Snook unter State Rules genauer beschrieben).

Für CSS-Anweisungen, welche dynamisch erstellt werden und mehrere Elemente betreffen, eignet sich die Erstellung und Einbindung eines neuen <style>-Elementes im <head>-Bereich. Ziel ist es möglichst viele Style-Anpassungen mit möglichst wenig DOM-Zugriffen zu machen.

Inline-Styles im Attribut eines HTML-Elementes zu definieren, ist nur in speziellen Fällen nötig und sollte als letzter Ausweg betrachtet werden.
Doug Neiner gibt Tipps zur effizienten CSS-Nutzung innerhalb von jQuery und zeigt einige Beispiele auf. Es ist zum Beispiel besser CSS-Klassen hinzuzufügen oder zu entfernen anstatt mittels .css-Methode CSS-Eigenschaften zu verändern.

Beim zweiten Teil des Vortrages geht es um CSS3-Transitions. Mit CSS3-Transitions können Style-Änderungen mit Effekten und Zeitverzögerungen versehen werden. CSS3-Transitions können jetzt schon verwendet werden. Browser die CSS3-Transitions nicht verstehen, werden Style-Änderungen wie gehabt (sofort) übernehmen (Graceful degredation). Beispiele zu CSS3-Animationen mit Keyframes und Performance-Tipps werden am Schluss erwähnt. Mehr Informationen dazu stehen in den Slides (siehe auch).

Using RequireJS for building component-based JavaScript applications – Sebastian Kurfürst

Sebastian Kurfürst, aus dem TYPO3 Core Team, gibt einen Überblick über den Einsatz von RequireJs in komplexen Web-Applikationen und -Produkten. RequireJS wird bei TYPO3 für die Auflösung sowie saubere Architektur der clientseitigen JavaScript-Funktionalitäten verwendet. Details sind in seinen Slides zu finden.

Talk To Me – Making web sites accessible to those who can benefit the most from them – Jörn Zaefferer

Jörn Zaefferer von bassistance.de zeigt einige Beispiele auf, wie Personen mit verschiedenen Behinderungen eine Webseite bedienen. Er beginnt mit einer Auflistung von Vorteilen einer zugänglichen Webseite.

„Being good is good for business”

ist der erste Punkt. Weitere Punkte sind den Slides zu entnehmen.

Von diesen Vorteilen können auch Personen ohne Behinderung profitieren. Zum Beispiel ist die User Experience einer zugänglichen Website automatisch für alle Benutzer besser. Eine zugängliche Website verlangt validen und semantisch korrekten HTML-Markup welcher gleichzeitig die SEO einer Website verbessert.
Jörn Zaefferer gibt Tipps wie die Zugänglichkeit einer Website getestet werden kann. W3C-Validator, Tastatur und Screenreader sind essentielle Hilfsmittel. Wer die Maus weglegt und eine Website versucht alleine mit der Tastatur zu steuern, stellt Schwachstellen schnell fest.

Erwähnt werden Techniken zur Verbesserung der Zugänglichkeit wie zum Beispiel der virtuelle Cursor und Aria-Live Regions (siehe auch). Die Slides und weitere Informationen zu Web-Accessibility sind auf Github.

What jQuery is good for on the server – Golo Roden

Golo Roden demonstriert wie sich mittels einem einfachen node.js-Setup und dem verfügbaren node.js-Paket jQuery serverseitig für jegliche (DOM-)Manipulation, beispielweise von externer Inhalte eignet. Wem es gefällt ;-). Ressourcen zum Vortrag gibt es auf Github.

Next Generation Media made easy – Sascha Wolter

Sascha Wolter, bezeichnet sich als „Craftsman for M2M, Rich Applications and Mobile Apps in all flavors.“

In seinem Vortrag auf der jQuery Conference 2013 prophezeit er einen starken Anstieg der Anwendungsfälle von Webtechnologien im Bereich der Mensch-zu-Mensch-Kommunikation.
Kommunikation und Anwendungen von klassischen, heute bekannten Devices (sog. Genereal-pupose computer) werden erweitert und vielfälltiger (z.B. bei Embedded systems). Die Kommunikation und Integration wird auch durch Sprachen wie JavaScript einfach(er) möglich.
Neue Devices werden entstehen, neue Möglichkeiten bei der Integration, zum Beispiel von der Sensorik, werden in heute noch unbekannten Geschäftsbereichen Einzug halten.
Die Interaktionen werden natürlicher. Die Mensch-zu-Mensch-Kommunikation steht vor neuen Herausforderungen. Command-Line-Interfaces und Keyboards sind heute aktuell, werden jedoch weiterentwickelt bzw. ändern sich. Der Trend geht in Richtung sog. „Super-Natural Interaction“. Die ersten Vorläufer sind bereits bei Spielkonsolen im Einsatz (XBOX, Wii, …). Auch in diesen Bereichen stehen schon erste API-Wrapper auf Basis von JavaScript zur Verfügung; die Basis um solche Hardware auch mit modernen Webtechnolgoien in neuartige Interfaces zu integrieren.
Sascha Wolter sieht durch die Erweiterung/Veränderung der Anwendungsmöglichkeiten eine Stärkung der Entwickler. Konzerne werden immer mehr versuchen sie für Ihre Produkte und Frameworks zu begeistern (Beispiel auf YouTube ;-)), um die eigenen Produkte und Dienstleistungen besser am Markt zu positionieren. Entwickler werden ein wichtigen Schlüssel zu mehr Innovationen werden. In diesem Zusammenhang bekommen auch APIs, zur Integration von Informationen und Services einen immer höheren Stellenwert. Uns steht eine spannende Zukunft voraus. Wer schon jetzt ein wenig mit den neuen Möglichkeiten experimentieren möchte oder sich einige – eher nicht so ernst gemeinte Anwendungen anschauen will – dem sei dieses Set ans Herz gelegt ;-)

Die Slides der Konferenz sind noch nicht online, dafür aber eine Version mit ähnlichem Inhalt.

Helping or Hurting – Christian Heilmann

Christian Heilmann ist Vollblut-Techie und Principle Developer Evangelist bei Mozilla. Er hat eine unglaubliche Übersicht über die Webentwicklung und scheint über alles Bescheid zu wissen, was im Web für Aufregung sorgt. Gleichzeitig beobachtet er die Entwicklung des Webs sehr aufmerksam und versucht dies in den richtigen Kontext zu rücken.
In seinem Vortrag redet er über die Weiterentwicklung des Webentwicklers und die Webentwicklung selbst. Dabei dreht er die Zeit gut 10 Jahre zurück, als Tabellen-Layouts noch üblich waren. Er zeigt Schwachpunkte auf und präsentiert Lösungen auf einer sehr unterhaltsamen Art und Weise.

Über seinen Vortrag hat er einen Blog-Artikel geschrieben. Seine Präsentations-Slides sind ebenfalls online erhältlich.

Eine Zusammenfassung von Tag 2 gibt es hier.

Hinterlasse eine Antwort

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

*

*

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>