Recap Velocity Conference Amsterdam 2016

Datum: 11. November 2016
Autor*in: Robert Klauser


Keynote: Work as imagined and work as done: Mind the gap

Keynote: Work as imagined and work as done: Mind the gap

Nach drei spannenden Tagen von 7. bis 9. November 2016 in Amsterdam bin ich mit vielen neuen und interessanten Eindrücken von der Konferenz zurückgekehrt, die ich gerne mit Euch teilen möchte.

Bei der Velocity Conference ging es um die Themen Web Performance in allen Facetten sowie DevOps als Prozess für den agilen und performanten Betrieb von modernen Webanwendungen.

Vormittags standen dabei am Montag und Dienstag jeweils Keynotes auf dem Programm, nachmittags dann verschiedene parallele Sessions zur Vertiefung. Am Mittwoch gab es dann noch jeweils halbtägige Tutorials, von denen ich „Progressive web apps for a faster experience“ sowie „Measuring real-user performance in the browser“ besucht habe.

img_0945

Ich möchte nun nicht die Inhalte aller einzelnen Sessions runterbeten, sondern Euch in ein paar Thesen einen zusammenfassenden Überblick darüber geben, was ich für unsere Arbeit mitnehmen konnte:

  • (Clientseitige) Frontend-Entwicklung ist DER wesentliche Aspekt, wenn es um moderne und performante Webanwendungen geht; die Frontend-Performance ist der alles entscheidende Faktor. Hier müssen wir sicher noch deutlich zulegen, wenn es um ein vertieftes Verständnis von HTML 5, CSS 3 und JavaScript geht. Dieses Thema müssen wir auf unsere Agenda nehmen.
  • Tiefes JavaScript-Verständnis ist elementar, wenn man die Möglichkeiten moderner Browser nutzen möchte.
  • Es geht eigentlich nur noch um die Nutzung auf mobilen Geräten – der Desktop tritt immer mehr in den Hintergrund. Das muss auch massive Auswirkungen darauf haben, wie wir zukünftig Websites entwickeln und testen. Als nicht erstmal am Desktop bauen und schauen, ob es mobil geht, sondern genau anders herum. Deshalb gewinnt das Thema Performance einen so großen Stellenwert.
  • Wenn es um ein intelligentes Ladeverhalten von Websites geht, empfehle ich allen, mal einen Blick auf die HTML-Attribute dns-prefetch, prefetch, preconnect, preload und prerender zu werfen.
  • HTTP/2 muss uns sehr zeitnah beschäftigen. Aktuell werden weltweit bereits 31% aller HTTP-Requests als HTTP/2 ausgeliefert.
  • SSL-Verschlüsselung ist Pflicht. Ab sofort sollten wir neue Portale und Anwendungen immer und standardmäßig über https://. Die Nutzung vieler neuer (Browser-)API-Funktionen setzt eine SSL-Verschlüsselung voraus.
  • Ich empfehle, bei jedem unserer Portale mal im Chrome die DevTools bzw. die Konsole aufzumachen – da warten jede Menge Überraschungen 😉 Im Übrigen sollte das auch standardmäßig nach jedem Deployment erneut gemacht werden.
  • Safari ist der neue Internet Explorer. Bei der Nutzung moderner (Browser-)API-Funktionen ist der Safari aktuell der Flaschenhals – also das, was in der guten alten Zeit mal der Internet Explorer war. Chrome, Firefox, Opera und IE/Edge (in dieser Reihenfolge) unterstützen neue Funktionalitäten (wie z.B. Preloading/Prefetching oder Push) schon recht gut.
  • Progressive Web Apps (PWA) sind ein Thema, das wir uns ebenfalls ansehen sollten. Es gibt einen klaren Trend weg von nativen Apps zu Web Apps. Auch wenn PWA’s aktuell in erster Linie von Google (Chrome) vorangetrieben werden, stellt jeder Schritt in Richtung PWA einen guten Schritt in Richtung einer exzellenten mobilen User Experience dar. Die Unterstützung seitens Apple und Safari ist aktuell noch sehr rudimentär – aber das ist nur eine Frage der Zeit, bis sie zu einer Unterstützung „gezwungen“ werden.
  • Gute Performance ist in weiten Teilen auch Psychologie bzw. „gefühlte“ Performance. Zitat von Denys Mishunov: „Performance is not Mathematics, Performance is Perception.“ Gute Entwickler sind damit „Performance-Broker“. Man kann mit vielen Kniffen eine gute gefühlte Performance sicherstellen, auch wenn sich physikalisch nicht viel ändert:
      • Preemptive Start durch prefetch, preconnect, prerender und preload as=type
      • Optimistic UI
      • Dem Nutzer aktive Phasen suggerieren, auch wenn er eigentlich warten muss.

    Das Weber-Fechner-Gesetz besagt, dass der Nutzer nur eine Verbesserung bzw. Verschlechterung von mindestens 20% wahrnimmt, alles was darunter liegt, kann man sich sparen.

  • AMP ist im mobilen Kontext immer mehr ein Thema; allerdings müssen dabei recht umfangreiche Anpassungen gemacht werden, da z.B. das Gewicht der CSS-Files auf 50 KB limitiert ist. Dafür bekommt man aber auch kostenlos ein weltweites CDN von Google.
  • Es geht weg von monolithischen Strukturen hin zu leichtgewichtigen (Micro-)Services. Auch das ein Ansatz, der uns in der neuen Platform 3.0 begleiten sollte.
  • Einige Vorträge beschäftigten sich auch mit Teams und Vorgehensmodellen; dabei kam durchwegs zum Ausdruck, dass keiner der Speaker im eigenen Unternehmen irgendein Vorgehensmodell „in Reinkultur“ umsetzt. Alle haben sich z.B. Scrum so angepasst, wie es zu ihrem Unternehmen, zu ihren Use Cases und zu ihrer Kultur passt. Also ein ganz ähnlicher Ansatz, wie wir es machen.
  • DevOps: ein Thema das vor allem in großen Unternehmen mit alten verkrusteten IT-Abteilungen ein großes Thema ist – wir machen das – im Großen und Ganzen – bereits seit 15 Jahren. Wir wussten nur nicht, dass es so heißt 😉

