Soumettre la recherche
Mettre en ligne
Web Performance Optimierung - DWX13
•
0 j'aime
•
7,947 vues
Walter Ebert
Suivre
Session für die Developer Week 2013 in Nürnberg
Lire moins
Lire la suite
Technologie
Art & Photos
Signaler
Partager
Signaler
Partager
1 sur 71
Télécharger maintenant
Télécharger pour lire hors ligne
Recommandé
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
Recommandé
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
Contenu connexe
Tendances
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
Tendances
(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
En vedette
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
En vedette
(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
Similaire à 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
Similaire à 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
Plus 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
Plus 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
Dernier
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
LoriGlavin3
2024 April Patch Tuesday
2024 April Patch Tuesday
Ivanti
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and Insights
Ravi Sanghani
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
Lonnie McRorey
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Nikki Chapple
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
Wes McKinney
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...
Farhan Tariq
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
itnewsafrica
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
itnewsafrica
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
panagenda
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
Curtis Poe
QCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architectures
Bernd Ruecker
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
panagenda
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024
TopCSSGallery
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdf
Neo4j
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
Manik S Magar
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App Framework
Pixlogix Infotech
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
LoriGlavin3
Decarbonising Buildings: Making a net-zero built environment a reality
Decarbonising Buildings: Making a net-zero built environment a reality
IES VE
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
Pixlogix Infotech
Dernier
(20)
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
2024 April Patch Tuesday
2024 April Patch Tuesday
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and Insights
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
Microsoft 365 Copilot: How to boost your productivity with AI – Part one: Ado...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Zeshan Sattar- Assessing the skill requirements and industry expectations for...
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
QCon London: Mastering long-running processes in modern architectures
QCon London: Mastering long-running processes in modern architectures
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Top 10 Hubspot Development Companies in 2024
Top 10 Hubspot Development Companies in 2024
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdf
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
MuleSoft Online Meetup Group - B2B Crash Course: Release SparkNotes
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App Framework
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Digital Identity is Under Attack: FIDO Paris Seminar.pptx
Decarbonising Buildings: Making a net-zero built environment a reality
Decarbonising Buildings: Making a net-zero built environment a reality
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
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
Télécharger maintenant