SlideShare ist ein Scribd-Unternehmen logo
Web Performance Optimization

         Fabian Lange
5 Beispiele

WARUM WPO?
Yahoo

400 Millisekunden
9% Traffic
Microsoft Bing

1 Sekunde
56 Millionen USD   pro Jahr
Mozilla

2,2 Sekunden
60 Millionen Firefox
Shopzilla

4 Sekunden
5% Kunden
Amazon

100 Millisekunden
245 Millionen USD   pro Jahr
2 Sekunden

Unzufriedenheit
Mehr Erfolg durch

Web Performance Optimization
Erstens

Ladezeiten
Zweitens

Codeausführung
Drittens

Standardkompatibilität
Steve Souders sagt

„SEO - Search Engine Optimization
ist ein Thema von Gestern“
Google & Bing suchen

Seiten werden gefunden
Blogs beweisen

Gute Inhalte dominieren
Schamanen bedauern

SEO Voodoo funktioniert
nicht mehr
Aber

Es gibt viel Budget für SEO
Steve hat Recht

WPO – Web Performance Optimization
bewältigt aktuelle Herausforderungen
Ladezeiten
Mobile Datennetze

Fragile Netzinfrastruktur
Mobile Datennetze

Hohe Kosten
Verbindungen & Datentransfer

Unerwartete Begrenzungen
Kostenaufstellung

Wasserfall Charts
Sprites & JavaScript

Kombination
Bilder & JavaScript

Kompression
Datenübertragung vermeiden

Caching
Codeausführung
hängende Werbebanner

Unvollständige Seiten
viele Daten, suboptimaler Code

Unbenutzbarkeit
Servercode Probleme

Nichtverfügbarkeit
Nicht reagierender Zahlungsdienst

Vertrauensverlust
450

400

350

300                                               Safari 5
                                                  Firefox 4
250                                               Chrome 10
                                                  Opera 11
200                                               IE 9

150   Schneller, höher, weiter

100   Browserkrieg 2.0
50

 0
                            Sunspider Benchmark
Google Async Loader & Require.js

Nicht Blockieren
WebKit Inspector

JavaScript Profiling
Firebug

JavaScript Profiling
IE 9

JavaScript Profiling
Dynatrace Ajax

Browser Profiling
AppDynamics

Anwendungsmonitoring
JProfiler

Java Profiling
Xdebug & WinCacheGrind

PHP Profiling
ruby-prof

Ruby Profiling
Standardkompatibilität
Interoperabilität

Browserkrieg 1.0
Interoperabilität

Browserkrieg 3.0
PC & Mobile

HTML 5
Kompatibilität dank

JavaScript Frameworks
Supercache

Ressourcen Teilen
Yahoo 35, Google 29

Best Practices
One Stop Shop

Best Practices
Zukunftsmusik?

Automatische Optimierung
Fazit

Messen & Handeln
Kätzchen           http://www.flickr.com/photos/crsan/4804813050
Netzwerkswitch     http://www.flickr.com/photos/br1dotcom/4296987925
JavaScript Code    http://www.flickr.com/photos/dmitry-baranovskiy/2378867408
Html5 Sticker      http://www.w3.org/html/logo
Heuballen          http://www.flickr.com/photos/janeladeimagens/166051502
Weinfässer         http://www.flickr.com/photos/jimnix/4623989305
Voodoo             http://www.flickr.com/photos/adamcohn/2827720891
Antennen           http://www.flickr.com/photos/thristian/295133206
Telefonrechnung    http://www.flickr.com/photos/wili/2254907478
Straßenarbeiten    http://www.flickr.com/photos/dougtone/4153798733
Ordner Icon        http://www.iconarchive.com/artist/deleket.html
Desk               http://www.flickr.com/photos/akeg/4652982150
Apple vs Android   http://aoisora9x.deviantart.com/gallery/#/d2rpdbp




  Bildnachweis
Firebug                          http://getfirebug.com
Smart Sprites Generator          http://csssprites.org
Yahoo UI Compressor              http://developer.yahoo.com/yui/compressor
Smush.it                         http://www.smushit.com
RFC 2616 - HTTP Spec (Caching)   http://www.w3.org/Protocols/rfc2616/rfc2616-sec13.html
Require.js                       http://requirejs.org
Google Ajax Libs                 http://code.google.com/intl/de-DE/apis/libraries
AppDynamics                      http://appdynamics.com/free
JProfiler                        http://www.jprofiler.com
Xdebug                           http://www.xdebug.org
WinCacheGrind                    http://sourceforge.net/projects/wincachegrind
ruby-prof                        http://ruby-prof.rubyforge.org
YSlow                            http://developer.yahoo.com/yslow
Show Slow                        http://www.showslow.com
Mod_pagespeed                    http://code.google.com/p/modpagespeed




  Referenzen

                                                                @CodingFabian
                                                                Fabian.Lange@codecentric.de
