GWT Blog-Serie – Wie GWT die maximale Leistung des Browser nutzt (2/4)

Im ersten Teil meiner Serie ging ich auf eine Umfrage über die Zukunft von GWT ein und beschrieb in Kürze, was GWT ist.
Ab 100 Zeilen JavaScript Code soll GWT besser optimiert sein, als würde man den Code selber schreiben. In diesem Teil der Serie, werde ich dieser Aussage auf den Grund gehen.

Performance von GWT dank Compiler

Sobald eine Web Anwendung gebaut wird, welche mehr als 100 Zeilen JavaScript Code verwendet, kann man davon ausgehen, dass GWT den besseren Code auswirft als würde man den Code selber in JavaScript schreiben. Verblüffende Aussage nicht wahr? Ich würde von mir behaupten, dass ich in der Lage sei, bei einem JavaScript von lediglich 100 Zeilen Code, ein Script zu schreiben, welches keine Performance-Leaks umfasst. Doch warum sollte ein von GWT optimiertes JavaScript performanter sein? Der Grund liegt im Java-zu-JavaScript Compiler. Dieser Compiler beschränkt sich nicht darin, den Code perfekt zu minifizieren und zu strukturieren, er offeriert noch einiges mehr.

Features des GWT Compilers:

  • Compile per Browser/Device
  • Dead Code Removal
  • Inlining
  • Renaming
  • Zipping
  • Secure caching

Compile per Browser/Device

Damit die Performanceoptimierung für jeden Benutzer ausgereizt werden kann, wird das JavaScript für jeden unterstützten Browser kompiliert. Dieser kompilierte Code enthält dann alle verwendeten JavaScript und CSS Ressourcen, welche genau für diesen Browser notwendig sind.

browsers

Quelle: http://diminiinc.blogspot.ch/2013/08/windows-browsers-comparison-august-2013.html

(more…)

Die Open-Data-Schatzkiste wurde geöffnet

Daten sind wertvoll

Daten sind das neue Gold. Das lässt sich durch den Datenhunger von Google, Facebook und der gesamten Werbe-Branche bestätigen. Nützliche, aus den Daten gewonnen Informationen sind Wissen und Wissen ist bekanntlich Macht.

Daten haben sich bereits in extremer Menge angehäuft und das Wachstum ist weiterhin exponential. Leider sind zu viele Informationen, welche für die Öffentlichkeit interessant sein könnten, aber unzugänglich. Das gilt vor allem auch für Daten von Behörden mit einem öffentlichen Interesse, beispielsweise von statistischen oder geographischen Ämtern. Für diese Daten hat der Steuerzahler bereits bezahlt und er hat ein Recht darauf diese zu nutzen. Oft sind diese Daten leider nur über Hürden und Umwege erhältlich. Entweder liegen sie in staubigen Aktenverzeichnisse oder sie sind als Download in einem nicht weiter verarbeitbarem Datenformat abrufbar oder die Nutzung ist gesetzlich nicht erlaubt. Open Data soll das ändern.

Open Data

Bei Open Data geht es darum Daten, welche vorher nicht zugänglich waren, sei es wegen der Form, dem fehlenden Zugang zu diesen Daten oder eines rechtlichen Verbotes, öffentlich zu machen. Ein Ordner mit statistischen Daten in einem Aktenschrank ist für die Öffentlichkeit unbrauchbar. Erst wenn die statistische Daten als Download bereitgestellt werden, kann Jedermann davon profitieren. Noch besser ist es, wenn ein Datenformat gewählt wird, der die Weiterverarbeitung erlaubt.

“Open data is data that can be freely used, shared and built-on by anyone, anywhere, for any purpose.”

Quelle: Laura James, CEO Open Knowledge Foundation, 3.10.2013

Vorteile der offenen Daten

Open Data schafft:

  • Transparenz
  • Innovation
  • Kosteneinsparungen
Quelle: Die Vorteile aus dem schweizerischen Open Data Manifest

Durch die erhöhte Transparenz kommt man eher zu neuen Erkenntnissen und Fehler werden schneller aufgedeckt. Die gewonnen Erkenntnisse schaffen Platz für Innovation und zum Teil massiven Kosteneinsparungen, wie ein Beispiel aus England zeigt.

“This is an exceptional example of Open Data being transformed into knowledge for everyone. It gives patients and GPs the tools they need to help realise big savings for the NHS – which is ultimately value for everyone.”

