Cara Meningkatkan Skor Gtmetrix Sampai 100%
June 27, 2018
Cara mendapatkan Skor di atas 90% atau bahkan 100 Di GTmetrix. OKe semuanya Kali ini aku akan membahas Tentang bagaimana cara mendapatkan skor 100 pada GTmetrix.com.
Kecepatan pada sebuah website harus Di perhatikan, Karena sangat besar lengan berkuasa pada Kenyamanan pengguna.. Jika blog anda lambat yang ada para pengunjung akan kabur alasannya yakni tidak betah menunggu..
Untuk aku mencoba menciptakan artikel ihwal Kecepatan Di GTmetrix..
Sebenarnya ini bukan murni Pemikiran Saya, Tetapi aku akan mencoba merangkum banyak sekali Cara atau tutorial pada GTmetrix ini..
Untuk Skor GTmetrix Saya Sendiri Ya terbilang Lumayan Lah.. Anda sanggup melihat skor Pada blog aku Lewat link berikut ini.. https://gtmetrix.com/reports/www.furikode.xyz/7fKJX5ZV
Nah gimana? Tertarik Untuk mencoba tutorial tutorial berikut ini untuk mendapatkan Skor Seperti pada Template yang aku pakai?
GTMetrix yakni salah satu tool untuk mengecek kecepatan website yang paling populer dan paling banyak digunakan selain Pingdom .
Jika Dibandingkan dengan tool developer lainnya, GTMetrix cukup gampang digunakan dan pemula juga sanggup dengan gampang mempelajarinya.
Mereka memakai kombinasi antara Google PageSpeed Insights dan YSlow untuk menghasilkan nilai dan rekomendasinya..
Dikarenakan ukurannya cukup besar, Kaprikornus 3 Script itu aku hosting diluar. Masing masingnya aku host di :
Sebab browser akan meminta ke tempat-tempat yang berbeda dan memakan waktu lama untuk mendapatkan respons dari DNS masing-masing script.,
Kode Tersebut mempunyai banyak sekali jarak jarak. Maka untuk meminifi nya ada hanya perlu menghapus jarak tersebut sehingga balasannya menyerupai ini :
Sangat gampang bukan.. Jika ingin klarifikasi yang lebih men detail silahkan Simak di artikel Minify HTML ,CSS ,Dan JavaScript
Saat mengakses blog aku lewat Komputer/laptop maka url blog aku yakni ZeZeDroid.com ,
Tapi ketika dicoba diakses melalui handphone maka link website akan berubah otomatis menjadi ZezeDroid.com/?m=1.
Kenapa sanggup gitu? alasannya yakni blog mendeteksi sedang diakses memakai Handphone
Contoh lain, contohnya nih kini blog anda homepagenya berbentuk statis, dengan kata lain mempunyai laman tersendiri ketika pengunjung berada di home page anda.
Mungkin Halaman yang berisikan Kalimat2 sapaan atau Logo dari website yang dimiliki atau sebagainya
Dan yang menjadi persoalan juga banyak tutorial yang beretebaran di internet menciptakan homePage static memakai redirect..
Contoh Saya mempunyai halaman zezedroid.com/p/sitemap.html . Maka link dari zezedroid.com akan dialihkan Halaman Tadi
itulah yan biasa disebut dengan redirect ..
..sebuah link/URL yang dialihkan, Seperti dari Link A dialihkan Ke link B, Padahal yang kita mau buka yakni Link A
Tanpa disadari redirect ini sanggup menjadikan loading pada blog menjadi lambat. Mengapa? alasannya yakni blog akan merequest 2 kali. yaitu ke dan Ke b.
Untuk Mengatasinya Bisa simak Di Artikel yang satu ini Mengatasi Avoid Landing Page Redirect.
Serve Scaled images terjadi akhir Gambar pada blog, sehingga blog pun menjadi Lambat untuk memuat..
Sebagai rujukan sedikit.. Anda mempunyai gambar yang ukurannya 350 x 350 px Sementara gambar tersebut hanya di tampilkan sebesar 100 x 100 px .
Baca Juga : Cara riset keyword tanpa tools
Hal tersebut tentu saja membuang buang kuota untuk mendownload gambar tersebut alasannya yakni ukurannya menjadi besar..
Untuk mengatasinya sangatlah mudah, Anda hanya perlu mencari Link gambar yang ukurannya menjadi masalah.
Seperti pada gambar, Jika sudah ketemu maka tinggal ubah saja ukuran Gambar tersebut.
Masalah ini muncul ketika gambar mempunyai Ukuran yang terlalu besar.. Sehingga menciptakan blog menjadi berat..
Untuk mengatasi optimize image ini ada 3 cara Yaitu
Bisa Dilihat Gambar Yang mempunyai Ekstensi PNG Memiliki ukuran lebih kecil dari pada PNG Dan JPG. Kaprikornus Usahakan memakai Gambar ber ekstensi PNG ya..
Dan alasan untuk mengubah ekstensi adalah
Untuk yang kedua ini Cukup simple alasannya yakni anda hanya tinggal megupload gambar pada web web pengompress secara online
Namun tentu efek samping nya kualitas menjadi sedikit menurun.. Beberapa web yang sanggup mengomoress antara lain
Jika sudah maka ubah menjadi menyerupai ini
Gambarannya menyerupai ini..
Saat anda membuka blog saya. Maka browser akan mendownload /script/abcd.js. Lalu anda keluar dari website saya, Setelah beberapa ketika anda mengunjungi kembali website saya..
Baca Juga : Cara menerima skor 100 di PageSpeed insight
Tetapi Anda harus mendownload kembali /script/abcd.js, Padahal kan tadi sudah..
Itulah yang dinamakan dengan Leverage caching browser.. Anda kharu mendownload ulang script yang tadi sudah di download..
Jika hal menyerupai itu terjadi tentu menciptakan boros waktu dan kuota internet
Untuk persoalan yang satu ini tergolong Mendapatkan prioritas tinggi.. Kaprikornus jangan heran ya kalau kalian mendapatkan persoalan menyerupai ini..
Add expires header ini berkaitan dengan Gambar, Script css, dan juga JavaScript.. Kaprikornus ketika anda membuka suatu website niscaya browser akan mendownload Bagian dari web itu..
Kecepatan pada sebuah website harus Di perhatikan, Karena sangat besar lengan berkuasa pada Kenyamanan pengguna.. Jika blog anda lambat yang ada para pengunjung akan kabur alasannya yakni tidak betah menunggu..
Untuk aku mencoba menciptakan artikel ihwal Kecepatan Di GTmetrix..
Sebenarnya ini bukan murni Pemikiran Saya, Tetapi aku akan mencoba merangkum banyak sekali Cara atau tutorial pada GTmetrix ini..
Untuk Skor GTmetrix Saya Sendiri Ya terbilang Lumayan Lah.. Anda sanggup melihat skor Pada blog aku Lewat link berikut ini.. https://gtmetrix.com/reports/www.furikode.xyz/7fKJX5ZV
Nah gimana? Tertarik Untuk mencoba tutorial tutorial berikut ini untuk mendapatkan Skor Seperti pada Template yang aku pakai?
Apa Itu GTmetrix ?
GTMetrix yakni salah satu tool untuk mengecek kecepatan website yang paling populer dan paling banyak digunakan selain Pingdom .
Jika Dibandingkan dengan tool developer lainnya, GTMetrix cukup gampang digunakan dan pemula juga sanggup dengan gampang mempelajarinya.
Mereka memakai kombinasi antara Google PageSpeed Insights dan YSlow untuk menghasilkan nilai dan rekomendasinya..
Bagaimana Cara mendapatkan Skor 100 Di GTmetrix ?
Oke, Saya tidak mengambil semua persoalan yang ada di GTmetrix, Melainkan Hanya beberapa saja, Kenapa hanya beberapa?
Karena setiap aku nyoba nyoba template niscaya persoalan yang muncul sama Saja yang itu itu saja. Kaprikornus aku akan mengambil persoalan Yang Paling umum Saja..
Masalah Masalah Itu antara Lain yakni :
Oke Sebelum Lebih lanjut aku ingin memberi tau terlebih dahulu, bahwa aku tidak menjamin sanggup seratus.
Sebab ada beberapa template yang memang tidak sanggup di edit semoga 100, Mengapa? Karena ada template template yang ketika di coba semoga kecepatan naik namun template tersebut sanggup berubah..
Ntah itu bentuk nya jadi acak acakan Atau beberapa fitur dari template itu jadi tidak berfungsi.. So Sesuaikan saja dengan template anda Dan satu Lagi..
BACKUP TERLEBIH DAHULU TEMPLATE ANDA.
BACKUP TERLEBIH DAHULU TEMPLATE ANDA.
Oke Langsung saja masuk ke yang pertama..
1. Reduce DNS Looksup
Reduce DNS Lookups, sanggup juga dikatakan sebagai mengurangi pencarian DNS merupakan sebuah persoalan loading blog pada GTmetrix kepingan YSlow.
Singkatnya, pada permasalahan ini GTmetrix yang memerintahkan kita untuk mengurangi script-script eksternal yang dihosting pada tempat-tempat yang berbeda.
Contohnya menyerupai ini. Anda mengakses sebuah blog, dan di blog tersebut terdapat banyak script yang dihosting diluar atau eksternal.
Untuk lebih jelasnya silakan lihat gambar dibawah:
Sudah lihat? Pada ilustrasi di atas blog aku mempunyai 3 Macam script JS yang ingin di masukkan ke blog.
Untuk lebih jelasnya silakan lihat gambar dibawah:
Sudah lihat? Pada ilustrasi di atas blog aku mempunyai 3 Macam script JS yang ingin di masukkan ke blog.
Dikarenakan ukurannya cukup besar, Kaprikornus 3 Script itu aku hosting diluar. Masing masingnya aku host di :
- Your JavaScript
- Github
- Google Drive
- Wordpress Self Host
Tanpa disadari, Menaruh script dihost yang berbeda menyerupai ini sanggup menjadikan loading blog lambat,
Sebab browser akan meminta ke tempat-tempat yang berbeda dan memakan waktu lama untuk mendapatkan respons dari DNS masing-masing script.,
Untuk Solusinya Sendiri Kalian Bisa melihat pada artikel Mengatasi Reduce DNS Looksup
2. Minify HTML, CSS, Dan ,JS
Masalah ini muncul ketika Script script HTML CSS DAN JS Masih sanggup di perkecil ukurannya..
Jadi Misalkan Ada Script menyerupai ini :
<script type='text/javascript'> var obj0=document.getElementById("post1 <data:post.id/>"); var obj1=document.getElementById("post2 <data:post.id/>"); var s=obj1.innerHTML; var t=s.substr(0,s.length/2); var r=t.lastIndexOf("<br>"); if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);} </script>
Kode Tersebut mempunyai banyak sekali jarak jarak. Maka untuk meminifi nya ada hanya perlu menghapus jarak tersebut sehingga balasannya menyerupai ini :
<script type='text/javascript'> var obj0=document.getElementById("post1<data:post.id/>"); var obj1=document.getElementById("post2<data:post.id/>"); var s=obj1.innerHTML; var t=s.substr(0,s.length/2); var r=t.lastIndexOf("<br>"); if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);} </script>
Sangat gampang bukan.. Jika ingin klarifikasi yang lebih men detail silahkan Simak di artikel Minify HTML ,CSS ,Dan JavaScript
3. Avoid Landing Page Redirect
Saat mengakses blog aku lewat Komputer/laptop maka url blog aku yakni ZeZeDroid.com ,
Tapi ketika dicoba diakses melalui handphone maka link website akan berubah otomatis menjadi ZezeDroid.com/?m=1.
Kenapa sanggup gitu? alasannya yakni blog mendeteksi sedang diakses memakai Handphone
Contoh lain, contohnya nih kini blog anda homepagenya berbentuk statis, dengan kata lain mempunyai laman tersendiri ketika pengunjung berada di home page anda.
Mungkin Halaman yang berisikan Kalimat2 sapaan atau Logo dari website yang dimiliki atau sebagainya
Dan yang menjadi persoalan juga banyak tutorial yang beretebaran di internet menciptakan homePage static memakai redirect..
Contoh Saya mempunyai halaman zezedroid.com/p/sitemap.html . Maka link dari zezedroid.com akan dialihkan Halaman Tadi
itulah yan biasa disebut dengan redirect ..
..sebuah link/URL yang dialihkan, Seperti dari Link A dialihkan Ke link B, Padahal yang kita mau buka yakni Link A
Tanpa disadari redirect ini sanggup menjadikan loading pada blog menjadi lambat. Mengapa? alasannya yakni blog akan merequest 2 kali. yaitu ke dan Ke b.
Untuk Mengatasinya Bisa simak Di Artikel yang satu ini Mengatasi Avoid Landing Page Redirect.
4. Serve Scaled Images
Serve Scaled images terjadi akhir Gambar pada blog, sehingga blog pun menjadi Lambat untuk memuat..
Sebagai rujukan sedikit.. Anda mempunyai gambar yang ukurannya 350 x 350 px Sementara gambar tersebut hanya di tampilkan sebesar 100 x 100 px .
Baca Juga : Cara riset keyword tanpa tools
Hal tersebut tentu saja membuang buang kuota untuk mendownload gambar tersebut alasannya yakni ukurannya menjadi besar..
Untuk mengatasinya sangatlah mudah, Anda hanya perlu mencari Link gambar yang ukurannya menjadi masalah.
Seperti pada gambar, Jika sudah ketemu maka tinggal ubah saja ukuran Gambar tersebut.
5. Optimize Image
Masalah ini muncul ketika gambar mempunyai Ukuran yang terlalu besar.. Sehingga menciptakan blog menjadi berat..
Untuk mengatasi optimize image ini ada 3 cara Yaitu
- Mengubah ekstensi Gambar
- Mengompress Gambar
- Menghapus Snippet count
Bisa Dilihat Gambar Yang mempunyai Ekstensi PNG Memiliki ukuran lebih kecil dari pada PNG Dan JPG. Kaprikornus Usahakan memakai Gambar ber ekstensi PNG ya..
Dan alasan untuk mengubah ekstensi adalah
- Ukuran Lebih kecil
- Tetap jernih kalau di zoom
- Bisa di kompres tanpa mengurangi kualitas
Untuk yang kedua ini Cukup simple alasannya yakni anda hanya tinggal megupload gambar pada web web pengompress secara online
Namun tentu efek samping nya kualitas menjadi sedikit menurun.. Beberapa web yang sanggup mengomoress antara lain
- compresspng.com (Untuk Gambar Ekstensi PNG)
- compressjpeg.com (Untuk Gambar Ekstensi JPEG)
- gifcompressor.com (Untuk Gambar Ekstensi GIF)
5.3. Menghapus snippet count
Cari aba-aba berikut ini atau yang menyerupai mirip ini Pada Template Blog anda
<div expr:id='"summary" + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSnippet("summary<data:post.id/>");</script>
Jika sudah maka ubah menjadi menyerupai ini
<div class='snippets'><data:post.snippet/></div>
6. Leverage Caching Browser
Leverage Browser Caching atau dalam bahasa Indonesianya memanfaatkan penyimpanan cache browser .
Terjadi Sebab ada satu/lebih sumber daya yang tidak digunakan oleh si pengguna pemilik browser
Gambarannya menyerupai ini..
Saat anda membuka blog saya. Maka browser akan mendownload /script/abcd.js. Lalu anda keluar dari website saya, Setelah beberapa ketika anda mengunjungi kembali website saya..
Baca Juga : Cara menerima skor 100 di PageSpeed insight
Tetapi Anda harus mendownload kembali /script/abcd.js, Padahal kan tadi sudah..
Itulah yang dinamakan dengan Leverage caching browser.. Anda kharu mendownload ulang script yang tadi sudah di download..
Jika hal menyerupai itu terjadi tentu menciptakan boros waktu dan kuota internet
Untuk penjelasannya Secara Detail Silakan Lihat Mengatasi Leverage Caching Browser
7. Add Expires Header
Untuk yang terakhir ini terbilang Yang paling sulit dari yang sebelum sebelum nya..
Expires header sendiri yakni suatu permasalahan yang terjadi Pada sebuah blog, Yang penyebabnya yakni penggunaan cache yang kurang maksimal.
Untuk persoalan yang satu ini tergolong Mendapatkan prioritas tinggi.. Kaprikornus jangan heran ya kalau kalian mendapatkan persoalan menyerupai ini..
Add expires header ini berkaitan dengan Gambar, Script css, dan juga JavaScript.. Kaprikornus ketika anda membuka suatu website niscaya browser akan mendownload Bagian dari web itu..
Jika tidak memakai expires header ketika anda berkunjung kembali ke website yang sama makan anda tidak perlu mendownloadnya kembali..
Tetapi Jika memakai expires header maka anda tidak perlu mendownload lagi kepingan bagian dari website tersebut alasannya yakni sudah tersimpan.
Karena Penjelasannya Panjang jadi Sudah dipisah dan silahkan dibaca cara untuk mengatasi nya.. Cara mengatasi add expires Header.
Penutup
Nah itulah Artikel ihwal Mendapatkan Skor 100 Di GTmetrix .. Memang itu tidak gampang dan aku sendiri belum sanggup melaksanakan semuanya..
Seperti yang aku bilang, Artikel artikel tersebut aku kumpulkan dari banyak sekali sumber dan beberapa saja yang terapkan sendiri..
Okelah semoga artikel ini berguna, Saya simpulan salam..