img_0955

img_0949

Nachfolgend noch eine kleine Linksammlung, für alle, die mehr wissen wollen:


Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Technologie


iOS Probleme mit transition

Autor*in: Florian Müller


Technologie // User Experience & Design


Heute ist mir bei einem Projekt ein Problem mit iOS begegnet. Es gibt eine Galerie, bei welcher die Elemente von oben „hereinfliegen“. Auf dem iPad und dem iPhone war dieser Effekt kaum beziehungsweise gar nicht vorhanden, sondern das Bild war einfach *plopp* da. Problem hierbei ist, dass transitions bei iOS ohne Hardware Beschleunigung gerendert werden. …


Beitrag lesen
28
SEP
16

http://webplatformdaily.org/

Autor*in: Bastian Schwarz


Technologie // Über den Tellerrand // User Experience & Design


Ich habe eine neue Seite (http://webplatformdaily.org/) entdeckt, die täglich Links zu folgenden Themen aus Twitter sammelt: Open Web Platform (including the open standards that comprise it) JavaScript (the core language and libraries written in it) web-browsers (including their development tools) front-end web-development in general open source to some degree (e.g. GitHub related content) Das Projekt …


Beitrag lesen
09
APR
13

Webbrowser

Autor*in: Sascha Nützel


Technologie // User Experience & Design


Bei meinen Streifzügen durch das „Neuland“ bin ich auf einen neuen Browser gestoßen: Blisk – dieser basiert auf Chromium und hält für uns Entwickler/Designer ein paar nette Features bereit (teils in näherer Zukunft). gleichzeitig Desktop / Mobile überprüfen Auto- Refresh nach Source- Change Analytics (JS Fehler, Pagespeed, Browser Kompatibilität) Screenshots Der erste Eindruck, auch ohne Beta- Features, …


Beitrag lesen
26
SEP
16

Netbeans und GIT

Autor*in: Florian Müller


Technologie


Ich habe mich mal während der Arbeit mit Git mit den Git Hooks beschäftigt. Ziel war es, unnötige Builds in der Pipeline zu vermeiden, welche aufgrund von Lintern fehlschlagen. Dazu wollte ich einen Pre-Commit Hook einsetzen. Ein simpler Hook, welcher vor einem Commit ausgeführt werden sollte: Wenn man über die Command line commiten will, wird diese auch …


Beitrag lesen
21
APR
17