Quelle: Millions of Pounds in Prescription Savings Identified in Open Data by Innovative Startups

Grosse Datenmengen sind wie Goldminen mit versteckten Schätzen, die gefunden werden wollen. Mit den Daten lassen sich Visualisierungen erstellen, welche die Aussagekraft und Verständlichkeit der Daten erhöht (siehe Many Eyes von IBM oder die Visualisierung des Berner Budgets).

Wann sind Daten “offen”?

Daten gelten als offen wenn sie die Voraussetzungen der Definition des offenen Wissen erfüllen. Die Voraussetzungen bestehen aus elf Punkten welche den Zugang, die Nutzung und Integrität von Open Data beschreiben.

Open Data flower diagram

Bildquelle: Dr. Hans Rosling nutze dieses Bild in seinem TED Talk, und Tim Berners-Lee in seinen Slides

Daten ausgraben

Die technischen Vorraussetzungen (Punkt 4) von Open Data verlangen, dass Daten in einem offenen (im Gegensatz zu herstellerabhängigen / proprietären) Format als Download veröffentlicht werden. Beispiele für offene Datenformate sind JSON, XML und CSV. Bei CSV handelt es sich streng genommen nicht um einen Standard. Dies erklärt weshalb häufig unterschiedliche Trennzeichen für CSV-Attribute verwendet werden. Den Parsern zur Liebe sollte man sich auf Kommas einigen, schliesslich steht CSV für “Comma-Separated Values”.

Open-Data-Formate lassen sich mit einem Text-Editor öffnen und lesen. Word-Dokumente, Excel-Spreadsheets und PDFs sind ungeeignete Formate, da sie nicht wirklich offene Standards sind oder mit einem Texteditor öffnen lassen.

Tabellarische Daten auf seiner Website sollten auch als JSON, XML oder CSV (oder alle) verfügbar sein. Die Weiterverwendung der Daten sollte einfach gemacht werden.

Open Data können hürdenfrei, also ohne Authentifizierung, geographischer oder zeitlicher Einschränkung heruntergeladen werden.

Die Schweizerische Schatzkammer

Der Tagesanzeiger berichtete am 3. September 2013 über die Lancierung des Open-Data-Internetportals vom Bund. Endlich hat auch die Schweiz ein solches Datenportal. Staaten wie USA, Grossbritannien und Kenia praktizieren schon länger Open Data und habe bereits Datenportale. Bei den offenen Daten vom Staat, spricht man auch von Open Government Data (OGD). Mit diesen Daten lässt sich vieles machen, besonders in Kombination untereinander oder mit anderen Datenquellen.

Prominente Unterstützung

Die Open-Data-Bewegung kann auf prominente Unterstützung zählen. Sir Tim Berners Lee, der Erfinder des World Wide Webs beschreibt in seinem Artikel “Linked Data” und “Linked Open Data” und stellt eine Bewertungs-Schema für die Offenheit von Daten vor. Daten im Web sollen auch verlinkt werden können, genau wie Dokumente mit Hyperlinks verknüpft sind. Die notwendigen Schritte zu Open Data und Linked Open Data können von der 5-Sterne-Bewertung entnommen werden.

“This is for everyone #london2012 #oneweb #openingceremony @webfoundation @w3c”

Quelle: Tim Berners-Lee, Olympiade 2012 in London
5 star Linked Open Data on mug
Bildquelle

Fazit

Open Data lohnt sich. Für alle.

“You can give your data away now – and generate revenue and jobs, and even save money from the better information and decisions that will flow.”

Quelle: Neelie Kroes, Vize-Präsidentin der europäischen Kommission verantwortlich für die digitale Agenda, 12.12.2011

Diesen Monat und im November finden die von Open Data Zürich und OpenData.ch organisierten Open Data Zürich Hacknights 2013 statt. Als Open Data Enthusiast freue ich mich schon darauf.

Weblinks

GWT Blog-Serie – 88.84 Prozent würden Google Web Toolkit wieder einsetzen… (1/4)

Die Firma Vaadin lancierte 2012 eine Umfrage in der GWT Community zum Thema “Zukunft von GWT”. Aus den Antworten von über 1300 Teilnehmern entstand ein 32-seitiger Bericht darüber, wer GWT benutzt, in welchem Umfeld GWT eingesetzt wird, wo die Stärken und Schwächen von GWT liegen und wo der Weg von GWT hinführt.

