SlideShare ist ein Scribd-Unternehmen logo
1

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13
 Übersicht der PageSpeed Produkte
 Installation von Mod_Pagespeed
 Übersicht der verfügbaren Filter
 Vorstellung einiger wichtiger Filter
 Ersetzung von Plugins durch Filter von Mod_Pagespeed
 Pagespeed Service Konsole
 Demo

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

2
Unter dem Namen PageSpeed sind verschiedene Produkte von Google
zusammengefasst:
 Browser-Plugin zur Performancemessung (ähnlich zu YSlow von Yahoo)
 Verfügbar für Firefox und Chrome

 PageSpeed Insights
 Ähnliche Funktionen wie das Plugin, aber als Webanwendung (inkl. mobiler Analyse)

 PageSpeed Service
 Google Server als „Proxy“ inkl. Nutzung von Googles CDN

 Mod_Pagespeed
 Servermodul für Apache und Nginx

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

3
Am Beispiel von einem Debian System mit Apache:
 wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-

stable_current_amd64.deb

 dpkg -i mod-pagespeed-*.deb
 apt-get -f install

 /etc/init.d/apache2 restart

Das war es schon ;)

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

4
Gruppen von Filtern:
 Optimize Caching
 Minimize Round Trip Times
 Minimize Request Overhead
 Minimize Payload Size
 Optimize Browser Rendering
 Other

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

5
 Canonicalize JavaScript Libraries
 Schreibt URLs von bekannten Libraries zum ajax.googleapis.com um

 Extend Cache / Extend Cache PDFs
 Verlängerung der Cache-Control HTTP Header

 Outline CSS / Outline JavaScript
 Fügt Inline CSS/JS ab einer bestimmten Größe in eine externe Datei ein

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

6
 Combine CSS / Combine JavaScript
 Kombinieren von mehreren CSS/JS Dateien zu einer Datei inkl. Caching

 Inline CSS / Inline JavaScript
 Einfügen von kleinen CSS/JS Dateien direkt ins HTML Dokument

 Flatten CSS @imports
 Fügt die per @import angegeben Dateien direkt in die CSS Datei ein

 Move CSS Above Scripts
 Verschiebt die STYLE Tags im HEAD für ein besseres Rendering der Seite

 Sprite Images
 Kombiniert mehrere Hintergrundbilder zu einem Sprite

 Pre-Resolve DNS
 Sorgt dafür, dass DNS Namen schon im HEAD aufgelöst werden
Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

7
 Collapse Whitespace
 Minify JavaScript
 Optimize Images
 Konvertiert auch CSS Bilder in BASE64 Kodierte Strings

 Prioritize Critical CSS
 Entfernt alle CSS Anweisungen, die nicht benötigt werden

 Remove Comments
 Rewrite CSS
 Minified CSS und cached eingebundene CSS-Dateien bis zur nächsten Änderung

 Rewrite Style Attributes
 Optimiert style Attribute (Minify, Cache, BASE64 usw.)
Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

8
 Inline Preview Images
 Lädt Bilder in niedriger Qualität vor

 Lazily Load Images
 Lädt Bilder erst dann, wenn der Benutzer weit genug scrollt

 Move CSS to Head
 Veschiebt alle LINK und STYLE Tags in den HEAD

 Optimize Images
 Inline Images (BASE64)
 Recompress Images
 GIF to PNG, PNG to JPEG, JPEG to WEBP
 Resize Images
 Insert Image Dimensions
Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

9
 WP Minify
 Caching Plugins
 Thumbnail Plugins
 Lazy Loading Plugins
 Google Ajax Libraries Plugins

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

10
 Voraussetzungen
 CNAME der Domain muss auf pagespeed.googlehosted.com angepasst werden
 Nur mit Subdomains möglich (Domain ohne www etc. gehen also zur Zeit nicht)

 Verwaltung
 Google APIs Console: https://code.google.com/apis/console
 Aktivieren aller Filter über die Konsole

 Feineinstellung der Werte für diverse Filter
 Mehrere Domains pro Projekt möglich
 Nur eine Einstellung pro Projekt

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

11
Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

12
Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

13
 http://kau-boys.de
 http://wpmeetup-berlin.de
 http://www.bettinapruemmer.de (mit Mod_Pagespeed)
 http://ps.bettinapruemmer.de (mit Pagespeed Service)
 http://static.bettinapruemmer.de (ohne Pagespeed)

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

