Datenkompression - Ein praktischer Leitfaden für den Einstieg

Slide 1

Slide 1 text

Datenkompression Ein praktischer Leitfaden für den Einstieg WordPress Meetup Berlin, 26.01.2017

Slide 2

Slide 2 text

Heiko Mamerow • Frontender • WordPresser • Perfmatterer @HeikoMamerow

Slide 3

Slide 3 text

„Performance is a feature.“ Ilya Grigorik, Google

Slide 4

Slide 4 text

Datenkompression ist gut für Web Performance

Slide 5

Slide 5 text

Datenkompression ist gut, weil … Verringert die Dateigröße

Slide 6

Slide 6 text

Kleine Datei 30 kB 100 kB Kompression 30 – 70%

Slide 7

Slide 7 text

Kleine Datei = Schnelle Ladezeit Unkomprimiert Komprimiert Dateigröße: 100 MB 30 MB Übertragungsrate: 10 Mbit/s (DSL) Dauer: 80s 24s

Slide 8

Slide 8 text

● Kompressionsprogramm ● Dateiformat: dateiname.gz ● Open Source (GPL) ● Normalerweise installiert. \o/ ● Normalerweise nicht aktiviert. /o\ gzip

Slide 9

Slide 9 text

Eignet sich am besten für alle Dateien, die Text enthalten. z.B. .html, .php, .js, .css, .svg, .woff2 gzip

Slide 10

Slide 10 text

gzip Check www.gziptest.com

Slide 11

Slide 11 text

gzip Plugins für WordPress https://wordpress.org/plugins/tags/gzip Plugins nur im „Notfall“. Eigenen sich nur für Apache Server. Möglichst die Einstellungen beim Provider nutzen bzw. erst mal dort anfragen.

Slide 12

Slide 12 text

Alternative Brotli https://github.com/google/brotli Noch bessere Kompression Nur für Erwachsene ;-)

Slide 13

Slide 13 text

Vergleich Unkomprimiert gzip Brotli

Slide 14

Slide 14 text

Danke :-) @HeikoMamerow

Slide 15

Slide 15 text

Bildnachweis: Fernsehturm (Slide 2) Urheber: von Kazuyanagae (Eigenes Werk) [CC BY-SA 4.0 ( http://creativecommons.org/licenses/by-sa/4.0)], via Wikimedia Commons Andrere Bilder und Grafikelemente (ausser Screenshot) Pixabay