Mempercepat Loading Blog Blogspot

Lamanya loading suatu blog bisa dipengaruhi oleh 3 hal, yaitu:

Kemampuan server,Koneksi pengunjung, ukuran desain halaman yang dibuka oleh browser

Adapun cara terbaik untuk mempercepat loading blog adalah dengan membuat blog yang seringan mungkin. Semakin banyak komponen, dan semakin besar ukuran setiap komponen penyusun halaman, maka akan semakin lama waktu muat dari blog anda.

Singkat kata blog dengan desain warna putih dan tulisan apa adanya akan terbuka dengan sangat mudah. Yang menjadi masalah adalah; sangat sedikit orang yang ingin membuat blog yang apa adanya seperti itu.

Sekali lagi perlu diingatkan bahwa tips di bawah ini dibuat dengan asumsi bahwa kecepatan koneksi pengguna, dan kemampuan server yang mengakomodir blog kita tidak bermasalah. Tips di bawah ini juga dibatasi untuk pemakai blogspot saja. Untuk pengguna blog atau website yang self hosted, tentu lebih banyak opsi yang bisa ditempuh.

1.      Mempercepat waktu loading dengan memastikan semua style sheet berada pada head section

Dengan melakukan ini anda bisa membuat browser melakukan render dengan sangat cepat untuk setiap pengaturan style setiap komponen di dalam halaman tersebut.  Pengaturan style pada body bisa membuat render lebih lambat, atau bahkan jika style sheet ditaruh di bagian bawah halaman, bisa berakibat errornya tampilan, karena browser memblokir proses render untuk mencegah penataan ulang elemen jika style berubah.

2.      Cara Mempercepat Loading Blog Dengan Mengurangi HTTP Request

Dengan membuat komponen blog seminimal mungkin. Untuk setiap komponen yang ada browser akan melakukan request yang memakan waktu loading.

Seumpamanya seperti ini, anda membutuhkan 300 barang dari sebuah supermarket, sedangkan sekali jalan pembantu anda cuma bisa membawa 30 barang. Itu berarti pembantu anda harus bolak balik sebanyak 10 kali untuk membawa semua barang. Seandainya anda hanya memesan 100 barang saja.... pasti pembantu bisa menyelesaikan pesanan anda dalam waktu yang jauh lebih singkat.

3.      Cara Mempercepat Loading Blog Dengan Memperkecil Ukuran Gambar

Ukuran gambar yang dimaksud di sini bisa dalam pixel maupun dalam kb. Jadi anda bisa mempekecil persentase pixels gambar dan menguploadnya atau sekedar menurunkan kualitas gambar dengan ukuran dimensi yang tetap (gambar jadi agak blur sedikit). Kedua teknik ini akan mengurangi ukuran file gambar.

4.      Mempercepat Loading Blog Dengan Melakukan CSS Image Sprites

Teknik ini adalah menggabungkan beberapa gambar dalam satu gambar dan membagi satu gambar itu dalam banyak area. Jadi dalam satu gambar bisa disuntikkan banyak link, yang mana sebelumnya dalam satu gambar cuma bisa ada satu link.

Image Sprites bisa digunakan dalam background, ataupun navigasi yang menggunakan gambar berederet.Penggunaan image sprites bisa mengurangi http request yang ada pada gambar di atas, karena yang sebelumnya harus meloading banyak gambar sekarang hanya perlu mendownload satu gambar. Ukuran bobot gambar bisa saja tidak berkurang, tapi berkurangnya http request yang mempercepat waktu loading blog anda.

5.      Mempercepat waktu loading dengan menggabungkan beberapa file

Misalnya blog anda memakai beberapa file style sheet, jika anda bisa menggabungkan beberapa file tersebut dalam satu file style sheet, dengan demikian kita bisa mengurangi http request. Teknik ini juga berlaku untuk script. Anda bisa menggabungkan beberapa script dalam satu file.... sehingga browser hanya sekali saja meloading semua script.

6.      Mempercepat waktu loading dengan menaruh script pada bagian akhir halaman blog.