Web Performance Optimization - JAX 2011 Talk

Weitere ähnliche Inhalte

PDF
Web Performance Optimization - Web Tech Conference 2011 Talk
PDF
Webentwicklung für das IPhone
PDF
Technische SEO Probleme finden mit Tools
PPTX
Blackhat Protection: Negative SEO verstehen & verhindern - SEOkomm 2012
PDF
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
PDF
Oh, no! DSGVO.
PDF
Optimierungspotenziale in der internen Verlinkung 2016 (Justus Blümer)
PDF
FahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das Web
Web Performance Optimization - Web Tech Conference 2011 Talk
Webentwicklung für das IPhone
Technische SEO Probleme finden mit Tools
Blackhat Protection: Negative SEO verstehen & verhindern - SEOkomm 2012
Schema.org 101: 
Warum die neuen Meta Daten wichtig sind - Mini FAQ & Impleme...
Oh, no! DSGVO.
Optimierungspotenziale in der internen Verlinkung 2016 (Justus Blümer)
FahrvergnÜgen ohne Handbremse! IE ist Tot - lang lebe das Web

Was ist angesagt? (19)

PDF
Barcamp Südtirol 2014 - Robert Leiter - Zurück in die Zukunft
PDF
WordPress kaputt machen
PDF
Rails i18n - Railskonferenz 2007
PDF
Echte Lösungen, keine Tricks
ODP
Einführung in die webOS Programmierung
PPTX
Optimieren großer Websites mit Screaming Frog & Excel - Campixx 2014
ZIP
HTML5-Legacy-Anwendungen
PDF
Das Web zum Mitmachen: Barrieren in der Praxis
PDF
Flash, Ajax & Barrierefreiheit
PDF
Sencha Touch & PhoneGap
PDF
Wordpress - Einführung und Überblick über die Kernfunktionen
PDF
Linkrisiko Management - SEOkomm 2013
PDF
Browserbasiertes computing, RIA
PPTX
Top 10 Internet-Trends
PDF
Frontend Best Practices
PPT
Gratis Wordpress Webinar - Web-Blogsystem Einführung mit Eduvision Ausbildungen
PDF
Sencha Touch und PhoneGap
PDF
Online / Offline
PDF
Wordpress für Profis
Barcamp Südtirol 2014 - Robert Leiter - Zurück in die Zukunft
WordPress kaputt machen
Rails i18n - Railskonferenz 2007
Echte Lösungen, keine Tricks
Einführung in die webOS Programmierung
Optimieren großer Websites mit Screaming Frog & Excel - Campixx 2014
HTML5-Legacy-Anwendungen
Das Web zum Mitmachen: Barrieren in der Praxis
Flash, Ajax & Barrierefreiheit
Sencha Touch & PhoneGap
Wordpress - Einführung und Überblick über die Kernfunktionen
Linkrisiko Management - SEOkomm 2013
Browserbasiertes computing, RIA
Top 10 Internet-Trends
Frontend Best Practices
Gratis Wordpress Webinar - Web-Blogsystem Einführung mit Eduvision Ausbildungen
Sencha Touch und PhoneGap
Online / Offline
Wordpress für Profis
Anzeige

Andere mochten auch (20)

