Blog

Alle Beiträge mit dem Tag Frontend

Logo Webpack

Webpack und AngularJS

Trotz des Hypes um TypeScript und auch Angular 2 gibt es noch viele AngularJS 1.x-Anwendungen. Oft wurden letztere noch mit ng-min oder anderen Werkzeugen in einem Build-Prozess mit Grunt oder Gulp paketiert. Angular 2, die neue Major-Version des Frameworks, setzt jedoch standardmäßig auf Webpack. Daher bietet es sich an, bei einer Migration von AngularJS 1.x in Richtung Angular 2 zunächst auf Webpack umzustellen.

weiterlesen

Screenshot http://www.elitepartner.de/mobile

Perfect Google PageSpeed Insights Score – der mobilen Website von ElitePartner Beine machen

Im Moment arbeite ich bei meinem Kunden ElitePartner an seiner neuer mobilen Website. Deren erste Version berücksichtigte bereits die meisten Punkte, die eine performanceoptimierte Site aufweisen sollte.
Dies sind im Allgemeinen:

  • Landing-Page-Redirects werden vermieden
  • GZIP-Kompression ist aktiviert
  • Cache-Header für statische Inhalte sind gesetzt, Ressourcen sind gefingerprinted / revisioniert
  • CSS ist minifiziert
  • HTML ist minifiziert
  • JS ist minifiziert
  • sichtbarer Content (above-the-fold content) wird geladen, bevor Content, der sich nicht im sichtbaren Bereich befindet (below-the-fold content), geladen wird.
  • TTFB – der Server antwortet sehr schnell (rein statischer Content, Dynamik wird über SPA/REST realisiert)
    weiterlesen

Ankündigung: Zehntes Hamburg Web Performance Meetup

Nachdem unser Geburtstags-Meetup vor einem Monat im Attraktor e.V. (einem Makerspace in der City-Nord) stattfand (danke an Arbo und Raj für ihre Vorträge), treffen wir uns diesmal wieder bei einem Unternehmen, das für Speis‘ und Trank sorgen wird.

Am Donnerstag, den 25. April 2013, treffen wir uns bei Cassini Consulting Nord GmbH
(Johannisbollwerk 16, Hamburg). Wie immer geht es um 19:00 Uhr los.

Nachdem Frank und ich im Dezember etwas über unsere RUM-Messungen bei Telefonica erzählt haben, schließen nun Johannes, Heiko und Michael direkt an diesen Vortrag an und erzählen, wie sie diese Messungen aufarbeiten und visualisieren.

Johannes Lübkert, Heiko Lentz und Michael Heinecke – Visualisierung von Performance

  • Telefonicas WebPerformace Team (Kurze Vorstellung von Personen, Aufgaben und Organisatorischem – wie wir aufgestellt sind)
  • Technik im Front- und Backend (Perf-Portal, Graphite, Backend)
  • Data-Visualisierung von WPT und RUM samples (wie wir’s machen, lessons learned)

Uns fehlt noch ein zweiter Vortrag. Entweder wir machen einen Open Space oder ich werde etwas über Yeoman, Grunt und Bower erzählen (auf der Shell, nicht im Powerpoint), mit denen ich gerade herumspiele.

Anmelden kann man sich über unsere Meetup-Gruppe oder über XING.

Ankündigung: Neuntes Hamburg Web Performance Meetup

Das erste Web Performance Meetup in Hamburg Logo des Web Performance Metup Hamburgfand am 8. Februar 2012 statt. Das heißt, unsere Gruppe ist nun bereits ein Jahr alt.

Das Geburtstags-Meetup findet am 20.03.2013 im Attraktor e.V. (Mexikoring 21, Hamburg City-Nord) statt. Wie immer geht es um 19:00 Uhr los.

Diesmal gibt es wieder zwei Vorträge. „PhantomJS“ von Raj Dudi und „SoundCloud“ von Arbo von Monkiewitsch.

Arbo von Monkiewitsch – SoundCloud

SoundCloud liefert ein HTML5 Audio Playback Widget aus, das in Millionen von Webseiten eingebettet ist. In diesem Vortrag wird gezeigt, wie SoundCloud seine Teams organisiert, um die Zusammenarbeit zwischen Operations und Web-Entwicklern zu optimieren. Ziele dieser Optimierung sind die Steigerung der Verfügbarkeit, der Performance und der User Experience.

Natürlich müssen solche Optimierungen gemessen werden. Zu diesem Zweck werden zunächst die Ziele der Messung identifiziert. Die Metriken des populären YouTube-Widgets wurden in  Bezug zum SoundCloud-Widget gesetzt, um tiefe Einsichten sowohl aus dem synthetischen Monitoring als auch aus dem Real User Monitoring zu erlangen. Durch den Bezug zu einem anderen Media Delivery Widget konnten das eigene Widget und dessen Messung kontinuierlich verbessert werden.

Welche Techniken dabei verwendet wurden und was SoundCloud dabei gelernt hat, soll dieser Vortrag vermitteln.

Raj Dudi – PhantomJS

PhantomJS ist ein WebKit ohne UI, das durch JS ferngesteuert wird. Es kann in Kommandozeilen-basierten Tools verwendet werden, die einen Web-Stack benötigen. So bietet es die Basis für das Testen von Rich Web Applications, ohne dass dafür ein „echter“ Web-Browser benötigt wird. Da PhantonJS WebKit im headless mode verwendet wird, bietet es Zugriff auf eine echt-native und schnelle Browser-Implementierung und nicht auf eine Browser-Simulation. Web-Standards wie DOM, CSS-Selektoren, Canvas, SVG und viele weitere stehen so zur Verfügung. Dies macht PhantomJS zu einer optimalen Lösung für das automatisierte Testen von Websites und für das Netzwerkmonitoring.

Beide Vorträge werden voraussichtlich in englischer Sprache gehalten werden. Anmelden kann man sich über unsere Meetup-Gruppe oder über XING.

Ankündigung Zweites Hamburg Web Performance Meetup

Logo der Hamburg Web Performance Group

Nach einem erfolgreichen ersten Treffen wollen wir weiter versuchen, das Thema Web Performance in Hamburg zu verankern.


Darum planen wir ein zweites Treffen der Hamburg Web Performance Group, das in unseren Räumlichkeiten (Holisticon AG, Friedensallee 120, 22763 Hamburg) am Mittwoch, den 21. März 2012 um 19:00 Uhr stattfinden wird.

    Geplant sind zwei Talks:

Das Event ist leider sowohl bei Meetup.com als auch in der XING-Gruppe bereits ausgebucht.