Back_to_the_Future_gwt

Im ersten Teil meiner Serie gehe ich auf Details dieses Reports ein und beschreibe kurz und knapp was GWT ist.

(more…)

Drupal auf dem 10-Meter-Brett

Die drei Tage voller Sessions der Drupalcon 2013 sind gestern in Prag zu Ende gegangen. Was für uns bleibt ist gespannte Vorfreude auf nächstes Jahr und Ungeduld alle neu gelernten Tricks und Methoden in der Praxis auszuprobieren.

Die Konferenz selbst zeichnete sich wie üblich durch eine breite Vielfalt an Talks von Frontend bis CMS-Kern über Business zu Support aus. Insbesondere die technischen Talks befassten sich in der Mehrheit mit dem noch nicht veröffentlichten Release Drupal 8.

jump1
Bild: Creative Commons BY von Therme Loipersdorf

Das Brett

Drupal 8? Wer noch nichts von der kommenden Version gehört hat dürfte überrascht sein was alles im achten Release des Drupal-Kerns drinsteckt: Grosse Teile wurden durch Komponenten aus anderen Systemen ersetzt, so dass viele Komponenten nun auf dem PHP-Framework Symfony2 aufsetzen. Weitere integrierte Fremdtechnologien sind die Templating-Abstraktion mit Twig, PHPUnit, BackboneJS und YAML, um die wichtigsten zu nennen.

Der technologische Wandel, das Sprungbrett, ist definitiv der grösste Abstand, den es bisher zwischen zwei Versionen gab und es teilt die Community in gewisser Weise. Es verwundert nicht, dass innerhalb dieses Klimas auch ein Fork zum Stand vor Symfony geschah. Zumindest an der Drupalcon war die Atmosphäre wie wir sie erlebten diesem Wandel grösstenteils positiv gegenübergestellt. Es fehlte nicht an Talks, die versuchten bisher in Drupal nicht verwendete Methoden und Strategien der Softwareentwicklung näherzubringen.

Gründer Dries sagte in seiner Keynote, dass Drupal 8 kommt “when it’s ready” und das soll Frühjahr 2014 sein. Das macht etwas ungeduldig, weil produktiver Einsatz dann frühestens im Sommer möglich sein wird, wenn genügend Contrib-Module nachgezogen haben, was im einfacheren Sprung auf Drupal 7 auch eine signifikante Zeit dauerte.

drupalcon_grouphoto
Bild: Creative Commons BY-SA von Michael Schmid

Der Sprung

Gelingt der Sprung mit Fokus auf Objektorientierung, Erhalt von Flexibilität und die Behebung struktureller technischer Mängel auf dem Grossteil der Codebasis der Community (und nicht nur im Kern) dürfte Drupal ein gänzlich anderes Projekt sein als noch vor wenigen Jahren, aber ein umso spannenderes aus Techniksicht wie auch in der Breite der Einsatzgebiete für den Kunden.

Was wir sehen durften, was Drupal 8 jetzt kann, wie Probleme im Page-Caching, der Mehrsprachigkeit, der Konfiguration und vielen weiteren Aspekten gelöst sind, wird Drupal einen klaren Schritt attraktiver zum Enterprise-Einsatz und hebt sich umso mehr von anderen Content-Management-Lösungen im PHP-Bereich ab. Die Lücke zu etablierten kommerziellen Produkten wird im Kernbereich Content kleiner.

Nur das mit dem ganzen Singen auf der Drupalcon werden wir wohl nie verstehen.

The Sika Experience – und was wir daraus gelernt haben

Sika Experience

Gestern durften wir gemeinsam mit Melina Merkle von der Sika unser gemeinsames Projekt, die Sika Experience, auf der Social Media Conference in Hamburg vorstellen. (Der Vortrag wurde live und sehr schön Illustriert)   Eigentlich startete das Projekt bereits 2009 als Jubiläumskampagne … Weiterlesen

Smashing Conference 2013

Die diesjährige Smashing Conference stand ganz unter dem Motto «Personal Experiences». Das Thema war also offener als es gar nicht hätte sein können & die Speakerliste – quasi das Who is Who der Webszene – liess Grosses erhoffen.

Location: Historisches Kaufhaus

