Enviar búsqueda
Cargar
Web Performance Optimierung - DWX13
•
0 recomendaciones
•
7,947 vistas
Walter Ebert
Seguir
Session für die Developer Week 2013 in Nürnberg
Leer menos
Leer más
Tecnología
Arte y fotografía
Vista de diapositivas
Denunciar
Compartir
Vista de diapositivas
Denunciar
Compartir
1 de 71
Descargar ahora
Descargar para leer sin conexión
Recomendados
High Performance HTML5 (SF HTML5 UG)
High Performance HTML5 (SF HTML5 UG)
Steve Souders
High Performance Mobile (SF/SV Web Perf)
High Performance Mobile (SF/SV Web Perf)
Steve Souders
Design+Performance
Design+Performance
Steve Souders
Prebrowsing - Velocity NY 2013
Prebrowsing - Velocity NY 2013
Steve Souders
@media - Even Faster Web Sites
@media - Even Faster Web Sites
Steve Souders
Web 2.0 Expo: Even Faster Web Sites
Web 2.0 Expo: Even Faster Web Sites
Steve Souders
do u webview?
do u webview?
Steve Souders
HTML5@电子商务.com
HTML5@电子商务.com
kaven yan
Recomendados
High Performance HTML5 (SF HTML5 UG)
High Performance HTML5 (SF HTML5 UG)
Steve Souders
High Performance Mobile (SF/SV Web Perf)
High Performance Mobile (SF/SV Web Perf)
Steve Souders
Design+Performance
Design+Performance
Steve Souders
Prebrowsing - Velocity NY 2013
Prebrowsing - Velocity NY 2013
Steve Souders
@media - Even Faster Web Sites
@media - Even Faster Web Sites
Steve Souders
Web 2.0 Expo: Even Faster Web Sites
Web 2.0 Expo: Even Faster Web Sites
Steve Souders
do u webview?
do u webview?
Steve Souders
HTML5@电子商务.com
HTML5@电子商务.com
kaven yan
Website performance optimisation
Website performance optimisation
Webstock
How fast are we going now?
How fast are we going now?
Steve Souders
Joomla! Plugin Development
Joomla! Plugin Development
Yireo
Speak The Web: The HTML5 Experiments
Speak The Web: The HTML5 Experiments
guestd427df
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
Andy Davies
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
Andy Davies
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
Andy Davies
5 single page application principles developers need to know
5 single page application principles developers need to know
Chris Love
Mobile Web Speed Bumps
Mobile Web Speed Bumps
Nicholas Zakas
10 things to make you a Great Mobile Web Developer
10 things to make you a Great Mobile Web Developer
Chris Love
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
Fwdays
Sniffing the Mobile Context
Sniffing the Mobile Context
Andy Davies
Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...
MilanAryal
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
Dave Olsen
Single Page Application Best practices
Single Page Application Best practices
Tarence DSouza
Building an Appier Web - May 2016
Building an Appier Web - May 2016
Andy Davies
The Case for HTTP/2 - GreeceJS - June 2016
The Case for HTTP/2 - GreeceJS - June 2016
Andy Davies
Web systems architecture, Performance and More
Web systems architecture, Performance and More
Moshe Kaplan
That's crazy! how to build single page web apps
That's crazy! how to build single page web apps
Chris Love
Making Mobile Sites Faster
Making Mobile Sites Faster
Andy Davies
Bilder einbinden ist kein Thema, oder?
Bilder einbinden ist kein Thema, oder?
Walter Ebert
Sinn und Unsinn von SSL
Sinn und Unsinn von SSL
Walter Ebert
Más contenido relacionado
La actualidad más candente
Website performance optimisation
Website performance optimisation
Webstock
How fast are we going now?
How fast are we going now?
Steve Souders
Joomla! Plugin Development
Joomla! Plugin Development
Yireo
Speak The Web: The HTML5 Experiments
Speak The Web: The HTML5 Experiments
guestd427df
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
Andy Davies
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
Andy Davies
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
Andy Davies
5 single page application principles developers need to know
5 single page application principles developers need to know
Chris Love
Mobile Web Speed Bumps
Mobile Web Speed Bumps
Nicholas Zakas
10 things to make you a Great Mobile Web Developer
10 things to make you a Great Mobile Web Developer
Chris Love
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
Fwdays
Sniffing the Mobile Context
Sniffing the Mobile Context
Andy Davies
Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...
MilanAryal
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
Dave Olsen
Single Page Application Best practices
Single Page Application Best practices
Tarence DSouza
Building an Appier Web - May 2016
Building an Appier Web - May 2016
Andy Davies
The Case for HTTP/2 - GreeceJS - June 2016
The Case for HTTP/2 - GreeceJS - June 2016
Andy Davies
Web systems architecture, Performance and More
Web systems architecture, Performance and More
Moshe Kaplan
That's crazy! how to build single page web apps
That's crazy! how to build single page web apps
Chris Love
Making Mobile Sites Faster
Making Mobile Sites Faster
Andy Davies
La actualidad más candente
(20)
Website performance optimisation
Website performance optimisation
How fast are we going now?
How fast are we going now?
Joomla! Plugin Development
Joomla! Plugin Development
Speak The Web: The HTML5 Experiments
Speak The Web: The HTML5 Experiments
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
The Case for HTTP/2 - Internetdagarna 2015 - Stockholm
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
5 single page application principles developers need to know
5 single page application principles developers need to know
Mobile Web Speed Bumps
Mobile Web Speed Bumps
10 things to make you a Great Mobile Web Developer
10 things to make you a Great Mobile Web Developer
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
Sniffing the Mobile Context
Sniffing the Mobile Context
Preconnect, prefetch, prerender...
Preconnect, prefetch, prerender...
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
Single Page Application Best practices
Single Page Application Best practices
Building an Appier Web - May 2016
Building an Appier Web - May 2016
The Case for HTTP/2 - GreeceJS - June 2016
The Case for HTTP/2 - GreeceJS - June 2016
Web systems architecture, Performance and More
Web systems architecture, Performance and More
That's crazy! how to build single page web apps
That's crazy! how to build single page web apps
Making Mobile Sites Faster
Making Mobile Sites Faster
Destacado
Bilder einbinden ist kein Thema, oder?
Bilder einbinden ist kein Thema, oder?
Walter Ebert
Sinn und Unsinn von SSL
Sinn und Unsinn von SSL
Walter Ebert
Responsive Design: Mehr als CSS
Responsive Design: Mehr als CSS
Walter Ebert
(Responsive) Video
(Responsive) Video
Walter Ebert
Web-Performance
Web-Performance
Walter Ebert
Die .htaccess richtig nutzen
Die .htaccess richtig nutzen
Walter Ebert
Above the fold content
Above the fold content
Walter Ebert
Responsive Videos, mehr oder weniger
Responsive Videos, mehr oder weniger
Walter Ebert
Content Security Policy - PHPUGFFM
Content Security Policy - PHPUGFFM
Walter Ebert
HTTPS + Let's Encrypt
HTTPS + Let's Encrypt
Walter Ebert
High Performance Images
High Performance Images
Walter Ebert
WordPress-Themes mit Twig entwickeln
WordPress-Themes mit Twig entwickeln
Walter Ebert
Bilder usw...
Bilder usw...
Walter Ebert
WordPress Multisite
WordPress Multisite
Walter Ebert
Mehr Performance für WordPress - WordCamp Köln
Mehr Performance für WordPress - WordCamp Köln
Walter Ebert
Mehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFra
Walter Ebert
WordPress-Templates mit Twig erstellen - PHPUGFFM
WordPress-Templates mit Twig erstellen - PHPUGFFM
Walter Ebert
WordPress mit Composer und Git verwalten
WordPress mit Composer und Git verwalten
Walter Ebert
Weniger aus Bilder holen
Weniger aus Bilder holen
Walter Ebert
Destacado
(19)
Bilder einbinden ist kein Thema, oder?
Bilder einbinden ist kein Thema, oder?
Sinn und Unsinn von SSL
Sinn und Unsinn von SSL
Responsive Design: Mehr als CSS
Responsive Design: Mehr als CSS
(Responsive) Video
(Responsive) Video
Web-Performance
Web-Performance
Die .htaccess richtig nutzen
Die .htaccess richtig nutzen
Above the fold content
Above the fold content
Responsive Videos, mehr oder weniger
Responsive Videos, mehr oder weniger
Content Security Policy - PHPUGFFM
Content Security Policy - PHPUGFFM
HTTPS + Let's Encrypt
HTTPS + Let's Encrypt
High Performance Images
High Performance Images
WordPress-Themes mit Twig entwickeln
WordPress-Themes mit Twig entwickeln
Bilder usw...
Bilder usw...
WordPress Multisite
WordPress Multisite
Mehr Performance für WordPress - WordCamp Köln
Mehr Performance für WordPress - WordCamp Köln
Mehr Performance für WordPress - WPFra
Mehr Performance für WordPress - WPFra
WordPress-Templates mit Twig erstellen - PHPUGFFM
WordPress-Templates mit Twig erstellen - PHPUGFFM
WordPress mit Composer und Git verwalten
WordPress mit Composer und Git verwalten
Weniger aus Bilder holen
Weniger aus Bilder holen
Similar a Web Performance Optimierung - DWX13
4-identifying-problems.pdf
4-identifying-problems.pdf
Brian Rahmawan Purwoto
Faster Frontends
Faster Frontends
Andy Davies
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
Distilled
Modelling Web Performance Optimization - FFSUx
Modelling Web Performance Optimization - FFSUx
Haribabu Nandyal Padmanaban
Developing web applications in 2010
Developing web applications in 2010
Ignacio Coloma
High Performance Websites
High Performance Websites
Parham
Speed Up Wordpress, Wordpress Horsepower
Speed Up Wordpress, Wordpress Horsepower
Ross Johnson
Taking your Web App for a walk
Taking your Web App for a walk
Jens-Christian Fischer
Open-source website performance tools
Open-source website performance tools
Artur Cistov
Web Performance Optimization
Web Performance Optimization
Patrick Meenan
Csdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer Yahoo
guestb1b95b
Hardcode SEO
Hardcode SEO
Michel Ozzello
Fisl 11 - Dicas de Desenvolvimento Web com Ruby
Fisl 11 - Dicas de Desenvolvimento Web com Ruby
Fabio Akita
Now you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and Development
Jonas Päckos
Consegi 2010 - Dicas de Desenvolvimento Web com Ruby
Consegi 2010 - Dicas de Desenvolvimento Web com Ruby
Fabio Akita
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
Patrick Meenan
Widget Summit 2008
Widget Summit 2008
Volkan Unsal
Building Faster Websites
Building Faster Websites
Matthew Farina
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
Gustaf Nilsson Kotte
Webworks
Webworks
Kang Ibnux
Similar a Web Performance Optimierung - DWX13
(20)
4-identifying-problems.pdf
4-identifying-problems.pdf
Faster Frontends
Faster Frontends
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
Modelling Web Performance Optimization - FFSUx
Modelling Web Performance Optimization - FFSUx
Developing web applications in 2010
Developing web applications in 2010
High Performance Websites
High Performance Websites
Speed Up Wordpress, Wordpress Horsepower
Speed Up Wordpress, Wordpress Horsepower
Taking your Web App for a walk
Taking your Web App for a walk
Open-source website performance tools
Open-source website performance tools
Web Performance Optimization
Web Performance Optimization
Csdn Drdobbs Tenni Theurer Yahoo
Csdn Drdobbs Tenni Theurer Yahoo
Hardcode SEO
Hardcode SEO
Fisl 11 - Dicas de Desenvolvimento Web com Ruby
Fisl 11 - Dicas de Desenvolvimento Web com Ruby
Now you see me... Adaptive Web Design and Development
Now you see me... Adaptive Web Design and Development
Consegi 2010 - Dicas de Desenvolvimento Web com Ruby
Consegi 2010 - Dicas de Desenvolvimento Web com Ruby
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
Google I/O 2012 - Protecting your user experience while integrating 3rd party...
Widget Summit 2008
Widget Summit 2008
Building Faster Websites
Building Faster Websites
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
Surviving the Zombie Apocalypse of Connected devices - Jfokus 2013
Webworks
Webworks
Más de Walter Ebert
FrOSCon 2023: WordPress als ActivityPub-Instanz
FrOSCon 2023: WordPress als ActivityPub-Instanz
Walter Ebert
Hero Video Performance - DrupalCamp Ruhr
Hero Video Performance - DrupalCamp Ruhr
Walter Ebert
Sicherheit für WordPress
Sicherheit für WordPress
Walter Ebert
WordPress aufräumen - WordCamp Stuttgart
WordPress aufräumen - WordCamp Stuttgart
Walter Ebert
WordPress aufräumen
WordPress aufräumen
Walter Ebert
Hero Video Performance
Hero Video Performance
Walter Ebert
WordPress-Webseiten umziehen / online stellen
WordPress-Webseiten umziehen / online stellen
Walter Ebert
Using browser settings for performance
Using browser settings for performance
Walter Ebert
Das richtige WordPress-Theme finden
Das richtige WordPress-Theme finden
Walter Ebert
WordPress Health Check - WordCamp Würzburg
WordPress Health Check - WordCamp Würzburg
Walter Ebert
WordPress Health Check
WordPress Health Check
Walter Ebert
Making WordPress fast(er)
Making WordPress fast(er)
Walter Ebert
Testumgebungen für WordPress
Testumgebungen für WordPress
Walter Ebert
Modernism in Web Design
Modernism in Web Design
Walter Ebert
Más de Walter Ebert
(14)
FrOSCon 2023: WordPress als ActivityPub-Instanz
FrOSCon 2023: WordPress als ActivityPub-Instanz
Hero Video Performance - DrupalCamp Ruhr
Hero Video Performance - DrupalCamp Ruhr
Sicherheit für WordPress
Sicherheit für WordPress
WordPress aufräumen - WordCamp Stuttgart
WordPress aufräumen - WordCamp Stuttgart
WordPress aufräumen
WordPress aufräumen
Hero Video Performance
Hero Video Performance
WordPress-Webseiten umziehen / online stellen
WordPress-Webseiten umziehen / online stellen
Using browser settings for performance
Using browser settings for performance
Das richtige WordPress-Theme finden
Das richtige WordPress-Theme finden
WordPress Health Check - WordCamp Würzburg
WordPress Health Check - WordCamp Würzburg
WordPress Health Check
WordPress Health Check
Making WordPress fast(er)
Making WordPress fast(er)
Testumgebungen für WordPress
Testumgebungen für WordPress
Modernism in Web Design
Modernism in Web Design
Último
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Principled Technologies
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Earley Information Science
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Neo4j
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
V3cube
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
Paola De la Torre
Slack Application Development 101 Slides
Slack Application Development 101 Slides
praypatel2
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Drew Madelung
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
Malak Abu Hammad
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
naman860154
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
wesley chun
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Anna Loughnan Colquhoun
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
Radu Cotescu
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
HampshireHUG
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
hans926745
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
The Digital Insurer
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Gabriella Davis
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
The Digital Insurer
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
Allon Mureinik
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
gurkirankumar98700
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
The Digital Insurer
Último
(20)
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
Salesforce Community Group Quito, Salesforce 101
Salesforce Community Group Quito, Salesforce 101
Slack Application Development 101 Slides
Slack Application Development 101 Slides
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
Web Performance Optimierung - DWX13
1.
Web Performance Optimierung Walter Ebert
2.
3.
http://www.webpagetest.org/result/121212_RW_ED4/
4.
http://www.akamai.com/html/about/press/releases/2010/press_061410.html 57% der Online-Käufer warten
3 Sekunden oder weniger bevor sie eine Webseite verlassen
5.
Amazon 100 Millisekunden schneller 1%
mehr Umsatz http://www.strangeloopnetworks.com/resources/infographics/web-performance-and-ecommerce/amazon-100ms-faster-1-revenue-increase/
6.
Mozilla 2,2 Sekunden schneller 15,4%
mehr Downloads https://blog.mozilla.org/metrics/2010/04/05/firefox-page-load-speed-%E2%80%93-part-ii/
7.
http://googlewebmastercentral.blogspot.de/2010/04/using-site-speed-in-web-search-ranking.html SEO
8.
http://www.nccgroup.com/en/blog/2013/06/will-faster-user-bandwidth-fix-your-site-performance-woes/ DSL (1.5Mbps) >
Cable (5Mbps) 333% mehr Bandbreite Performance-Gewinn 12%
9.
10.
http://www.telekom.com/medien/produkte-fuer-privatkunden/184370
11.
http://www.flickr.com/photos/patrik_karlsson/6851386144/
12.
http://www.flickr.com/photos/usnavy/6083504722/
13.
Last-Tests • Apache Bench •
Siege • jMeter • WebLoadUI
14.
Skalierbarkeit vs. Performance
15.
Content Delivery Network (CDN)
16.
https://dvcs.w3.org/hg/webperf/raw-file/tip/specs/NavigationTiming/Overview.html http://caniuse.com/nav-timing W3C Navigation Timing
17.
http://kaaes.github.io/timing/
18.
https://www.webpagetest.org/result/130610_D0_PDZ/
19.
https://www.webpagetest.org/result/130610_D0_PDZ/
20.
http://www.webpagetest.org/result/130607_YF_TAK/
21.
http://yslow.org/
22.
23.
http://mobitest.akamai.com/m/results.cgi?testid=130413_GA_T
24.
http://httparchive.org/trends.php
25.
http://www.flickr.com/photos/dominicspics/5829559819/
26.
27.
Bilder optimieren • ImageOptim
(Mac) • Trimage (Linux) • kraken.io / smush.it (Web) • Google Pagespeed (Chrome / Firefox) • Kommadozeile: • jpegtran, jpegoptim, jpegrescan, optipng, pngcrush, advpng, pngquant, gifsicle
28.
Jpegtran 783K -copy all 750K
-copy none 742K -copy none -optimize 740K -copy all -optimize -progressive 708K -copy none -optimize -progressive 853K graffiti.jpg https://bitbucket.org/walterebert/image-conversion-comparison ImageMagick 5.6M graffiti.png 774K -quality 85 661K -quality 75 368K -quality 50 288K graffiti.webp 95K -resize 600x337
29.
http://adaptive-images.com/ https://github.com/davemcdermid/AdaptiveImages
30.
http://responsiveimages.org/
31.
https://github.com/scottjehl/picturefill
32.
CSS Sprites .flag { display:
inline-block; width: 16px; height: 11px; overflow: hidden; background: transparent url(flags.png) scroll -1px -1px no-repeat; } .europeanunion {background-position: -1px -1px;} .AUD {background-position: -1px -287px;} .BRL {background-position: -1px -40px;} .BGN {background-position: -1px -27px;} .CAD {background-position: -1px -52px;}
33.
DATA URIs Kommando $ base64
-w 0 fb.png > fb.png.txt $ php -r "echo base64_encode(file_get_contents('fb.png'));" > fb.png.txt CSS a.facebook {background-image: url('data:image/png;base64,iVBORw…g==');} < Internet Explorer 8 HTML <link rel="stylesheet" type="text/css" href="style.css" /> <!--[if lt IE 8]> <link rel="stylesheet" type="text/css" href="lt-ie-8.css" /> <![endif]--> CSS a.facebook {background-image: url('fb.png');} http://www.invifire.net/2013/01/17/data-uris-explained/
34.
https://github.com/nzakas/cssembed
35.
http://www.spritebaker.com/
36.
DATA URIs <img src='data:image/png;base64,iVBORw…g=='
alt=''>
37.
38.
39.
https://github.com/filamentgroup/grunticon http://www.grumpicon.com/
40.
http://icomoon.io/
41.
Abmessungen festlegen <img src="logo.png" width="182" height="60" alt="Logo"
/>
42.
http://www.flickr.com/photos/soulsystem2010/4502340253/
43.
Serverkonfiguration GZIP Text (HTML, CSS,
JS, JSON, XML, SVG, ...) Expires header Browser cache Keep alive TCP/IP-Verbindung
44.
https://github.com/h5bp/server-configs
45.
Kombiniere CSS /
Javascript <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="stylesheet" type="text/css" href="forms.css" /> <link rel="stylesheet" type="text/css" href="layer.css" /> <link rel="stylesheet" type="text/css" href="jcarousel.css" /> <link rel="stylesheet" type="text/css" href="lightbox.css" /> Wird <link rel="stylesheet" type="text/css" href="combined.css?v=20130625" /> Oder <link rel="stylesheet" type="text/css" href="combined-20130625.css" />
46.
Minifiziere CSS /
Javascript • Yahoo! YUI Compressor (Java) • Google Closure Compiler (Java) • Uglify.js (Node.js) • Microsoft Ajax Minifier (Windows)
47.
https://github.com/h5bp/ant-build-script https://github.com/h5bp/node-build-script
48.
https://developers.google.com/speed/pagespeed/mod http://www.youtube.com/watch?v=uR5urTx8S4E
49.
http://www.webpagetest.org/result/130616_3E_A0H/1/details/ SSL
50.
HTTP(S) <script src="//connect.facebook.net/de_DE/all.js"></script>
51.
Javascript am Ende Also: </div> <script
src=scripts.js></script> </body> </html> Anstatt: <head> <script src=scripts.js></script> </head> <body> Alternativ: <script src=scripts.js defer></script> http://walterebert.com/playground/wpo/js-footer/
52.
http://www.webpagetest.org/video/view.php?id=130622_547adbeec08ac5728ade73cc274453758a4ef2f8&data=1
53.
http://www.webpagetest.org/video/view.php?id=130622_547adbeec08ac5728ade73cc274453758a4ef2f8&data=1
54.
Nicht-blockierend laden Aus: <script src=//connect.facebook.net/de_DE/all.js></script> Wird: <script> (function(d,
s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/de_DE/all.js"; fjs.parentNode.insertBefore(js, fjs); }(document, "script", "facebook-jssdk")); </script> Oder: <script src=//connect.facebook.net/de_DE/all.js async></script>
55.
Webfonts Aus: <link rel='stylesheet' id='fontdeck-css' href='http://f.fontdeck.com/s/css/qjAxanDb3GzL8rviVV7PWUySExw/*.smashingmagazine.c om/12777.css?ver=1363158490'
type='text/css' media='screen, print' /> Wird: <script> WebFontConfig ={ fontdeck: { id: '12777' } }; (function() { var wf = document.createElement('script'); wf.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js'; wf.type = 'text/javascript'; wf.async = 'true'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(wf, s); })(); </script> https://developers.google.com/webfonts/docs/webfont_loader
56.
Vergleich http://www.webpagetest.org/video/compare.php?tests=130208_6K_PNS,130208_CZ_PNT
57.
Redirects <?php header('Location: /de/startseite');
58.
Clientseitig vs. Serverseitig http://www.brucelawson.co.uk/2013/the-amazing-all-new-performant-holy-grail-app-development-method/ http://www.netmagazine.com/news/twitter-hashbang-walloped-121992
59.
60.
Prefetching <link rel="dns-prefetch" href="//ajax.googleapis.com"> <link
rel="prefetch" href="http://tastywhe.at/yes/"> <link rel="prerender" href="http://tastywhe.at/no/">
61.
<input type="email" required> http://walterebert.com/playground/html5/input-types/ Form
Input Types
62.
Touch
63.
Video Media Queries <video
controls> <source src="small.mp4" type="video/mp4" media="all and (max-width:480px)"> <source src="small.webm" type="video/webm" media="all and (max-width:480px)"> <source src="big.mp4" type="video/mp4"> <source src="big.webm" type="video/webm"> </video> Könnte aus der HTML5 Spezifikation entfernt werden!
64.
MP4 Support <script> function supports_mp4()
{ return !!document.createElement('video').canPlayType('video/mp4; codecs="avc1.42E01E"').replace(/^no$/,''); } function supports_flash() { var hasFlash = false; try { var fo = new ActiveXObject('ShockwaveFlash.ShockwaveFlash'); if(fo) hasFlash = true; }catch(e){ var fm = navigator.mimeTypes["application/x-shockwave-flash"]; if( fm && fm.enabledPlugin ) hasFlash = true; } return hasFlash; } </script> http://walterebert.com/playground/video/mp4/
65.
MP4 moov atom ffmpeg
-i alt.mp4 -c:v copy -c:a copy -movflags faststart neu.mp4 http://ffmpeg.org/ http://www.adobe.com/devnet/video/articles/mp4_movie_atom.html
66.
https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills
67.
http://wurfl.sourceforge.net/
68.
Responsive Design +
Server Side Components (RESS) http://www.lukew.com/ff/entry.asp?1392
69.
http://de.slideshare.net/buddybrewer/tying-web-performance-data-to-human-behavior
70.
Fazit • Weniger Requests •
Kleinere Datenmengen • Parallele Downloads • Optische Täuschung
Descargar ahora