Intermezzo: Page Speed Analysis Result

April 29, 2010 — Nilai 94 untuk hasil analisis kecepatan muat halaman menggunakan Page Speed. Nilai yang sangat menggembirakan, mengingat sebelumnya nilai kecepatan waktu muat halaman blog ini tidak pernah melebihi 90.. Intermezzo: Page Speed Analysis Result diulas oleh rismaka pada April 29, 2010. Berikut ulasan selengkapnya. 4.8

Rekor baru berhasil terpecahkan. Nilai 94 untuk hasil analisis kecepatan muat halaman menggunakan Page Speed. Nilai yang bagi saya sangat menggembirakan, mengingat sebelumnya nilai kecepatan waktu muat halaman blog ini tidak pernah melebihi 90. Nilai tersebut adalah hasil analisis untuk halaman Refleksi di Tulisan Ke-300 rismaka.NET.

Lihat gambar hasil analisis kecepatan halaman (new tab)

Namun tentunya akan selalu ada konsekwensi yang harus dibayar, terutama fitur-fitur menarik yang dikorbankan demi mencapai kecepatan maksimum sebuah halaman web. Beberapa fitur yang harus dikorbankan:

  1. Tidak ada gambar eksternal, namun hanya berupa tulisan berbasis teks.
  2. Fungsi gravatar yang dimatikan, kecuali untuk avatar admin (saya sendiri)
  3. Menonaktifkan plugin yang menyisipkan CSS di bagian header. Plugin tersebut adalah code colorer yang berfungsi untuk melindungi markah HTML atau PHP agar tidak terfilter oleh WordPress saat ditampilkan. Plugin tersebut memang sudah saatnya dilepas, karena hanya menyebabkan validitas XHTML dan feed blog ini terganggu.
  4. Menonaktifkan plugin lifestream. Sebagaimana code colorer, ia pun menyisipkan javascript dan CSS di bagian header.
  5. Melepas feedcounter dari feedburner, karena ia menambah 1 buah HTTP Request. (apa itu HTTP Request?)
  6. Melepas adsense.
  7. Melepas banner hasil statistik yang tidak penting, seperti pagerank, alexa, jumlah pageview, dll. Banner itu hanya menjadi sampah saja di blog ini.

Dari ke-7 objek di atas, saya paling berat hati ketika mematikan fungsi gravatar. Gravatar seolah sudah menjadi bagian hidup pengguna WordPress. Namun di balik fiturnya yang menarik, ia merupakan penyumbang terbesar lambannya sebuah blog. Saya berencana ingin membahas tentang biang kerok yang satu ini (gravatar) sebagai penghambat laju kecepatan suatu web. Namun sepertinya masih lama, karena ada beberapa hal yang mesti saya selesaikan dahulu.

Hasil 94 tentunya bukan hasil akhir yang ingin saya peroleh. Saya tetap ingin memaksimalkan kecepatan halaman di blog ini hingga mencapai batas nilai 97-99 (mungkinkah dengan dana yang terbatas?).

Beberapa optimasi yang ingin saya lakukan ke depannya:

  1. Mematikan fitur smiley
  2. Menggunakan CSS sprites dalam menampilkan gambar CSS
  3. Mematikan secara keseluruhan fitur gravatar
  4. Memaksimalkan fungsi cache

Pesan saya bagi penganut agama SEO, guru SEO, blogger SEO ataupun yang sering sesumbar masalah SEO, pelajarilah bagaimana mengoptimalkan kecepatan akses blog anda, karena google telah memasukkan faktor kecepatan muat halaman sebagai faktor penentu peringkat halaman di SERP.

From Official google webmaster central blog:

Using site speed in web search ranking

As part of that effort, today we’re including a new signal in our search ranking algorithms: site speed. Site speed reflects how quickly a website responds to web requests.