14
Weiterführende Quellen:
 Allgemeine Dokumentation: https://developers.google.com/speed/
 Filter: https://developers.google.com/speed/pagespeed/module/filters

Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13

15

Weitere ähnliche Inhalte

Andere mochten auch

Presentación Curso
Presentación Curso Presentación Curso
Presentación Curso
Iván Gómez Cuíña
 
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
Funseam - Fundación para la Sostenibilidad Energética y Ambiental
 
Frédérik delavier guía de los movimientos de musculación - descripción anat...
Frédérik delavier   guía de los movimientos de musculación - descripción anat...Frédérik delavier   guía de los movimientos de musculación - descripción anat...
Frédérik delavier guía de los movimientos de musculación - descripción anat...
Maraca Rodriguez
 
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
INOCENCIO MELÉNDEZ JULIO
 
Pc
PcPc
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
Luis Salvador Velasquez Rosas
 
SISTEMAS DE ECUACIONES
SISTEMAS DE ECUACIONESSISTEMAS DE ECUACIONES
SISTEMAS DE ECUACIONES
Carlos Javier Sánchez Bustamante
 
Energiewende am Beispiel des Gebäudebestands
Energiewende am Beispiel des GebäudebestandsEnergiewende am Beispiel des Gebäudebestands
Energiewende am Beispiel des Gebäudebestands
Vorname Nachname
 
Neuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
Neuerungen KEV, Erwartungen Gleichzeitigkeit, NetzbelastungNeuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
Neuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
Vorname Nachname
 
La mochila digital
La mochila digitalLa mochila digital
La mochila digital
Germán Lopez-Rey Fortuna
 
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez RosasJuguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
Luis Salvador Velasquez Rosas
 
Apps
AppsApps
Wie funktioniert Minergie-Eco?
Wie funktioniert Minergie-Eco?Wie funktioniert Minergie-Eco?
Wie funktioniert Minergie-Eco?
Vorname Nachname
 
Prueba única de periodo nº4 cami
Prueba única de periodo nº4 camiPrueba única de periodo nº4 cami
Prueba única de periodo nº4 cami
Juandiego Gomez Morales
 
Tarea 2 eq
Tarea 2 eqTarea 2 eq
Tarea 2 eq
YarelyAlonso
 
Diskursive Beteiligungsverfahren
Diskursive BeteiligungsverfahrenDiskursive Beteiligungsverfahren
Diskursive Beteiligungsverfahren
Peter Kühnberger
 
CE12 rodriguez ana_maría bautista_marcos
CE12 rodriguez ana_maría  bautista_marcosCE12 rodriguez ana_maría  bautista_marcos
CE12 rodriguez ana_maría bautista_marcos
Marcos Bautista
 
Photovoltaikintegration bei Fassadensanierung
Photovoltaikintegration bei FassadensanierungPhotovoltaikintegration bei Fassadensanierung
Photovoltaikintegration bei Fassadensanierung
Vorname Nachname
 

Andere mochten auch (20)

Presentación Curso
Presentación Curso Presentación Curso
Presentación Curso
 
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
1er Simposio FUNSEAM - Luis Ímaz Monforte - Hacia la red inteligente
 
Frédérik delavier guía de los movimientos de musculación - descripción anat...
Frédérik delavier   guía de los movimientos de musculación - descripción anat...Frédérik delavier   guía de los movimientos de musculación - descripción anat...
Frédérik delavier guía de los movimientos de musculación - descripción anat...
 
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
El concepto de aprendizaje autónomo, de trabajo académico a distancia y las...
 
Pc
PcPc
Pc
 
Comenius bildwörterbuch quelle
Comenius bildwörterbuch quelleComenius bildwörterbuch quelle
Comenius bildwörterbuch quelle
 
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
¿Está relacionado el desorden con la creatividad? Luis Salvador Velasquez Rosas
 
Gat1
Gat1Gat1
Gat1
 
SISTEMAS DE ECUACIONES
SISTEMAS DE ECUACIONESSISTEMAS DE ECUACIONES
SISTEMAS DE ECUACIONES
 