Berbeda dengan style sheet, script justru akan lebih baik jika ditaruh di bagian akhir dari halaman. Kenapa? Karena browser akan memblokir proses loading dari elemen halaman lain jika script ditaruh di antara elemen. Dengan menaruh script pada bagian akhir halaman, maka semua komponen sudah selesai dimuat saat browser akan mulai melakukan script loading.

Yang menjadi masalah adalah tidak semua script bisa ditaruh pada bagian bawah dokumen. Script yang berfungsi untuk memanggil elemen halaman, harus ditaruh pada posisi yang diinginkan. Untuk itulah beberapa pengembang mulai menggunakan script asinkron, sehingga halaman bisa tetap melanjutkan proses loading tanpa harus menunggu tuntasnya script asinkron.

7.      Hindari CSS Expression

Apa yang dimaksud dengan CSS expression? CSS ini digunakan jika anda ingin membuat CSS yang dinamis. Misalnya membuat tampilan warna background berubah setiap jamnya. CSS expression ini bisa membuat browser menganalisa halaman berulang kali. Bayangkan saja, hanya dengan mengayunkan pointer mouse menyeberangi halaman, browser anda bisa menganalisa halaman hingga ribuan kali. Jadi sebaiknya hindari atau gunakan one time expression untuk mengurangi intensitas kalkulasi yang dilakukan browser anda.

 

8.      Anda bisa mempercepat waktu loading blog dengan menggunakan CSS dan Javascript eksternal

Tujuan utama dari menggunakan CSS dan javascript external dan bukannya inline adalah untuk memanfaatkan cache oleh browser. Dengan menggunakan eksternal css dan javascript, maka browser akan melakukan cache sehingga browser tidak perlu lagi melakukan loading saat pengunjung ingin membuka halaman ini berkali-kali.

9.      loading blog bisa semakin cepat jika komponen yang berat dihapus

Pada saat anda memuat halaman blog anda coba perhatikan log proses yang ditampilkan di bagian bawah jendela browser. Biasanya di situ akan diperlihatkan komponen apa yang sedang berusaha dimuat oleh halaman blog anda. Jika ada komponen yang menurut anda terlalu lama, maka anda punya 2 pilihan; apakah menghapusnya atau menggantinya dengan elemen serupa dari sumber yang lain

10. Kompresi CSS dan Javascript bisa mengurangi waktu loading dari blog anda....

Anda bisa melakukan kompresi pada style sheet ataupun pada script untuk mempercepat loading blog anda. Anda tidak perlu melakukan ini secara manual, karena saat ini sudah sangat banyak tools yang bisa anda pakai. Jika anda ingin melakukan kompresi pada CSS silahkan kunjungi http://www.csscompressor.com/. Dan jika anda ingin melakukan kompresi pada javascript bisa memakai alat dari http://javascriptcompressor.com/ . Selain itu pastikan tidak ada javascript yang identik, jika ada maka hapus salah satunya....

11. Optimisasi Gambar Untuk Menambah Kecepatan Loading Blog

Untuk mengelola gambar sendiri ada beberapa hal tambahan yang harus menjadi perhatian anda....:

1. Hindari src gambar yang kosong seperti src="" ini akan sangat merugikan performa blog anda
2. Hindari penggunaan skala pada gambar. Misalnya anda ingin menampilkan gambar dengan ukuran 400x300 pixels, maka sebaiknya gambar itu memang dibuat dalam ukuran demikian. Jangan mengupload gambar dengan ukuran 1200 x 800 pixels kemudian anda atur dengan fungsi width dan height menjadi 400 x 300 pixels
3. Yang cukup sulit adalah memastikan gambar dan komponen statis lainnya bernilai di bawah 25kb. Saya juga selalu melanggar batas ini.... ^_^
4. Kalau gambarnya sama, maka pastikan URL juga sama persis. Jangan mengupload gambar yang sama berulangkali sehingga setiap gambar punya URL berbeda. Kalau gambar sudah diupload sekali itu sudah cukup. Silahkan ambil URL gambar tersebut untuk dipakai berkali-kali

12. Hindari tanda kueri dari komponen statis.

Yang dimaksud dengan tanda kueri itu adalah tanda "?" pada URL komponen. Jika anda menggunakan suatu komponen yang statis, maka sebaiknya URL juga bersifat statis.