CGNwebperf #28: Doug Sillars über Videooptimierung für Webseiten

Nach langer Pause ging es am Montagabend endlich wieder weiter mit der CGNwebperf Meetup-Reihe. Bei dem 28. Treffen war Doug Sillars zu Gast und berichtete in seinem Talk “Video killed my data plan: adding video to websites without breaking the bank”, über seine Erfahrungen, die er mit der Optimierung von Videos im Web gemacht hat.
Doug ist Freelance-Developer-Evangelist, Autor und Experte im Bereich Web Media Performance. Als Digitaler Nomade reist er mit seiner Familie durch Europa und ist stilgerecht auch direkt aus Kroatien eingeflogen.

Was kann man bei Videos im Web falsch machen?

Bei zu großen, nicht optimierten Videos fallen oft sehr große Datenmengen an. Doug illustrierte das in seinem Vortrag mit einem Vertrag für mobiles Internet, den er in Serbien abgeschlossen hatte. Bei den Konditionen des Vertrags – 5€ pro MB – würde so manches Video im Web schnell Kosten in Höhe von hunderten Euros erzeugen.

Ein wichtiger Faktor, für die Reduzierung der übertragenen Daten ist die Dateigröße der Videos zu minimieren. Allerdings gibt es in viele Fällen schon bei dem Aufbau der Seite viel Optimierungspotential. Hat man z.b. für Mobile und Desktop zwei Video Elemente auf der Seite die über CSS ein- und ausgeblendet werden, lädt der Browser trotzdem immer beide Videos.

Auch Videos die mittels Display None ausgeblendet sind, werden vom Browser automatisch vorgeladen. Besser ist es hier ein wenig JavaScript zu verwenden, um direkt das richtige Video einzubinden.

Genauso werden oft Videos in deutlich zu großer Auflösung und mit unnötig hoher Qualität verwendet. Wenn man auch nur auf ein wenig Qualität verzichten kann, können durch Komprimierung drastische Einsparungen in der Datenmenge gemacht werden.

Worauf sollte man achten?

Die Drei Hauptkriterien, an denen Video Performance gemessen werden kann, sind:

  • Die Zeit, die es braucht bis das Video startet
  • Ob das Video stockt, und wenn ja, wie oft
  • Die visuelle Qualität des Videos

Akamai hat in Studien zur Startzeit von Videos herausgefunden, dass nach zwei Sekunden bei jeder weiteren Sekunde 5,8% der Nutzer die Seite verlassen.

Welche Tools gibt es?

Doug hat mehrere Tools erstellt, um die Performance von Videos im Web zu messen. Mit dem Tool StremaOrNot lassen sich die ersten zwei Faktoren (Startzeit und Stocken) messen.

Zur Optimierung der Bitrate und Dateigröße des Videos können Cloud Tools wie Cloudinary verwendet werden. Mit Hilfe von FFMPEG könne auch eigene Automatisierungen entwickelt werden.

Um den Qualitätsverlust in Bezug zur Dateneinsparung bewerten und quantifizieren zu können, gibt es verschiedene Metriken. VMAF (Video Multimethod Assessment Fusion) ist eine von Netflix entwickelte, sehr ausgefeilte Metrik zur Bewertung der Videoqualität.

Das ebenfalls von Doug entwickelte Tool Streamclarity erlaubt es Videos auf diese und weiter Metriken zu analysieren.

Diskussion

Nach dem Talk wurde in kleiner Gruppen noch angeregt diskutiert. Unter Anderem über dem Groundhog Day und die CO-Belastung, die durch langsame Websites, die unnötig viele Daten übertragen, unter Umständen entsteht.

Zusammenfassend kann gesagt werden, dass Video-Delivery genau wie viele andere Probleme in unsere Branche eine unbegrenzte Tiefe hat und man sich Jahre lang nur mit diesem eine Thema beschäftigen kann. Wenn man aber nicht gerade Netflix oder YouTube ist und täglich Petabytes an Videodaten ausliefert, kann man auch schon mit ein paar einfachen Tricks viel erreichen.

Zum Weiterlesen:

Die Slides