Energiewende am Beispiel des Gebäudebestands
Energiewende am Beispiel des GebäudebestandsEnergiewende am Beispiel des Gebäudebestands
Energiewende am Beispiel des Gebäudebestands
 
Neuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
Neuerungen KEV, Erwartungen Gleichzeitigkeit, NetzbelastungNeuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
Neuerungen KEV, Erwartungen Gleichzeitigkeit, Netzbelastung
 
La mochila digital
La mochila digitalLa mochila digital
La mochila digital
 
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez RosasJuguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
Juguetes para niños que fueron prohibidos. Luis Salvador Velásquez Rosas
 
Apps
AppsApps
Apps
 
Wie funktioniert Minergie-Eco?
Wie funktioniert Minergie-Eco?Wie funktioniert Minergie-Eco?
Wie funktioniert Minergie-Eco?
 
Prueba única de periodo nº4 cami
Prueba única de periodo nº4 camiPrueba única de periodo nº4 cami
Prueba única de periodo nº4 cami
 
Tarea 2 eq
Tarea 2 eqTarea 2 eq
Tarea 2 eq
 
Diskursive Beteiligungsverfahren
Diskursive BeteiligungsverfahrenDiskursive Beteiligungsverfahren
Diskursive Beteiligungsverfahren
 
CE12 rodriguez ana_maría bautista_marcos
CE12 rodriguez ana_maría  bautista_marcosCE12 rodriguez ana_maría  bautista_marcos
CE12 rodriguez ana_maría bautista_marcos
 
Photovoltaikintegration bei Fassadensanierung
Photovoltaikintegration bei FassadensanierungPhotovoltaikintegration bei Fassadensanierung
Photovoltaikintegration bei Fassadensanierung
 

Ähnlich wie Performance Optimierung mit Mod_Pagespeed - WP Camp 2013

Site Speed EXTREME - SEOkomm 2014
Site Speed EXTREME - SEOkomm 2014Site Speed EXTREME - SEOkomm 2014
Site Speed EXTREME - SEOkomm 2014
Bastian Grimm
 
Frontend-Architektur der 1&1 Bestellsysteme
Frontend-Architektur der 1&1 BestellsystemeFrontend-Architektur der 1&1 Bestellsysteme
Frontend-Architektur der 1&1 Bestellsysteme
Nico Steiner
 
WordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisierenWordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisieren
Torsten Landsiedel
 
JAMstack / Static Site Generators
JAMstack / Static Site GeneratorsJAMstack / Static Site Generators
JAMstack / Static Site Generators
DietrichRordorf
 
Mit Wordpress zur Conversion
Mit Wordpress zur ConversionMit Wordpress zur Conversion
Mit Wordpress zur Conversion
Adam_Sinko
 
PageSpeed für Einsteiger SEO Day 2014
PageSpeed für Einsteiger SEO Day 2014PageSpeed für Einsteiger SEO Day 2014
PageSpeed für Einsteiger SEO Day 2014
Franz Hernschier
 
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
Performance Optimierung - Barrierefreiheit beginnt mit LadezeitenPerformance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
David Maciejewski
 
HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5
Torsten Landsiedel
 
Seo roadmap 2013
Seo roadmap 2013Seo roadmap 2013
2. Technologie-Tag - Frontend Architektur
2. Technologie-Tag - Frontend Architektur2. Technologie-Tag - Frontend Architektur
2. Technologie-Tag - Frontend Architektur
Nico Steiner
 
Frontend Performance
Frontend PerformanceFrontend Performance
Frontend Performance
Nico Steiner
 
Frontend-Performance mit PHP
Frontend-Performance mit PHPFrontend-Performance mit PHP
Frontend-Performance mit PHP
Frank Kleine
 
Frontend-Performance @ IPC
Frontend-Performance @ IPCFrontend-Performance @ IPC
Frontend-Performance @ IPC
Nico Steiner
 
Wordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW BerlinWordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW Berlin
Hagen Kohn
 
PrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSFPrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSF
Christian Kaltepoth
 
WordPress SEO | Campixx 2016 | Hans Jung
WordPress SEO | Campixx 2016 | Hans JungWordPress SEO | Campixx 2016 | Hans Jung
WordPress SEO | Campixx 2016 | Hans Jung
Hans Jung
 
