Tips Tingkatkan Kelajuan Blog
Size optimum sebuah webpage mesti tak lebih dari 3MB bergantung kepada kegunaan page tersebut. Dan masa optimum memuat sesebuah page adalah lebih kurang 2 saat juga bergantung kepada kegunaan page tersebut. So, dalam entri ini NoxAsch nak kongsikan beberapa tips untuk lajukan loading page korang dalam kata lain nak kurangkan masa loading webpage atau blog. Blog pon salah satu jenis website jugak. Jadi boleh digunakan jugak lah.
1. Optimumkan penggunaan gambar CSS sprite
CSS sprite adalah gambar keseluruhan semasa hover mouse dan biasa dalam satu gambar. macam custom widget social media Noxasch. Dengan menggunakan sprite, imej cuma akan dilmuat sekali berbanding menggunakan satu imej untuk setiap ikon. Sebagai contoh :
2. Kurangkan penggunaan widget dan plugin yang tidak diperlukan
Contoh widget yan tak bermanfaat seperti "widget ikan koi dalam blogger". Kalau ada widget yang korang rasa tak guna dan tak begitu diperlukan lagi, remove widget tu sebab widget ni akan load javascript lain, css dan sebagainya. Semua ni akan beratkan lagi blog korang sebab widget ni akan muncul di setiap page.
3. Matikan permintaan CSS dari blogger (untuk pengguna Custom Template)
Secara default, blogger akan muatkan CSS dorang sekali dalam setiap blog. Tapi kalau korang guna Custom Template, CSS ni takda fungsi lansung dan cuma akan beratkan lagi webpage korang.
contohnya kalau korang view source ada benda ni :
1. https://www.blogger.com/static/v1/widgets/1535467126-widget_css_2_bundle.css
2. https://www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css
Jadi untuk buang CSS ni, korang boleh tengok tutorial ni.
4. Manfaatkan sepenuhnya HTML5 dan CSS3
Gunakan styling dalam CSS3 yang baru untuk corakkan page korang. Contoh, macam blog ni, Noxasch
style-kan guna CSS tanpa penggunaan imej. Nanti Noxasch akan kongsikan ciri baru HTML5 dan CSS3.
HTML5 dan CSS3 masih baru lagi diiktiraf oleh World Wide Web Consortium (W3C)
5. Kurangkan ruangan iklan
Ruangan iklan yang berlebihan akan menambah beban kepada page kerana kebanyakkan ruangan iklan akan menambah http request dari luar menggunakan javascript. Dengan mengurankan ruangakn iklan pada page, korang boleh optimumkan loading time dan meningkatkan persaingan untuk mendapatkan ruang iklan.
kurang ruang iklan = banyak persaingan
banyak persaingan = harga ruang iklan lebih tinggi
6. Mampatkan saiz gambar tanpa mengurangkan kualiti
Kalau korang guna photoshop untuk hasilkan imej, pastikan korang save menggunakan option save for web and devices untuk simpan imej tersebut dalam format jpeg, png atau gif.
Selepas tu korang boleh gunakan servis ysmush.it dari Yahoo! untuk compress (memampat) saiz imej tanpa pengurangan kualiti.
7. Awasi kelajuan loading blog
Korang boleh tengok kelajuan pageload dengan menggunakan servis-servis berikut :
8. Pindahkan JavaScript ke lokasi paling bawah dalam Template
Secara "default" skrip java atau "Javascript" akan berada di kedudukan paling atas atau di dalam section
<head>...</head>. Ini akan melambatkan "page load" dan pengguna terpaksa menunggu skrip tersebut dimuat sebelum keseluruhan page.
Oleh itu, ia adalah satu amalan yang baik atau "best practice" untuk pindahkan skrip-skrip tersebut
ke bawah template atau dokumen HTML. Iaitu sebelum penutup </body> tag.
contoh :
</footer>
<script src='http://test.js'></script>
</body>
</html>
9. Kurangkan penggunaan tulisan grafik atau "text graphic"
Penggunaan "text graphic" akan menambah berat page berbanding penggunaan font-style melalui CSS.
Dengan mengurangkan penggunaan text graphic seperti "glittering text" dan seumpamanya dapat
mengurangkan saiz page dan meningkatkan kelajuan page loading. Lepastu korang buat heading untuk
setiap post.
contohnya text macam ni :
So, apa pendapat korang ? Tinggalkan komen dan kalau suka boleh share.
( Setiap posting di blog ni adalah di bawah Creative Common License 4.0, boleh copy & paste tapi mesti di nyatakan link dan dikreditkan kepada penulis asal )