PPTX
Kunde ist nicht gleich Kunde. Kunden Profiling und Kundenanalyse.
PDF
Vertrieb: Weniger Angebote, mehr Aufträge - Isabelle von Künßberg
PDF
Top 10 AppDynamics Best Practices - AppSphere16
PDF
Accelerating Your Mastery of APM Through Skills Self-Analysis - AppSphere16
PDF
Thousands of JVMs, Hundreds of Applications, and Two People: How Cerner Learn...
PPTX
Dn12 u3 a19_maah tema libre
PPT
m20 Estudios
PPT
Projecte final
PDF
Leben durch Podcasting - Die Metaebene
PPT
Website Optimierungen
PPTX
Símbols pneumàtics
PDF
Artículo Científico Compresor A/C
PPT
Les productores
PPTX
U4 enchúfate indicaciones5to
ODP
Projecte Final Competic 2
PDF
Ecommerce für Verlage
PPT
Pneumatica i hidraulica 2014.ppt
PPSX
Tema 12 _Accionaments Pneumàtics (1r batx)
PDF
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
DOC
Questionari hidraulica i neumatica
Kunde ist nicht gleich Kunde. Kunden Profiling und Kundenanalyse.
Vertrieb: Weniger Angebote, mehr Aufträge - Isabelle von Künßberg
Top 10 AppDynamics Best Practices - AppSphere16
Accelerating Your Mastery of APM Through Skills Self-Analysis - AppSphere16
Thousands of JVMs, Hundreds of Applications, and Two People: How Cerner Learn...
Dn12 u3 a19_maah tema libre
m20 Estudios
Projecte final
Leben durch Podcasting - Die Metaebene
Website Optimierungen
Símbols pneumàtics
Artículo Científico Compresor A/C
Les productores
U4 enchúfate indicaciones5to
Projecte Final Competic 2
Ecommerce für Verlage
Pneumatica i hidraulica 2014.ppt
Tema 12 _Accionaments Pneumàtics (1r batx)
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
Questionari hidraulica i neumatica
Anzeige

Ähnlich wie Web Performance Optimization - JAX 2011 Talk (20)

PDF
SDC2011: Web Performance Optimization
PDF
Frontend Performance @ Hochschule der Medien Stuttgart
PDF
Client-side Performance Optimizations
PDF
Site Speed EXTREME - SEOkomm 2014
PPT
Frontend-Performance @ IPC
PPT
Frontend-Performance mit PHP
PDF
Mehr Pagespeed geht nicht - SEOkomm 2015
PDF
Site Speed am Limit - Campixx 2015
PPTX
Web Performance Optimierung (WPO)
PDF
Campixx 2012-ladezeit-extreme
PPTX
HTML5-Performance: So rennt Ihre App und nicht Ihre Anwender (weg)
PDF
Crawl-Budget-Booster für eine bessere Search Engine Experience
PPTX
SEO für Magento Commerce - SEOkomm 2011
PDF
Performance-Optimierung für WordPress-Websites
PDF
Performance durch Caching
 
PDF
Performance durch Caching
 
PPTX
Geschwindigkeitsengpässe von Websites identifizieren - SMX München 2012
PDF
Cache me if you can
PDF
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
PPTX
Front End Performance Optimierung
SDC2011: Web Performance Optimization
Frontend Performance @ Hochschule der Medien Stuttgart
Client-side Performance Optimizations
Site Speed EXTREME - SEOkomm 2014
Frontend-Performance @ IPC
Frontend-Performance mit PHP
Mehr Pagespeed geht nicht - SEOkomm 2015
Site Speed am Limit - Campixx 2015
Web Performance Optimierung (WPO)
Campixx 2012-ladezeit-extreme
HTML5-Performance: So rennt Ihre App und nicht Ihre Anwender (weg)
Crawl-Budget-Booster für eine bessere Search Engine Experience
SEO für Magento Commerce - SEOkomm 2011
Performance-Optimierung für WordPress-Websites
Performance durch Caching
 
Performance durch Caching
 
Geschwindigkeitsengpässe von Websites identifizieren - SMX München 2012
Cache me if you can
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Front End Performance Optimierung

Mehr von Fabian Lange (10)

PDF
SPDY - http reloaded - WebTechConference 2012
PDF
The SPDY Protocol
PDF
Aspects of modern APM solutions
PDF
Performance - a challenging craft
PPTX
Agile Development of High Performance Applications
PPTX
Rich Ajax Platform - Programming for Web and Rich Client
PDF
Eclipse Rich Ajax Platform
PDF
Ant Maven
PDF
Codecentric At Ajax World Conference San Jose
PDF
Full Stack Web Application Performance Tuning
SPDY - http reloaded - WebTechConference 2012
The SPDY Protocol
Aspects of modern APM solutions
Performance - a challenging craft
Agile Development of High Performance Applications
Rich Ajax Platform - Programming for Web and Rich Client
Eclipse Rich Ajax Platform
Ant Maven
Codecentric At Ajax World Conference San Jose
Full Stack Web Application Performance Tuning

Web Performance Optimization - JAX 2011 Talk