SDC2011: Web Performance Optimization
SDC2011: Web Performance OptimizationSDC2011: Web Performance Optimization
SDC2011: Web Performance Optimization
Jakob
 
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian BlochGoogle - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
Maximilian Bloch
 
HTTPs Migration How To - SMX München 2017
HTTPs Migration How To - SMX München 2017HTTPs Migration How To - SMX München 2017
HTTPs Migration How To - SMX München 2017
Bastian Grimm
 
Web460 ppt-de-jul-wi-web-all-2020
Web460 ppt-de-jul-wi-web-all-2020Web460 ppt-de-jul-wi-web-all-2020
Web460 ppt-de-jul-wi-web-all-2020
HansruediDbeli1
 

Ähnlich wie Performance Optimierung mit Mod_Pagespeed - WP Camp 2013 (20)

Site Speed EXTREME - SEOkomm 2014
Site Speed EXTREME - SEOkomm 2014Site Speed EXTREME - SEOkomm 2014
Site Speed EXTREME - SEOkomm 2014
 
Frontend-Architektur der 1&1 Bestellsysteme
Frontend-Architektur der 1&1 BestellsystemeFrontend-Architektur der 1&1 Bestellsysteme
Frontend-Architektur der 1&1 Bestellsysteme
 
WordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisierenWordPress.com-Blogs individualisieren
WordPress.com-Blogs individualisieren
 
JAMstack / Static Site Generators
JAMstack / Static Site GeneratorsJAMstack / Static Site Generators
JAMstack / Static Site Generators
 
Mit Wordpress zur Conversion
Mit Wordpress zur ConversionMit Wordpress zur Conversion
Mit Wordpress zur Conversion
 
PageSpeed für Einsteiger SEO Day 2014
PageSpeed für Einsteiger SEO Day 2014PageSpeed für Einsteiger SEO Day 2014
PageSpeed für Einsteiger SEO Day 2014
 
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
Performance Optimierung - Barrierefreiheit beginnt mit LadezeitenPerformance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
Performance Optimierung - Barrierefreiheit beginnt mit Ladezeiten
 
HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5HTML/CSS-Validierung in Zeiten von HTML5
HTML/CSS-Validierung in Zeiten von HTML5
 
Seo roadmap 2013
Seo roadmap 2013Seo roadmap 2013
Seo roadmap 2013
 
2. Technologie-Tag - Frontend Architektur
2. Technologie-Tag - Frontend Architektur2. Technologie-Tag - Frontend Architektur
2. Technologie-Tag - Frontend Architektur
 
Frontend Performance
Frontend PerformanceFrontend Performance
Frontend Performance
 
Frontend-Performance mit PHP
Frontend-Performance mit PHPFrontend-Performance mit PHP
Frontend-Performance mit PHP
 
Frontend-Performance @ IPC
Frontend-Performance @ IPCFrontend-Performance @ IPC
Frontend-Performance @ IPC
 
Wordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW BerlinWordpress Praxisseminar HW Berlin
Wordpress Praxisseminar HW Berlin
 
PrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSFPrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSF
 
WordPress SEO | Campixx 2016 | Hans Jung
WordPress SEO | Campixx 2016 | Hans JungWordPress SEO | Campixx 2016 | Hans Jung
WordPress SEO | Campixx 2016 | Hans Jung
 
SDC2011: Web Performance Optimization
SDC2011: Web Performance OptimizationSDC2011: Web Performance Optimization
SDC2011: Web Performance Optimization
 
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian BlochGoogle - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
Google - Mobil-First-Index @SEO-Campixx 2018 | Maximilian Bloch
 
HTTPs Migration How To - SMX München 2017
HTTPs Migration How To - SMX München 2017HTTPs Migration How To - SMX München 2017
HTTPs Migration How To - SMX München 2017
 
Web460 ppt-de-jul-wi-web-all-2020
Web460 ppt-de-jul-wi-web-all-2020Web460 ppt-de-jul-wi-web-all-2020
Web460 ppt-de-jul-wi-web-all-2020
 