Beberapa perangkat (tool) untuk melihat dan menganalisis kecepatan muat halaman web:

  • http://www.planet-orange.org Planet Orange
    using Google Chrome 4.1.249.1059 on Windows 7

    Saya juga pengen matiin gravatar mas…. berat, kadang kala freeze saat nunggu load gravatar ini…

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Fungsi gravatar yang dimatikan bisa mengecilkan minat orang lain utk berkomentar lho mas. Sudah siap konsekwensinya? :)

      • http://www.planet-orange.org Planet Orange
        using Firefox 3.6.3 on Windows 7

        Apa iya mas Ris..? kok saya enggak terlalu yakin yach..

        Mungkin orang lebih males lagi komen, kl loadnya lambat mas…

        Saya sih siap2 aja kl emang konsekwensinya bgitu, kan saya termasuk penganut faham “jumlah komeng bukanlah parameter populer atau tidaknya sebuah blog… :)

        • http://blog.rismaka.net/ rismaka
          using Firefox 3.6.3 on Windows XP

          @Planet Orange,
          Beberapa orang mungkin melihat suatu blog dari segi tampilan, dan ia mungkin sangat menikmati pada area komentar manakala terdapat banyak gambar avatar. Jika seandainya avatarnya dimatikan, yaa itu mungkin akan menyebabkan ia agak malas berkomentar.

          Saya pribadi sama seperti mas aan, ga terpengaruh dengan adanya gravatar. Toh blogspot juga tidak ada, kan?

  • http://galerikata.com Bang Dje
    using Firefox 3.6.3 on Windows XP

    Untuk mencari komentar saya kembali biasanya saya melihat ke gravatar. karena mata ini lebih cepat menangkap image daripada text. Tanpa gravatar saya harus memelototi nama penulis.
    Saat kecepatan akses internet meningkat mungkin perbedaa 5 point tidak akan terasa lagi. Sebaliknya perbedaan tampilan akan sangat terlihat. Mohon dipertimbangkan lagi rencana perubahan itu dan tampilkan lagi wajah saya di kolom komentar. (???) Tidak hanya di top commentators.

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Ada banyak orang yang mengakses blog ini dengan koneksi internet yang lemot, dan ada juga yang terpaksa mematikan fitur gambar di peramban. Dengan fitur gravatar yang dimatikan, saya berharap semuanya bisa memperoleh kepuasan yang sama.

      Hmm.. sarannya ditampung dulu ya bang :)

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Bang Dje mungkin bisa menerapkan cara yang dilakukan oleh @mas Dani dalam mencari komentar bang Dje.

  • http://www.idebagusku.com idebagusku
    using Firefox 3.6.4 on Windows 7

    saya cek dulu ah speed, terima kasih guru akan ilmunya

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Silakan diinstal kedua plugin/addon berikut: firebug dan page speed. Keduanya harus diinstal untuk dapat melihat hasil analisis kecepatan muat suatu halaman web.

  • http://aldymy.name Aldy
    using Firefox 3.6.3 on Windows XP

    Ide yang menarik mas Ris, mematikan gravatar.

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Kecewa ga mas, dengan fitur gravatar yang dimatikan? Mohon sharingnya ya.. yang lengkap :)

    • http://daniiswara.com/ dani
      using Namoroka 3.6.3 on Arch Linux

      Pak Aldy mungkin bisa memasukkan skor ini di program tinjauannya. :)

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      @dani, @mas Aldy,
      Setuju dengan mas dani. Mungkin mas Aldy perlu juga memasukkan skor nilai page speed ke dalam tinjauan blog yg mas Aldy lakukan. Karena memang kecepatan muat suatu web perlu disosialisasikan agar setiap narablog perlu memperhatikan pengguna dengan koneksi yang lambat, dan bukan semata2 berorientasi pada skor dan SEO.

  • http://kafegue.com/ iskandaria
    using Firefox 3.6.3 on Windows XP

    Ternyata benar juga pengamatan saya, bahwa gravatar adalah salah satu biang kerok pelambat loading blog. Tapi di situlah maslahnya kalau ingin dimatikan. Tampilan area komentar jadi hambar. Ini kurang baik bagi blog-blog yang diperuntukkan untuk ajang silaturahmi. Bukan sekadar demi kepentingan menambah jumlah komentar sih. Ini cuma masalah kesan personal sang komentator yang akan hilang jika tidak ada gravatar.

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Gravatar mungkin usable dalam hubungannya antara pemilik blog dan pemberi komentar (tentunya pengkomentar harus mempunyai gravatar juga). Namun juga agak merugikan pengguna dengan kecepatan internet yang lambat, yang sampai2 harus mematikan fungsi gambar di peramban yg mereka pakai.

      Untuk itulah saat ini saya memilih untuk mematikannya. Toh silaturrahim tidak tergantung sepenuhnya pada gambar avatar, bukan? :)

  • http://daniiswara.com/ dani
    using Namoroka 3.6.3 on Arch Linux

    Mmmm..tentang gravatar, memang usable. Tapi mungkin tidak aksesibel jika dilihat dari waktu muat. Saya lebih sering mencari [nama saya] dengan tombol / , ketik [nama saya], f3 jika perlu di fx.

    Kembali ke gravatar, bukannya bisa disetel supaya gambar yang muncul berasal dari server sendiri? Trus di-caching gitu. Dengan catatan, gravatarnya hanya 2 macam: admin dan user biasa. Yang user biasa make default seragam, misal human. :lol:

    Pertimbangannya, nantinya, akan kembali ke: demi skor (Google SERPs) atau kemudahan pengguna (dalam hal ini usability)? Antara rela ngga rela. :)

    Saya sendiri tahu tentang page speed dari tulisan Pakdhe Handoko Harry dan Mas Adi di sini. Belum sempat bersih-bersih CSS lagi. :(

    Pertanyaan lain yang masih menggantung: kapan Blogspot ditingkatkan kecepatannya, semantiknya, standar Webnya?

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      @Dani,
      Saat ini penggunaan gravatar belum sepenuhnya saya matikan. Saya menggunakan 2 macam gravatar, yaitu gravatar utk admin dan gravatar utk umum (seragam), seperti yang mas dani sebutkan.

      Untuk pertimbangan, kembali lagi ke tujuan masing2 (saya sendiri) apakah demi skor atau kemudahan (usability). Namun dilihat dari prosentasi, pengunjung yg datang tanpa berkomentar jauh lebih banyak daripada yg berkomentar. Itupun belum dihitung dari komentar yang basa-basi, sekedar lewat dan setelah itu tida mampir lagi. Usability gravatar baru akan terasa bila dalam suatu blog terdapat diskusi yang mengalir (seperti di blognya mas dani), bukan hanya asal lewat, numpang pertamax, ataupun caci maki saja :lol:

      Untuk blogspot, saya tidak bisa berkomentar. Karena memang tidak minat sama sekali dengan blogspot :)

    • http://gandamanurung.com ganda
      using Google Chrome Frame 4.0 on Windows XP

      terbersit sebuah ide lagi, bagaimana kalau gravatarnya di satukan menjadi sebuah gambar besar, dan di load menggunakan css sprites, dan tentu saja, dengan model caching pula.

      • http://blog.rismaka.net/ rismaka
        using Firefox 3.6.3 on Windows XP

        ganda,
        Sepertinya tidak mungkin bisa gandz, karena penyedia gravatar itu kan gravatar (ya iyalah). Hmm.. kecuali masing2 pengkomentar benar2 diset manual gravatarnya, kemudian diload dari cache.

        Klo yang berkomentar 1-10 siy ga masalah, nah klo ratusan?

        • http://gandamanurung.com ganda
          using Google Chrome Frame 4.0 on Windows XP

          It is possible bang. The idea is based on commentator’s email. Kalau cachenya sih masih mudah, mungkin yang cukup sulit itu adalah menyatukannya menjadi CSS sprites(satu gambar saja), karena akan bermain dengan X,Y image position dan array. Beratnya sih cuman permainan kordinat itu, karena kalau menggunakan array of string, pemetaannya bisa dilakukan, termasuk juga pemetaan terhadap emailnya, disusun sedemikian rupa. Adabaiknya menggunakan fungsi hash juga.

          • http://blog.rismaka.net/ rismaka
            using Firefox 3.6.3 on Windows XP

            ganda,
            Nah itu dia, menggabungkan semua avatar itulah yang sulit. Tapi ide ini mungkin bukan lagi impossible project di tahun2 mendatang. We’ll see

          • http://gandamanurung.com ganda
            using Google Chrome Frame 4.0 on Windows XP

            @rismaka,
            gak harus menunggu sampai tahun mendatang, sebenarnya mudah kok. Gak sulit-sulit amat. :D Bisa di implementasikan langsung kok. Algoritmanya mudah. :D

        • http://galerikata.com Bang Dje
          using Firefox 3.6.3 on Windows XP

          Mungkin bisa diterapkan di sini. Toh yang berkomentar juga itu-itu saja.
          BTW terima kasih usulan saya diterima

  • http://catatan.legawa.com Cahya
    using Firefox 3.6.3 on Windows Vista

    Kecepatan seringkali mesti berbanding terbalik dengan estetik blog. Ya mau bagaimana lagi, saya pun tidak suka kalau membuka halaman blog jadi terlalu berat.

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Cahya,
      Jadi? Adakah saran/dukungan/kritik terhadap apa2 yang saya lakukan di atas? Terkait usability dan kecepatan tentunya.

      Jujur saat ini saya lagi bimbang, hendak saya bawa kemana blog ini ke depannya. Memanjakan pengkomentar (yang bisa saja hanya sekali komentar tapi ga pernah nongol lagi, numpang pertamax, atau numpang nyepam), ataukah memanjakan pengunjung yang miskin bandwidth seperti saya? :lol:

  • http://catatan.legawa.com Cahya
    using Firefox 3.6.3 on Windows Vista

    Saya juga melakukan hal yang serupa dengan Mas Rismaka, seperti mematikan smiley di bagian artikel.

    Tapi mengganti image dengan external link rasanya agak bagaimana gitu, he he, maksud saya mungkin karena saya masih menyukai unsur estetik, biar sebuah blog tidak mati rasa.

    Sebagai gantinya saya hosting gambar di Picasa Web Album, karena cukup ringan dibuka dibandingkan dengan Photobucket (kebetulan saya punya dua akun itu), saya mengecek dengan pingdom tool ini lumayan mempercepat akses pembukaan halaman bergambar.

    Kalau memang benar-benar plain blog yang super cepat. Ya benar seperti Mas Rismaka bilang, bunuh saja sampai gravatarnya, he he :D – tapi kan harus dipertimbangkan juga antara fungsi dan dampaknya.

    Kalau memang orang tidak perlu gravatar, yah paling seperti saya atau Bli Dani, kemana-mana pakai mode disable image :)

    Yang paling memahami sebuah blog adalah pemiliknya sendiri ;)

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      Cahya,
      Well, trims atas tambahannya mas. Mengenai external link to image, itu saya gunakan seperlunya, seperti halnya pada posting di atas gambar hanya sebuah kebutuhan sekunder, dan berupa pelengkap. Lain halnya jika gambar tersebut berisikan informasi yang berhubungan dengan konten, seperti pada posting tutorial misalnya, tentu saya akan usahakan mengembed gambar tersebut.

      Kecepatan akses untuk sebuah gambar memang relatif jika dilihat dari sisi manusia, namun menjadi sebuah standar tersendiri di sisi client. Gambar, seberapa cepat sumbernya pun akan menambah DNS look up. Hal ini sangat buruk bagi performa, meskipun kita menggunakan koneksi internet paling cepat sekalipun. Solusinya adalah menghosting gambar tsb di server sendiri. Tentunya ini juga ada efeknya, yakni jumlah item unduh per-sessi bertambah. :D (bagi saya optimasi kecepatan di blog ini merupakan sebuah seni, karena di sinilah menariknya, ada tantangan)

      Kita lihat nanti, apakah benar jika saya matikan gravatarnya, pengunjung masih akan datang atau tidak. Kalau memang seperti itu, berarti tindakan saya tepat, karena telah melakukan screening, manakah pengunjung yang hanya ingin kunjungan balik (ada pamrihnya) dan mana pengunjung yang benar-benar ingin berdiskusi. :)

      • http://catatan.legawa.com Cahya
        using Firefox 3.6.3 on Windows Vista

        Saya sih tidak masalah, tapi coba tanya Bli Dani yang suka menghitung “berapa klik” yang diperlukan untuk mendapatkan semua konten blog secara utuh? Soalnya saya tidak ahli kalau berbicara tentang aksesibilitas :)

        Kalau masalah gravatar sih tidak begitu Mas. Soalnya banyak blog luar, terutama saya sering lihat blog para developer web yang memang mematikan fitur gravatar. Tapi toh blognya tetap “laku” karena memang faktor konten yang diperlukan pembacanya ;)

      • http://daniiswara.com/ dani
        using Namoroka 3.6.3 on Arch Linux

        Jika gambar penunjang konten, saya lebih berat ke space jika memakai internal. :( Dasar pelit!

        Jika mematikan gravatar dan smiley, kita lihat saja. Ah, tapi saya tidak peduli ada komentar atau tidak, cepat atau tidak. Saya matikan keduanya. Toh saya sendiri tidak menikmatinya karena disable images. :D

        Menurut Mas Adi, apakah masalah page speed ini bakal banyak penerapnya?

        • http://daniiswara.com/ dani
          using Namoroka 3.6.3 on Arch Linux

          maksudnya, apakah sebegitunya seperti ide Mas Adi, demi memperoleh skor lebih tinggi di page speed? Apakah akan ada banyak pengguna yang seide dengan Mas Adi?

        • http://blog.rismaka.net/ rismaka
          using Firefox 3.6.3 on Windows XP

          @dani
          Saya juga sama dok, agak berat ke space dan bandwidth :( (yg ini lebih pelit lagi)

          Jadi mulai sekarang ga perlu disable image lagi kalo ke rismaka.NET mas :)

          Menurut saya, jika seorang narablog benar2 berorientasi pada peringkat hasil di SEO, terlebih SEO adalah agama ke-2nya maka ia pasti akan menerapkan kecepatan ini mas.

          Jika penerapan ini memudahkan pengguna utk mendapatkan informasi tanpa mengorbankan aksesibilitas dan kebergunaan, saya rasa ini sah-sah saja, dan patut ditiru. Lain halnya jika penerapannya kebablasan, menghalalkan segala cara hanya utk Speed :lol:

  • http://www.masedi.net MasEDI Belajar Ngeblog
    using Firefox 3.6.3 on Windows XP

    Sebagai penganut aliran “sempalan” SEO, saya menyatakan diri untuk mengikuti jejak langkah mas Rismaka… hehehew :D

    nice info Om

    Salam kenal yach :smile:

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      @MasEDI Belajar Ngeblog,
      Saya dukung mas. Terapkan pada blog untuk kecepatan, aksesibilitas, dan usabilitas yang lebih baik :)

  • http://www.planet-orange.org Planet Orange
    using Firefox 3.6.3 on Windows 7

    Saya termasuk orang yang berkunjung ke blog orang lain utk mencari informasi, mungkin kl di persentasekan 60% untuk mencari informasi, dan 40% untuk silaturahmi… jadi saya gak bgitu peduli dengan gravatar mas… emang beberapa minggu belakangan ini saya memperhatikan load blog saya agak lama dari biasanya, dan saya perhatikan ” nunggu load gravatar ” yang sering freeze, agak percuma jika desain theme blog saya di tujukan utk optimasi akselerasi, tapi malah loadnya lama…. hihihihi :)

    Bgitulah kira2 apa yang ada dibenak saya sekarang mas Ris…

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      @Planet Orange,
      Jadi, kapan neh implementasinya? Saya tunggu ya, biar makin wuzzz wuzz wuzzz :)

  • http://gandamanurung.com ganda
    using Firefox 3.5.9 on Windows XP

    Takkan saya matikan fitur Gravatar ini. :D

    • http://blog.rismaka.net/ rismaka
      using Firefox 3.6.3 on Windows XP

      @ganda,
      Kita lihat saja :D

      • http://gandamanurung.com ganda
        using Google Chrome Frame 4.0 on Windows XP

        heehehe.. Why not, SmashingMagazine is lot slower than mine. :D Saya bukan blogger yang tergantung dengan SEO-SEO dan segala macamnya. Kenapa harus membiarkan Search Engine mengatur segalanya? hehehehehe

        • http://blog.rismaka.net/ rismaka
          using Firefox 3.6.3 on Windows XP

          @ganda,
          Kecepatan ini tidak terlalu diperuntukkan untuk SEO-SEO-an, tapi lebih kepada aksesibilitas dan kemudahan bagi pengguna miskin bandwidth

          • http://gandamanurung.com ganda
            using Google Chrome Frame 4.0 on Windows XP

            Okelah kalau begitu. :D Walau sebenarnya untuk gambar, masih tetap bisa di nonaktifkan via browsernya. Saya malah lebih senang berselancar via Dillo browser. :D Ringan dan cepat. :D Sebab browser ini tidak meload CSS dan gambar.

    • http://galerikata.com Bang Dje
      using Firefox 3.6.3 on Windows XP

      Setuju Mas Ganda. Saya juga tidak akan mematikan fitur gravatar karena memang tidak tahu caranya. :(

      • http://gandamanurung.com ganda
        using Google Chrome Frame 4.0 on Windows XP

        dari dashboard admin mas, coba klik menu discussion(kalau tidak salah, saya tidak sedang online di dashboard wp).

  • http://www.bambangoke.com/ BambangOke @Download Software
    using Firefox 3.6.3 on Windows 7

    Wah manteb optimasi speednya,..
    Blog saya masih mentok di 80,..

    Soalnya susah untuk compress css dt thesis themenya