Myfia On The Web
Beta Version

Test speed web dengan Google Page Speed

Last Updated :: Wednesday, 01 July 2009 23:38 by Riesurya@MOTW

Setelah beberapa waktu yang lalu (nyaris 1 bulan ) saya bercerita tentang bagaimana mengoptimasikan website dengan menggunakan parameter dari YSlow Performance, maka artikel ini bisa dianggap sebagai lanjutannya.

Ceritanya Google sebagai salah satu pemain mesin pencari (search engine) tidak mau kalah (sok tau nih gw :P) dengan Yahoo! dalam hal public service (layanan publik).

Ketika Yahoo mengeluarkan YSlow sebagai bagian dari Firefox addon, kiranya Google pun merilis mainan sejenis yang diberi nama Google Page Speed. Mengapa saya tulis sejenis, lantaran sama-sama mempunyai fungsi sebagai tool analisis dalam hal optimasi suatu website.
Apa bedanya?
Google Page Speed ini membawa sejumlah fitur yang kalau digunakan dengan seksama dan tidak dalam tempo yang sesingkat-singkatnya dipadukan dengan YSlow juga Firebug akan menghasilkan output (keluaran) info yang menurut saya sangat bagus.

Mengapa bagus?
OK, biar ada gambaran nih dipasangin gambarnya.

Dari gambar di atas tampak fitur-fitur yang diusung oleh GooglePageSpeed (tidak secara urut) :

1. Minify JavaScript
2. Serve static content from cookieless domain
3. Use efficient CSS selector
4. Leverage browser caching
5. Combine external JavaScript
6. Optimize images
7. Remove unused CSS
8. Minimize cookie size
9. Enable gzip compression
10. Minimize DNS Lookup
11. Optimize the order of styles and scripts
12. Serve resources from a consistent URL
13. Avoid CSS Expression
14. Combine external CSS
15. Specify image dimensions
16. Minimize redirects
17. Put CSS in document head
18. Defer loading of JavaScript
19. Parallelize downloads across hostnames

Dari sejumlah rekomendasi parameter yang disodorkan di atas, beberapa memiliki kemiripan dengan YSlow, hanya pada Google Page Speed ini pengguna tampak diberi solusi secara langsung atau minimal petunjuk bagaimana mengoptimasinya.

Beberapa hal yang sudah saya coba antara lain:

Optimasi JavaScript dan CSS

(tidak beda jauh dengan parameter YSlow, hanya di Page Speed disertakan script yang sudah dioptimasi)
Untuk minimalisir file Javascript pengguna tetap harus hati-hati meskipun model optimasi yang dilakukan termasuk aman (dibandingkan beberapa script pengoptimasi Javascript lainnya yang bisa menyebabkan sejumlah fungsi tidak jalan alias mati kutu :P).

Parameter yang bisa dimanfaatkan :

• Minify JavaScript
• Combine external JavaScript
• Combine external CSS
• Enable gzip compression
• Put CSS in document head
• Defer loading of JavaScript
• Optimize the order of styles and script
• Avoid CSS Expression
• Remove unused CSS

Parameter diatas merupakan kombinasi yang sangat bagus (menurut pandangan awam saya ya). Terlebih bila dikombinasikan dengan adanya fasilitas .htaccess yang biasanya tersedia pada server berbasis Apache (LiteSpeed?). Kalau untuk server berbasis Windows-IIS ? bisa saja hanya menurut pengalaman (sok tahu lagi nih :P) hasilnya tidak seperti di server Linux-Apache. Mungkin ada yang bisa atau pengalaman di server Windows-IIS ? Silakan posting di kotak komentar di bawah ya.

Optimasi Images

Bahasan mengenai optimasi images dalam hal mempercepat suatu web sudah banyak dibahas. Tentu saja untuk images alias gambar yang dioptimasi secara umum adalah besaran ukuran filenya. Walau jangan lupa dari sisi resolusi gambar itu sendiri.
Menurut saya ada hal lain yang bisa dioptimasi dari image itu sendiri, misalnya dengan menggunakan model thumbnail (auto generated) dan meload image sebagai model lightbox.
(hingga saat ini situs MyfiaOnTheWeb masih menggunakan cara manual-mengingat belum menemukan model auto generated thumbnail dan lightbox - beberapa sudah dicoba tapi terjadi masalah dari sisi kompatibilitas dan selera juga sih selain sisi sekuritinya)

parameter optimasi images:

• Optimize images
• Specify image dimensions

Page Speed Activity versus HTTP Fox ?

Fitur lain yang diusung oleh Google Page Speed selain di atas adalah mode Page Speed Activity.
Pada mode ini ditampilkan aktivitas loading komponen-komponen pembentuk website, mulai dari file-file Javacript, images, dan tentu saja document (teks format) halaman.

Mode page speed activity pada Google Page Speed ini menurut saya masih kurang baik dibandingkan dengan addon Firefox yang bernama HTTP Fox. Pada HTTP Fox kita bisa melihat lebih jelas dan runut. Mudah-mudahan pada versi Page Speed berikutnya fitur Page Speed Activity ini bisa lebih ditingkatkan.

Web Optimation Summary

Artikel diatas adalah hasil pengalaman pribadi dan tanpa adanya titipan pesan atau sponsor apapun. Bagaimana bagusnya suatu tools tetaplah akan menjadi suatu tool karena hasil akhir andalah selaku pengembang yang melakukannya.
Penggunaan Google Page Speed adalah sebagai alat analisis dalam optimasi website, dan tentunya untuk menghasilkan hasil terbaik (setiap hari harus menjadi lebih baik) adalah dengan selalu memperluas wawasan dan rajin-rajin melakukan eksperiment apapun hasilnya, baik sukses maupun error.

Untuk lebih jelasnya bisa langsung menuju halaman Google Page Speed sekaligus memperoleh addon Firefox.

Akhirul kalam, semoga bermanfaat dan jangan pernah sungkan untuk memberi masukan perbaikan ataupun komentar artikel ini.

PS: Artikel ini menjalani masa endap selama sekitar 2 minggu setelah addon Firefox ini didapatkan.

PS: please put source link if you want to embedded this article (or any others in MOTW) in your blog to respect my work and time, Thank you :)
Dont miss it, be the first get the latest article from Myfia On The Web