Hier mein Versuch, die Konferenz in drei Kernaussagen zusammenzufassen:

  1. Deciding in the Browser
  2. Progressive Enhancement, Progressive Enhancement, Progressive Enhancement
  3. Have fun!

Deciding in the browser

Die Zusammenarbeit zwischen Design & Frontend steht seit Responsive Web Design vor ganz neuen Herausforderungen.

Tools wie Photoshop, InDesign & Co. stehen in der Kritik dem Multi-Device-Web zu wenig Rechnung zu tragen. Dennoch sind sie DAS Tool für Designer, sich kreativ ausdrücken zu können. Das Designen im Browser wiederum benötigt Frontend-KnowHow & bietet zu wenig Platz für Kreativität. Dazwischen gibt es eine ganze Palette von Tools, die den neuen Umständen gerecht werden wollen, oftmals jedoch bloss Zwischenerzeugnisse für die Tonne produzieren.

Die Zeit ist also mehr als reif sich über den sinnvollen Einsatz/Mix von Kreativtools & Frontend Gedanken zu machen. Dan Mall & Jason Santa Maria haben dies getan & teilten ihre Erfahrungen mit uns. Die beiden leidenschaftlichen Webdesigner sind sich einig:

As an industry, we sell websites like paintings. Instead, we should be selling beautiful and easy access to content, agnostic of device, screen size, or context – Dan Mall

Ihr Vorschlag um dies zu erreichen ist so einfach, dass er sich in zwei umgemünzte Zitate packen lässt.

Zitat #1

Current design approach

New design approach

Die Design-Diskussion mit dem Kunden soll also nicht auf Basis von fertig gestalteten, pixelgenauen Designs geführt werden.

Denn was ist mit verschiedenen Screen-Grössen? Vernachlässigbar? Wohl kaum! Ein detail- und pixelgenaues Design verleitet aber dazu, die Design-Diskussion auch auf Level von Detail- und Pixelgenauigkeit zu führen. Dabei wird das Wesentliche – wie fühlt sich die Seite unabhängig von Device & Screen-Grösse an – oftmals ausgeblendet.

Dan Mall schlägt vor, statt dessen als Diskussionsgrundlage Styletiles – oder Visual Inventories o.ä. – zu verwenden.

«The Examiner» Styletiles

«The Examiner» – Projektübersicht

I don’t think we’re in a post-PSD era, but I do think we’re moving towards a post-“full-comp” era – Dan Mall

Anschliessend soll der Prozess in den Browser verlagert werden. Denn nur im Browser kann das Verhalten, die Verhältnisse der Elemente zueinander – unter Berücksichtigung von verschiedenen Screen-Grössen – sinnvoll dargestellt werden. Mit diesem Schritt werden zudem gleichzeitig auch andere Risikofaktoren ausgeschaltet & die Machbarkeit implizit sichergestellt.

Das für mich wichtigste Zitat der ganzen Konferenz folgte postwendend.

Zitat #2

… und wirken lassen …

Der Design-Entscheid soll also in den Browser verlagert werden. Damit hätte man auch gleichzeitig eine wunderschöne Definition of done. Nämlich:

It’s done when it’s done

Progressive Enhancement

Das Konzept von Progressive Enhancement ist so alt, dass man als Frontend Engineer schon fast nicht mehr darüber nachdenkt. Nichtsdestotrotz – oder eben vielleicht gerade deshalb – ist das Thema momentan wieder in aller Munde. Auslöser dafür war Nicolas Zakas Präsentation Enough with the JavaScript Already.

Durch die Verlagerung von Business- und Renderlogik in den Client, steht das bewährte Konzept von Progressive Enhancement erneut auf dem Prüfstand – Client Side Rendering, Model Driven Views etc. vertragen sich nur bedingt mit dem progressiven Gedanken.

Gleich mehrere Speakers – Andy Hume, Ethan Marcotte, Jake Archibald & Jeremy Keith – riefen uns das Konzept – und dessen Bedeutung im neuen Kontext – zurück ins Gedächtnis.

Dabei wurde oftmals der von BBC geprägte Begriff «Cutting the mustard verwendet. «The mustard» ist im Falle von BBC der «Support von HTML5».

  if('querySelector' in document
     && 'localStorage' in window
     && 'addEventListener' in window) {
        // bootstrap the javascript application
  }

