Cara Optimalkan Situs Anda Dengan Kompresi GZIP

Manufacturers

Cara Optimalkan Situs Anda Dengan Kompresi GZIP

Kompresi adalah cara yang sederhana, efektif untuk menghemat bandwidth dan mempercepat situs Anda. Aku ragu-ragu dalam merekomendasikan kompresi gzip ketika mempercepat javascript anda karena masalah di browser lama.

Tapi ini abad ke-21. Sebagian besar lalu lintas saya datang dari browser modern, dan terus terang, sebagian besar pengguna saya cukup tech-savvy. Aku tidak ingin memperlambat orang lain turun karena seseorang sedang menenggak bersama pada IE 4.0 pada Windows 95. Google dan Yahoo menggunakan kompresi gzip. Sebuah browser modern diperlukan untuk menikmati konten web yang modern dan kecepatan web modern - encoding gzip sehingga. Berikut adalah cara untuk memasangnya.

Tunggu, tunggu, tunggu: Mengapa kita melakukan ini ?

Sebelum kita mulai saya harus menjelaskan apa pengkodean konten. Bila Anda meminta sebuah file seperti http://www.yahoo.com/index.html, pembicaraan browser Anda ke web server. Percakapan berlangsung sedikit seperti ini:

1. Browser: Hei, aku GET / index.html
2. Server: Ok, biarkan aku melihat apakah index.html berbohong sekitar ...
3. Server: Ketemu! Berikut kode respon Anda (200 OK) dan saya mengirimkan file.
4. Browser: 100KB? Aduh ... menunggu, menunggu ... ok, itu dimuat.

Tentu saja, header dan protokol yang sebenarnya jauh lebih formal (monitor mereka dengan HTTP Headers Live jika Anda begitu ingin).
Tapi itu bekerja, dan Anda mendapat file Anda.
Jadi apa masalahnya?
Nah, sistem bekerja, tapi tidak efisien. 100KB banyak teks, dan terus terang, HTML berlebihan. Setiap tag <html>, table dan <div> memiliki tag penutup yang hampir sama. Kata-kata yang diulang seluruh dokumen. Setiap cara Anda mengiris itu, HTML (dan sepupunya gemuk nya, XML) tidak ramping.

Dan apa rencananya bila file terlalu besar? Zip-nya!

Jika kita dapat mengirim file. Zip ke browser (index.html.zip) bukan index.html tua polos, kita akan menghemat bandwidth dan waktu download. Browser dapat men-download file zip, ekstrak, lalu menunjukkan kepada pengguna, yang dalam suasana hati yang baik karena halaman dimuat dengan cepat. Percakapan Browser-server mungkin terlihat seperti ini:

1. Browser: Hei, bisa saya GET index.html? Aku akan mengambil versi kompresi jika Anda punya itu.
2. Server: Mari saya menemukan file ... yep, itu di sini. Dan Anda akan mengambil versi kompresi? Mengagumkan.
3. Server: Ok, saya telah menemukan index.html (200 OK), saya zipping dan mengirimnya melalui.
4. Browser: Great! Ini hanya 10KB. Aku akan unzip dan menunjukkan pengguna.
Rumusnya sederhana: file lebih kecil = lebih cepat download = pengguna bahagia.
Jangan percaya padaku? Bagian HTML dari halaman rumah yahoo pergi dari 101kb ke 15kb setelah kompresi:

The (not so) hairy details

Bagian tersulit dari pertukaran ini adalah browser dan server tahu itu ok untuk mengirim file zip berakhir. Perjanjian ini memiliki dua bagian

Browser mengirimkan header memberitahu server yang menerima konten terkompresi (gzip dan mengempis dua skema kompresi): Terima-Encoding: gzip, deflate

Server akan mengirimkan respon jika konten sebenarnya dikompresi: Content-Encoding: gzip

Jika server tidak mengirim respon header konten-encoding, itu berarti file tidak dikompresi (default pada banyak server). "Terima-encoding" header hanya permintaan oleh browser, bukan menuntut. Jika server tidak ingin mengirim kembali konten terkompresi, browser harus membuat hubungannya dengan versi biasa berat.

Menyiapkan server

"Kabar baik" adalah bahwa kita tidak dapat mengendalikan browser. Itu baik mengirimkan Terima-encoding: gzip, deflate header atau tidak.
Tugas kita adalah untuk mengkonfigurasi server sehingga kembali konten zip jika browser dapat mengatasinya, menghemat bandwidth untuk setiap orang (dan memberi kita pengguna senang).
Untuk IIS, mengaktifkan kompresi dalam pengaturan.
Di Apache, memungkinkan kompresi output cukup mudah. Tambahkan baris berikut ke file tsb.:

# Kompres teks, html, javascript, css, xml:
AddOutputFilterByType mengempis text / plain
Teks AddOutputFilterByType mengempis / html
AddOutputFilterByType mengempis teks / xml
AddOutputFilterByType mengempis text / css
AddOutputFilterByType mengempis aplikasi / xml
AddOutputFilterByType mengempis aplikasi / xhtml + xml
AddOutputFilterByType mengempis aplikasi / rss + xml
AddOutputFilterByType mengempis aplikasi / javascript
AddOutputFilterByType mengempis application / x-javascript

# Atau, kompres jenis file tertentu dengan ekstensi:
<Files *.html>
SetOutputFilter mengempis
</ Files>

Apache sebenarnya memiliki dua pilihan kompresi:

mod_deflate lebih mudah untuk mengatur dan standar.
mod_gzip tampaknya lebih kuat: Anda dapat pre-kompres konten.

Mengempis cepat dan bekerja, jadi saya menggunakan itu, penggunaan mod_gzip jika itu mengapung perahu Anda. Dalam kedua kasus, Apache memeriksa apakah browser mengirimkan "Terima-encoding" header dan mengembalikan versi kompresi atau reguler dari file. Namun, beberapa browser lama mungkin mengalami kesulitan (lebih lanjut di bawah) dan ada arahan khusus Anda dapat menambahkan untuk memperbaiki hal ini.
Jika Anda tidak dapat mengubah file. Htaccess, Anda dapat menggunakan PHP untuk kembali konten terkompresi. Berikan file HTML ekstensi php dan tambahkan kode ini ke atas.:
Di PHP:
<? php if (substr_count ($ _SERVER ['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start ("ob_gzhandler"); ob_start lain ();?>
Kami memeriksa "Terima-encoding" header dan kembali versi gzip dari file (jika tidak versi biasa). Ini hampir seperti membangun webserver sendiri (apa yang menyenangkan!). Tapi sebenarnya, cobalah untuk menggunakan Apache untuk kompres output jika Anda dapat membantu itu. Anda tidak ingin monyet dengan file Anda.

Verifikasi Kompresi Anda

Online: Gunakan tes gzip online untuk memeriksa apakah halaman Anda dikompresi.

Dalam browser Anda: Gunakan Web Developer Toolbar> Informasi> Lihat Dokumen Ukuran (seperti yang kulakukan untuk Yahoo, di atas) untuk melihat apakah halaman yang dikompresi.

Lihat header: Gunakan Live HTTP Headers untuk memeriksa respon. Carilah sebuah baris yang mengatakan "Content-encoding: gzip".

Setelah Anda telah dikonfigurasi server Anda, periksa untuk memastikan Anda benar-benar melayani sampai konten terkompresi.

Bersiaplah untuk mengagumi hasilnya. Homepage instacalc menyusut dari 36k ke 10k, pengurangan 75% dalam ukuran.

Cobalah Beberapa Contoh
Aku sudah menyiapkan beberapa halaman dan contoh download:

     index.html - Tidak kompresi eksplisit (pada server ini, saya menggunakan kompresi default
     index.htm -. eksplisit dikompresi dengan Apache htaccess menggunakan *. htm sebagai aturan
     index.php - Secara eksplisit dikompresi menggunakan header PHP

Jangan ragu untuk men-download file, menempatkan mereka pada server Anda dan tweak pengaturan.
peringatan
Seperti menarik karena dapat muncul, Kompresi HTTP adalah tidak semua menyenangkan dan permainan. Inilah yang harus diwaspadai:

     Browser lama: Ya, beberapa browser mungkin masih memiliki masalah dengan konten terkompresi (mereka mengatakan mereka bisa menerima itu, tapi benar-benar mereka tidak bisa). Jika situs Anda benar-benar harus bekerja dengan Netscape 1.0 pada Windows 95, Anda mungkin tidak ingin menggunakan Kompresi HTTP. Apache mod_deflate memiliki beberapa aturan untuk menghindari kompresi untuk browser lama.
     Konten yang sudah-kompresi: Kebanyakan gambar, musik dan video sudah dikompresi. Jangan buang waktu lagi mengompresi mereka. Bahkan, Anda mungkin hanya perlu menekan "3 besar" (HTML, CSS dan Javascript).
     CPU-beban: Pemampat konten di-the-fly menggunakan waktu CPU dan menghemat bandwidth. Biasanya ini merupakan tradeoff yang besar mengingat kecepatan kompresi. Ada cara untuk pra-kompres konten statis dan mengirim lebih dari versi terkompresi. Hal ini memerlukan konfigurasi yang lebih, bahkan jika itu tidak mungkin, output mengompresi mungkin masih menang bersih. Menggunakan siklus CPU untuk pengalaman pengguna yang lebih cepat adalah bernilai baik, mengingat rentang perhatian yang pendek di web.

Mengaktifkan kompresi adalah salah satu cara tercepat untuk meningkatkan performa situs Anda. Pergilah, mengaturnya, dan membiarkan pengguna Anda menikmati manfaat.