Performance Optimierung mit Mod_Pagespeed - WP Camp 2013

  • 1. 1 Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13
  • 2.  Übersicht der PageSpeed Produkte  Installation von Mod_Pagespeed  Übersicht der verfügbaren Filter  Vorstellung einiger wichtiger Filter  Ersetzung von Plugins durch Filter von Mod_Pagespeed  Pagespeed Service Konsole  Demo Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 2
  • 3. Unter dem Namen PageSpeed sind verschiedene Produkte von Google zusammengefasst:  Browser-Plugin zur Performancemessung (ähnlich zu YSlow von Yahoo)  Verfügbar für Firefox und Chrome  PageSpeed Insights  Ähnliche Funktionen wie das Plugin, aber als Webanwendung (inkl. mobiler Analyse)  PageSpeed Service  Google Server als „Proxy“ inkl. Nutzung von Googles CDN  Mod_Pagespeed  Servermodul für Apache und Nginx Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 3
  • 4. Am Beispiel von einem Debian System mit Apache:  wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed- stable_current_amd64.deb  dpkg -i mod-pagespeed-*.deb  apt-get -f install  /etc/init.d/apache2 restart Das war es schon ;) Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 4
  • 5. Gruppen von Filtern:  Optimize Caching  Minimize Round Trip Times  Minimize Request Overhead  Minimize Payload Size  Optimize Browser Rendering  Other Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 5
  • 6.  Canonicalize JavaScript Libraries  Schreibt URLs von bekannten Libraries zum ajax.googleapis.com um  Extend Cache / Extend Cache PDFs  Verlängerung der Cache-Control HTTP Header  Outline CSS / Outline JavaScript  Fügt Inline CSS/JS ab einer bestimmten Größe in eine externe Datei ein Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 6
  • 7.  Combine CSS / Combine JavaScript  Kombinieren von mehreren CSS/JS Dateien zu einer Datei inkl. Caching  Inline CSS / Inline JavaScript  Einfügen von kleinen CSS/JS Dateien direkt ins HTML Dokument  Flatten CSS @imports  Fügt die per @import angegeben Dateien direkt in die CSS Datei ein  Move CSS Above Scripts  Verschiebt die STYLE Tags im HEAD für ein besseres Rendering der Seite  Sprite Images  Kombiniert mehrere Hintergrundbilder zu einem Sprite  Pre-Resolve DNS  Sorgt dafür, dass DNS Namen schon im HEAD aufgelöst werden Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 7
  • 8.  Collapse Whitespace  Minify JavaScript  Optimize Images  Konvertiert auch CSS Bilder in BASE64 Kodierte Strings  Prioritize Critical CSS  Entfernt alle CSS Anweisungen, die nicht benötigt werden  Remove Comments  Rewrite CSS  Minified CSS und cached eingebundene CSS-Dateien bis zur nächsten Änderung  Rewrite Style Attributes  Optimiert style Attribute (Minify, Cache, BASE64 usw.) Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 8
  • 9.  Inline Preview Images  Lädt Bilder in niedriger Qualität vor  Lazily Load Images  Lädt Bilder erst dann, wenn der Benutzer weit genug scrollt  Move CSS to Head  Veschiebt alle LINK und STYLE Tags in den HEAD  Optimize Images  Inline Images (BASE64)  Recompress Images  GIF to PNG, PNG to JPEG, JPEG to WEBP  Resize Images  Insert Image Dimensions Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 9
  • 10.  WP Minify  Caching Plugins  Thumbnail Plugins  Lazy Loading Plugins  Google Ajax Libraries Plugins Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 10
  • 11.  Voraussetzungen  CNAME der Domain muss auf pagespeed.googlehosted.com angepasst werden  Nur mit Subdomains möglich (Domain ohne www etc. gehen also zur Zeit nicht)  Verwaltung  Google APIs Console: https://code.google.com/apis/console  Aktivieren aller Filter über die Konsole  Feineinstellung der Werte für diverse Filter  Mehrere Domains pro Projekt möglich  Nur eine Einstellung pro Projekt Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 11
  • 12. Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 12
  • 13. Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 13
  • 14.  http://kau-boys.de  http://wpmeetup-berlin.de  http://www.bettinapruemmer.de (mit Mod_Pagespeed)  http://ps.bettinapruemmer.de (mit Pagespeed Service)  http://static.bettinapruemmer.de (ohne Pagespeed) Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 14
  • 15. Weiterführende Quellen:  Allgemeine Dokumentation: https://developers.google.com/speed/  Filter: https://developers.google.com/speed/pagespeed/module/filters Bernhard Kau | @2ndkauboy | http://kau-boys.de | #wpcb13 15