Erfüllt ein Browser die Mustard-Kriterien so erhält er die Schöne-Neue-Welt-Version, falls nicht erhält er eine funktionale Core-Version. Die Mustard-Kriterien entscheiden schlussendlich mit über den Grad des «Enhancements».

Its a myth that progressive enhancement means making lowest common denominator designs. Its just about starting there – Jeremy Keith

Eine schöne funktionale Core-Version – die mit sage & schreibe 1 Request auskommt – zeigte Andy Hume am Beispiel der Mobile-Seite von The Guardian. Dieses Extrembeispiel zeigt, dass vor allem im mobilen Kontext – in dem Netzunterbrüche & fehlgeschlagene Requests keine Seltenheit sind – Progressive Enhancement die «gefühlte Verfügbarkeit» einer Seite drastisch verbessern kann.

Have fun!

Web & Spass gehören zusammen. Sei dies bei der Arbeit & natürlich auch überall sonst – auch an der Smashing Conference.

Highlights waren der als Mystery Speaker getarnte Handorgelspieler Klaus Schmidt

… die spontan aus Speakern zusammengewürfelte «Smashing Conference Lonely Hearts Club Band»

… oder das von WordPress grossartig eingehaltene Versprechen

Free Beer All Night Long

Alles in allem war die Smashing Conference bereichernd, bestätigend, trotz Ausnahmen grösstenteils kurzweilig & unterhaltsam, gespickt mit allerlei Würsten vom Markt & inspirierend.

… hoffentlich nächstes Jahr wieder

Weiterführende Links

Progressive Enhancement
That Emil – Progressive Enhancement: Still Not Dead.
Jake Archibald – Progressive enhancement is still important
BBC – Cutting the mustard

Decide in the Browser
Dan Mall – Responsive Design is Hard/Easy! Be Afraid/Don’t Worry!
Brad Frost – The Post-PSD Era … in response … Dan Mall – The Post-PSD Era: A problem of expectations

Prozess. Dialog. Qualität. – IA Konferenz 2013

Es ist jetzt schon ein paar Monate her, aber ich möchte trotzdem noch ein Wort – oder besser ein Bild zur IA Konferenz 2013 – verlieren.
Die Konferenz fand dieses Jahr unter dem Motto Prozess. Dialog. Qualität. statt. Könnte glatt eine Namics-Wortmarke sein. Das alles beherrschende Thema war die Agilität.

Das Bild, dass ich euch gerne zeigen will ist ein visuelles Protokoll der Konferenz, das Matthias Weitbrecht während der Vorträge erstellt hat.

Bild in höherer Auflösung

Fachtagung Interaktive Vielfalt – Mensch & Computer, Usability Professionals, DeLFI

Vom 08. bis zum 11.09. fand dieses Jahr in Bremen die von Namics gesponsorte Fachtagung Interaktive Vielfalt statt. Die Fachtagung vereint die drei Konferenzen Mensch & Computer, Usability Professionals und DeLFI unter einem Dach.

Bevor ich hier große Worte zu Inhalten, Location, etc. verliere lasse ich lieber Videos und ein paar Fotos sprechen.

Fotos gibt’s hier: http://interaktivevielfalt.org/fotos/

Ich muss leider sagen, dass die Themen der Vorträge, die ich mir angehört habe, nicht alle neu waren und ich leider nur teilweise Fachliches von der Konferenz mitnehmen konnte. Oder um es positiv auszudrücken: Wir bei Namics machen alles mindestens genauso gut wie alle anderen, wenn nicht sogar besser. ;-)

Den Tagungsband der Usability Professionals mit allen Workshops und Vorträgen kann jeder hier einsehen:
http://issuu.com/germanupa/docs/german-upa_tagungsband_up13_web

Die nächste Mensch & Computer findet vom 31.08. bis zum 03.09.2014 in München statt. Weitere Informationen hierzu unter http://muc2014.mensch-und-computer.de/

Mit dem 360° Dashboard zum Erfolg

Datenquellen für das 360° Performance Dashboard

Die Suisse Emex hat ein neues Format, das digitale Klassenzimmer. In diesem Rahmen durfte Namics unter dem Leitmotto „Das ABC des digitalen Marketings für Marketingentscheider“ das Thema 360° Performance Dashboard von Siemens Building Technologies (BT) vorstellen. Strategische Business Ziele online … Weiterlesen

Page 10 of 197« First...89101112...203040...Last »