Panduan Lengkap: Cara lajukan WordPress Website (2018)

Sebelum anda baca post ini dengan lebih tekun,  mungkin ada di antara anda ingin tahu definasi website yang laju.

Website yang laju bagi saya adalah website yang boleh fully load kurang dari 3 saat. Cara nak test kelajuan? Boleh check di Pingdom, GTMetrix, dan KeyCDN Speed Tools

Tiada kata istilah yang tool mane paling baik..cuba amik purata dikalangan semua tue.. dan beranggapan pekiraan tersebut adalah kelajuan page tersebut.

Sekiranya anda ada apa-apa persoalan, tinggalkan komen anda ya.. jangan spam cukuplah. 

Ok..selamat membaca

More...

AFFILIATE DISCLAIMER:

​Ada di antara link di dalam page atau website ini adalah link affiliate saya. Saya akan menerima sedikit komisen sekiranya anda membeli melalui link tersebut dan tidak ada caj tambahan kepada anda yang menggunakan link ini. 

Saya mencadangkan sumber-sumber ini kerana ianya melalui kajian atau saya sendiri menggunakannya. Komisen ini membolehkan saya terus menulis lebih banyak artikel di blog ini. πŸ™‚

1. Optimasi Imej 

Pekara pertama saya fikir bila nak lajukan website adalah optimasi imej. Kenapa bukan hosting? Hakikatnya masih tidak ramai yang mampu beli pakej hosting yang mempunyai server hosting yang berkelajuan tinggi disebabkan kos rata-ratanya cecah RM100-400 sebulan, tetapi yang pasti hampir 100% website mempunyai pelbagai jenis dan saiz imej. 

Oleh itu, optimasi sepatutnya merupakan pekara yang anda perlu tekankan sekiranya anda hendak lajukan website anda.  

Berikut adalah beberapa pekara yang anda boleh lakukan supaya website anda tidak lagi berat seperti sebelumnya. 

1.1 Optimasi Imej Sebelum Upload

Cara ini adalah paling selamat untuk mengelakan Page website anda tersebut berat. Rata-rata pemilik website upload imej yang mempunyai saiz fail yang agak besar seperti melebih 1Mb. Imej saiz yang saya cadangkan adalah sekecil 100kb ke bawah, lagi kecil lagi bagus.. ada yang hanya 10kb saje.

Bagaimana pula bagi website Photographer? Saranan saya adalah menggunakan teknik lightbox. Maksudnya sekiranya seseorang tue berminat dengan imej tersebut die hendaklah klik imej dan Popup Imej saiz yang lebih besar boleh ditunjukan. Dengan cara ini, imej tersebut tidak perlu upload serentak semasa website tersebut loading di browser anda.

Contoh:

Klik Imej di bawah ini: 

saiz fail: 5.9 kb

1.1.1 Kraken.io

Bagaimana saya boleh dapatkan file sekecil 5.9kb ini. Dimensi imej ini hanya lah 300x200 pixel sahaja. Dimensi sebenar imej ini adalah 2048x1367pixel, (89.9kb) saya kecilkan saiz mengunakan software seperti Adobe Photoshop atau Adobe Illustrator. 

Untuk contoh di atas ini saya sengaja pilih dimensi 300x200 pixel iaitu mempunyai saiz fail 30.7kb , ikut keperluan website anda,(nanti saya ceritakan dalam poin seterusnya).

Selepas itu saya menggunakan software cloud Kraken.io untuk compress (mengecilkan) fail imej ini lagi tanpa hilang kualiti asal imej tersebut. Dengan cara ini saya berjaya menjimatkan 80.67% dari saiz sebelum ini. 

Kraken.io ini adalah percuma. Limit saiz yang boleh compress adalah bawah 1Mb.  Untuk saiz yang lebih besar, anda perlukan PRO plan yang bermula daripada $5/sebulan. 

1.1.2 Gunakan Google Page Speed Insight Tool

Walaupun ramai tau pasal Google Page Speed Insight, tapi tidak ramai tahu mengenai tips saya nak kongsikan ini. 

Untuk ni saya buat PageSpeed test di satu page Majalaniaga iaitu post http://www.majalahniaga.com/6-tips-kejayaan-dari-pengasas-kfc-colonel-sanders.html. Berikut adalah keputusan  PageSpeed Insight : KLIK SINI

Kemungkinan apa yang anda tengah fokus sekarang hanyalah bahagian Optimization iaitu Medium 71/100

Mungkin anda ada baca rumusan di bawah tetapi berape orang yang perasan pasal ini.. 

Tadaa... Google telah menjimatkan masa anda..

Sekarang ni boleh download terus Imej yang telah disediakan oleh Google dan upload semula di website menggunakan Cpanel atau software FTP yang lain.

Untuk memastikan tidak ada error, sila rujuk Url Imej yang sepatutnya digantikan bahagian Optimize Images. REPLACE Imej baru yang diberi oleh Google

1.2 TinyPNG Plugin 

Plugin ini adalah percuma. Anda boleh download di WP Dashboard anda. Buat carian seperti gambar di bawah ini.

dan pilih Compress JPEG & PNG Images

Anda perlu daftar terlebih dahulu untuk dapatkan API sebelum boleh menggunakan plugin ini. 

Dengan menggunakan plan percuma ini, anda mempunyai kuota 500 imej untuk compress. 

Plugin ini sesuai digunakan untuk kebanyakan blog yang tidak mempunyai banyak imej untuk compress dan blog yang masih baharu. 

Sekiranya anda perlukan plugin yang sesuai untuk kegunaan yang lebih tinggi, anda boleh beli plugin ini. Ianya mempunyai lebih fitur lebih banyak seperti Disable Emojis, Disable self PingbacksRemove query strings dan lain-lain. Harga bermula $19.95 setahun. 

1.3 Saiz Imej yang betul  

Setiap page/post template mempunyai lebar yang berbeza bergantung kepada Theme masing-masing.

Oleh itu, dengan hanya memasukan imej di page/post tidak bermakna ianya telah tepat resize mengikut lebar template tersebut sebaliknya website anda akan tetap reload imej yang bersaiz asal tetapi dikecikan je. Impaknya adalah jumlah masa yang diperlukan untuk load sepenuhnya.

Contoh:

Sekiranya anda page anda hanya boleh memuatkan lebar 800px, adalah lebih baik anda terus resize mengikut yang telah disyorkan oleh Theme . Oleh itu, imej yang bersaiz 1200px akan dikecilkan kepada 800px mengikut nisbah 800:1200 iaitu 67% atau pada kadar 37% pengurangan. Begitu juga dengan ketinggian imej tersebut bagi memastikan imej nampak cantik mengikut skala. 

Selain itu dengan memasukan sekali saiz imej (width & height) di bahagian code embed seperti ini:

<img src="https://domain.com/wp-content/uploads/2018/07/Photo-300x200.jpg" alt="" width="300" height="200" />

akan membantu page ini upload lebih laju. 

2. Cache Plugin 

2.1 Cache Enabler

Cache Enabler adalah plugin caching yang paling saya suka guna mula-mula dulu disebabkan hanya cukup Install saje.. takde setting yang rumit seperti Plugin yang lain. Plugin percuma ni develop oleh KeyCDN. KeyCDN ni antara CDN servis yang saya syorkan.  Berikut adalah setting yang saya gunakan

2.2 WP Rocket

Disebabkan WPRocket ini boleh ganti beberapa plugin seperti Cache Enabler, Browse Caching, Autoptimize , ianya adalah pilihan saya buat masa ini. Disebabkan Setting WP Rocket ini agak panjang, saya akan buat banyak screenshot untuk anda rujuk sekiranya berminat ikut setting saya gunakan. 

Perlu diingat beberapa setting sini akan bertindih dengan beberape plugin terutamanya caching plugin yang lain. Oleh itu, sila buat modifikasi mengikut yang anda lebih gemar gunakan.

2.2.1 Cache
2.2.2 File Optimization
2.2.3 Media
2.2.4 Preload
2.2.5 Advance Rules
2.2.6 Database
2.2.7 CDN

Disebabkan saya menggunakan Cloudflare, saya tak install mana-mana CDN servis. Sekiranya ada yang berminat, probably saya cadang gunadulu Cloudflare (ianya percuma!) .. kalau tidak masih buat page tersebut loading melebihi 3 saat barulah fikirkan untuk install CDN. 

2.2.8 Add On

Saya tak nampak kita tak perlu tak turn ON status Varnish. πŸ™‚ Varnish ni adalah premium servis daripada Cloudflare. 

Untuk menggunakan Cloudflare dengan Wp Rocket ni anda kena dapatkan Global API dan Zone id di Dashboard Cloudflare anda.  

​Gunakan link ini untuk dapatkan API Cloudlfare anda.

2.2.9 Kesimpulan

WP Rocket adalah premium caching plugin perlu anda cuba sekiranya anda mengurangkan jumlah plugin dalam WordPress anda. Tahap perbezaan caching adalah tidak ketara.  

Anda boleh gunakan sahaja plugin percuma yang lain seperti Cache Enabler, W3 Total Cache, WP Super Cache dan WP Fastest Cache.

Menggunakan cache ni ade baik ada buruknya.. baiknya ianya akan membantu web load lebih laju. Keburukannya lak kadang-kadang wp dashboard kita cache sekali. Saya tak pasti sebab ape..tapi ianya menganggu kelancaran nak buat post. 

Pendapat saya, sekiranya anda sudah mempunyai hosting yang laju.. mungkin boleh elak caching. 

3. Autoptimize 

Autoptimize adalah antara plugin yang boleh beri tambah kelajuan website anda serta merta. Anda boleh install dan aktifkan terus dan majoriti website yang baru nak mula speed optimization ni akan nampak perbezaan sebelum dan selepas aktifkannya. 

Walaubagaimanapun, berikut adalah setting Autoptimize untuk bloggerkickstart.

Setting ini adalah set up sebelum saya menggunakan WP Rocket.  Disebabkan ada beberapa setting di WP Rocket ni mempunyai ciri sama, jadi saya utamakan WP Rocket berbanding Autoptimize.

Autoptimize ni mempunyai feature yang baik tetapi terlalu advance bagi sesetengah orang. Oleh itu, setting di atas adalah sesuai untuk kebanyakan website. 

4. Lazy Load Imej /Media 

Konsep Lazyload ini adalah untuk melambatkan Imej (media) load berbanding isi text website tersebut. Oleh itu, pelawat akan dapat baca text terlebih dahulu berbanding full load website yang mungkin menyebabkan pelawat meninggalkan page tersebut. 

Ada beberapa Theme yang dah didatangi dengan feature ini, jadi anda tidak perlu lagi install plugin tambahan kepada WordPress anda. 

Anda boleh guna plugin a3 Lazy Load oleh a3rev Software untuk tambah fungsi lazyload kepada website anda.  Klik sini untuk melihat demo plugin ini untuk Youtube Video. 

5. Cloudflare 

Cloudflare merupakan servis CDN percuma yang anda boleh gunakan bagi meningkatkan website anda. 

Sila tonton video di bawah ini untuk mengetahui bagaimana saya setup Cloudflare untuk website saya sebelum ni 

5.1 Admin WordPress Page Rules.

Berikut adalah Page Rules setting yang biasa saya gunakan untuk Cloudflare.

Antara variasi page rule yang saya gunakan di dalam akaun Cloudflare saya adalah:

  • https://domain-anda.com/*
  • https://domain-anda.com/wp-admin*
  • https://domain-anda.com/wp-login.php*

Sila tonton video di atas sekali lagi sekiranya anda masih tidak tahu bagaimana setting Cloudflare dilakukan. 

UPDATE:

Anda boleh set rule seperti ini juga:

http*//:*domain-anda.com/*

5.2  Speed 

5.2.1 Minify

Walaupun ada optional ini di plugin seperti Autoptimize dan WP Rocket loader, untuk maksima anda Tick kesemua bahagian Auto Monify untuk Javascript, CSS dan HTML

5.2.2 Railgun

Railgun ni optional. Disebabkan Railgun ni adalah percuma untuk Siteground user, jadi saya dapat set kepada ON. 

Sekiranya anda mempunyai masalah nak set ON, saya cadangkan anda aktifkan Cloudflare di Siteground. Selepas itu, sila pastikan di akaun Cloudflare anda dapat akses Railgun ni. 

5.2.3 Brotli

Pastikan Brotli ini set kepada ON dan Rocket Loader ni OFF. 

Saya dapati Rocket Loader ni boleh menyebakan masalah dengan css atau paling teruk website tue sendiri break. Oleh itu saya buat keputusan untuk turn OFF. 

5.3 Hotlink Protection

Sila pastikan anda Hotlink Protection anda set ON

5.4 Disable Admin Toolbar

Sekiranya anda menggunakan Caching plugin atau Cloudflare ni saya cadangkan anda disable Admin Toolbar untuk setiap user terutamanya yang mempunyai akses admin, editor dan sebagainya. Ini adalah untuk mengelakan terutamanya Cloudflare untuk cache Toolbar tersebut. 

5.5 Disable Cloudflare

Saya berpendapat servis Cloudflare perlu disable sekiranya anda tengah develop website atau ada edit post. Saya dapati Cloudflare kadang-kadang menyebabkan konflik dengan post edit sebenar berbanding cache. Oleh itu, adalah lebih baik disable caching di Cloudflare.  Perlu ingat Cloudflare akan turn ON automatik selepas 3 jam. 

6. Plugin 

6.1 Bilangan Plugin

Bagi saya lagi sikit plugin yang install dan aktif dalam WordPress blog anda adalah lagi bagus. Kalau boleh jangan melebihi 25 aktif plugin. Ini pun dah kira banyak. 

Deactivate atau delete sahaja plugin yang tidak diperlukan. 

Sekiranya anda mempunyai plugin yang bertindih fungsi seperti Image Compress, Caching, Social Share .. disarankan Deactivate yang tidak digunakan. 

6.2 Update Plugin

Pastikan anda sentiasa kemaskini plugin anda supaya ianya tidak konflik dengan update terkini WordPress. Selain itu praktis ini adalah amat baik bukan sahaja dari kelajuan bahkan untuk keselamatan website anda dari hackers. 

7. Hosting 

Saya memang jenis yang cerewet sikit bab memilih hosting ini.

Selepas saya memahami keperluan beberapa faktor yang boleh meningkatkan kelajuan website, saya menjadi lebih fokus kepada premium web hosting company iaitu menyediakan beberapa ciri yang saya perlukan seperti HTTP/2 server, PHP 7, SSD dan ,mempunyai server hosting di Malaysia atau terdekat. 

Semasa saya wat kajian mengenai kelajuan web, saya dapat nyatakan beberapa website yang agak menonjol masa tue iaitu, WP Engine, Fly Wheel, WPX Hosting, A2 Hosting, Cloudways,  Siteground & Kinsta. 

Selepas mengambil kira kos dan saranan developer theme saya buat keputusan untuk mengunakan Siteground berbanding hosting lain. Saya akan menerangkan beberapa sebab saya memilih Siteground dan termasuk apa pilihan saya yang kedua iaitu Kinsta

7.1 Siteground

Sebelum saya citer panjang lebar mengenai Siteground ni, nak mention sikit saya memang merupakan Siteground Affiliate. Tetapi review kali ni bukan disebabkan saya affiliate sahaja..tetapi saya sememangnya Siteground subscriber. Saya subscribe Package GoGeek Plan.

Antara sebab saya memilih Siteground

  • HTTP/2 Support . Anda boleh check status HTTP/2 di sini.
  • Mengunakan server yang terkini dan pantas
  • Menggunakan PHP 7. 
  • Integrate dengan Cloudflare dengan mudah di Dashboard Siteground
  • Percuma Railgun Cloudflare! (harga sebenar $200/sebulan di Cloudflare)
  • Tip top support. Ada live chat support serta support yang pantas. 24 jam sehari. 
  • Percuma Let's Encrypt SSL. Klik dan activate sahaja. 
  • Server uptime yang tinggi iaitu 99.99%. Setakat saya guna tidak pernah downtime pun sekali
  • Auto Backup harian dan Instant Backup sekiranya perlu (GoGeek plan ) 
  • Staging Enviroment untuk Pakej GoGeek. Sesuai untuk website yang nak wat testing. 
  • untuk Pelan GoGeek anda akan dapat resource yang lebih baik seperti VPS
  • Auto Update WordPress. Tidak perlu lagi untuk manual update untuk Security website yang lebih baik. 
  • Mempunyai Server di Singapura. Sebab Utama gak saya pilih Siteground
  • Salah satu hosting yang disyorkan oleh WordPress

Saya ada wat satu survey di satu dua group facebook (majoriti marketer dan SEO) dan rata-rata memilih Siteground.

7.2 Kinsta

Kinsta merupakan servis hosting yang menggunakan platform Google Cloud. Yup. Sudah pasti website anda lebih pantas. Cumanya kos hosting di Kinsta adalah agak tinggi iaitu bermula $30/sebulan hanya untuk 1 WordPress Installation & 3 GB SSD

Barangkali kenapa anda tertanya-tanya mengapa saya letak Kinsta dalam list hosting saya dan bukanya pilihan seperti VPS. Untuk ini, saya kena amik kira beberapa isu seperti kos, sistem mengurus dan kelajuan server. 

Walaupun VPS ni ada yang murah je tetapi kebanyakanya adalah self-managed. Maksudnya ianya tidak ada sistem CMS atau Cpanel untuk setting server anda. Kos install Cpanel rata-rata adalah $12-$15 sebulan. Sekiranya VPS itu beharga $10/sebulan ianya akan bertambah ke menjadi $25 sebulan hanya untuk tambah CPanel. Perlu ingat self managed VPS ni memerlukan masa anda untuk monitor dan setting sendiri jadi ianya kos gak secara tidak langsung. Adakah masa anda ini berbaloi dengan penjimatan RM70-100 sebulan daripada benda lain seperti memberi tumpuan kepada marketing dan sale? Itu saya serahkan kepada anda sendiri untuk tentukan. 

Kedua kelajuan server VPS jika dibandingkan Kinsta yang mengunakan Google Cloud Platform adalah lebih kebanyakan memihak kepada Google Cloud Platform. 

Samada Kinsta ni sesuai untuk pengguna biasa.. jawapannya ialah TIDAK. Saya sama sekali tidak akan syorkan Kinsta kepada yang baru nak mula. Sebaliknya Siteground Startup adalah mencukupi. 

Bila anda perlu tefikir untuk upgrade hosting? Bagi saya.. bila anda mula fikirkan "kelajuan" sebagai faktor boleh meningkatkan jualan atau rendahkan kadar bounce rate. Oleh itu, sekiranya saya nak upgrade dari Siteground, Kinsta merupakan pilihan utama saya setakat ini. 

8. Video

Sekiranya anda mempunyai page ada video di dalamnya, anda boleh guna sebagaimana saya tunjukan untuk optimasi imej di poin 1.1. 

Anda hanya perlu gantikan Video tersebut dengan Screenshot Thumbnail yang menarik dan hanya perlu link ke Video tersebut. 

Cara kedua adalah guna plugin seperti WP Rocket untuk set lazyload seperti dalam poin 2.2.3

9. Google Maps

9.1 Elak Gunakan Google Maps

Untuk kebanyakan situasi, pasti saya akan elakan menggunakan Google Maps. Ya, ianya cantik, tapi saya rasa jumlah masa yang diperlukan untuk loading sepenuhnya website adalah agak tinggi.  

9.2 Teknik Redirect

Menggunakan Teknik ini adalah seperti embed Video iaitu mengantikan Google Maps sebenar dengan Imej screenshot seperti di bawah. Ini kerana untuk mengelakan IFRAME embed yang akan tambah file request. 

Anda boleh menjadikan Imej Google Maps di background untuk mendapatkan Parallax effect yang dapat scroll.

10. GZip Enable

Anda boleh semak samada website adalah gzip compress enable di sini url ini https://checkgzipcompression.com/

Ada beberapa cara untuk enable Gzip ini. Salah satunya adalah menggunakan htaccess file. 

Anda kena access FTP akaun atau CPanel untuk edit htaccess file. 

 Selepas itu anda perlu tampal code di bawah ini di bahagian atas sekali.  

<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On 
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
# CSS
ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
</IfModule>

10.1 Guna Plugin

Kadang-kadang dengan edit htaccess file adalah tidak mencukupi. Oleh itu anda boleh guna plugin ini >>  https://wordpress.org/plugins/speed-up-browser-caching/ 

Anda hanya perlu install dan aktifkan di website anda. 

11. Database 

Bukan sahaja anda perlu "make-up" rupa luaran website anda bahkan adalah sama penting untuk anda optimasi bahagian "dalaman" iaitu database. 

11.1 Buang Komen, Post Revision

Anda perlu buang komen (trash) dan post revision dalam database. Walaupun impaknya mungkin tak besar tapi lebih baik buat. 

11.2 Guna Plugin

Ada beberapa plugin yang saya cadangkan iaitu WP Optimize dan WP Rocket. Di bawah ini saya akan tunjukan setting WP Optimize. Untuk WP Rocket , boleh rujuk setting WP Rocket di poin 2.26

Berikut adalah plugin set up untuk WP Optimize.

11.3 wpconfig.php

Method ini adalah untuk set limit post revision untuk semua post di dalam WordPress blog anda. 

Sila pastikan anda copy dahulu wpconfig.php file sebelum edit. Fail ini berada di folder utama website anda.  Di CPanel, anda perlu mengunakan File Manager. 

Sila tampal code ini sebelum atas code β€˜ABSPATH’ atau ianya tidak akan berfungsi.

define('AUTOSAVE_INTERVAL', 300);
define('WP_POST_REVISIONS', 3);

Code di atas ini bermaksud, setiap 300 saat (5 minit) satu post revision akan disimpan dalam database dan maksimum post revision di had kepada 3 sahaja. 

Oleh itu, hanya 3 post revision yang terkini sahaja anda akan dapat simpan di dalam database WordPress anda. 

Anda boleh bayangkan sekiranya anda mempunyai 100 post dan 50 revision untuk setiap post? ianya bermaksud ada 5000 entries berbanding 300 saje mengunakan teknik ini. 

12. Theme

Pemilihan theme untuk website anda bukan hanya perlu tekankan rupa bentuk sahaja tetapi anda perlu melihat dari aspek kelajuan.

Setiap orang mempunyai definasi website yang lawa. Bagi saya lak kecantikan tue kena minimal atau lebih mudah bagi pelawat untuk membaca konten post. Website yang banyak imej atau slider mungkin disukai ramai tetapi impaknya kepada kelajuan adalah tinggi.

Untuk ini, saya cadangkan  satu theme percuma yang bukan sahaja ringan tetapi fleksible dari segi design iaitu GeneratePress. 

12.1 GeneratePress

GeneratePress adalah Theme percuma yang anda boleh gunakan untuk WordPress website anda. Ianya antara Theme yang saya syorkan kerana mempunyai function yang ringkas dan di antara Theme yang lightweight. Anda boleh upgrade ke Pro version sekiranya memerlukan lebih banyak feature. Bukan sahaja ianya ringan tetapi ianya adalah Theme yang agak fleksible di mana anda boleh tambah addon dan ubah rupa bentuk theme dengan mudah sahaja.

12.2 Tip Memilih Theme

Berikut adalah beberapa tip yang anda boleh gunakan untuk memilih Theme WordPress anda

  • Buat pemilihan bedasarkan template blog dan bukannya template yang lain seperti Homepage. Kenapa? Majoriti disebabkan terdapat banyak Page Builder yang bagus seperti Elementor, Brizy, Thrive Architect, dan Divi boleh bina post atau page dengan lebih mudah. Tetapi kebiasaanya design konsisten yang diperlukan adalah bahagian blog. Oleh itu, pemilihan saya sekarang adalah lebih kepada blog template untuk sesuatu theme.
  • Mempunyai feature tambahan seperti social sharing supaya tidak perlu aktifkan plugin tambahan yang lain. Seperti yang anda tahu, bilangan plugin yang aktif dalam WordPress anda boleh menyebabkan website anda loading file request yang lebih tinggi dan melambatkan page tersebut.

Biasanya saya akan semak kelajuan demo bagi theme tersebut.  Berikut adalah perbezaan antara default installation WordPress Theme vs GeneratePress  

Pekara yang penting sini adalah Total of request iaitu 16 untuk Default WP Theme berbanding 10 sahaja untuk GeneratePress. 

Mengikut pengalaman saya, bilangan request yang tinggi sentiasa akan menyebabkan website anda load lebih lambat.  

Cadangan

Cuba dapatkan jumlah file request di bawah 100. Sekiranya anda hendak page web anda di bawah 2 saat, cuba tweak sikit sehingga di bawah 30 file request sahaja.

13. Key Takeaway

Secara amnya, untuk dapatkan website yang laju, anda perlu:

  1. Dapatkan hosting yang bagus seperti Siteground.
  2. Mulakan dengan optimasi Imej disebabkan imej ini adalah 50%-70% daripada kandungan website anda. 
  3. Gunakan Caching Plugin seperti Cache Enabler atau WP Rocket
  4. Kurangkan jumlah plugin di dalam WordPress anda dan sentiasa update untuk memastikan tidak ada isu yang boleh meyebabkan website anda makin lambat loading.
  5. Menggunakan lightweight theme seperti GeneratePress adalah membantu website anda lebih laju
  6. Menggunakan Cloudflare dan setting seperti yang saya tunjukan di atas ini atau anda boleh tonton di YouTube Video ini
  7. Elakan install banyak 3rd party script seperti live chat, Facebook Page Share & Like box dan lain-lain lagi yang boleh menambahkan berpuluh file request dan javascript.
  8. Elakan embed Google Maps. Sekiranya perlu gunakan imej redirect seperti mana diterangkan dalam poin 9.2 

Okay, macam ner? cukup info ini untuk bantu anda?

InshaALLAH dari masa ke semasa saya cuba kemaskini post ini. Share sekiranya anda suka post ini. Ianya membantu saya untuk buat lagi banyak tutorial sebegini. 

Terima kasih ya sebab sudi membaca

Comments

  1. Abdul Reply
    July 26, 2018

    Terbaik…..

    1. BloggerKickstart Reply
      July 26, 2018

      Thanks bos. πŸ™‚

  2. Abu Munzir Reply
    July 26, 2018

    perkongsian yang sangat bermanfaat. TQ

    1. BloggerKickstart Reply
      July 26, 2018

      Terima kasih bos.. kalu ada persoalan nanti..just komen ya

  3. DE SOPHEA Reply
    July 26, 2018

    Terbaik la bro tq

    1. BloggerKickstart Reply
      July 26, 2018

      Thanks..boleh apply di web sendiri nanti

  4. Eezwan Manaf Reply
    July 26, 2018

    Terbaik..memang lengkap. Bookmark dulu

    1. BloggerKickstart Reply
      July 26, 2018

      Thanks. Hopefully dapat bantu bos

  5. Sani Reply
    July 27, 2018

    Saya baca sampai habis. Rupanya banyak lagi aspek teknikal yang kita boleh perbaiki dan tingkatkan untuk lajukan website/ blog kita. Terbaiklah tuan!

    1. BloggerKickstart Reply
      July 27, 2018

      Banyak tapi priority Imej dulu bos.. Sebenarnya kalu saya letak CDN boleh je dalam ni..tapi saya takde lak use masa ni..nanti2 boleh update lagi. Thanks for komen bos

  6. Azlan Reply
    July 27, 2018

    Jika website ecommerce , boleh tak dapat bawah 3sec tuan? πŸ™‚ Gambar memang banyak kene masukkan.

    1. BloggerKickstart Reply
      July 27, 2018

      Boleh. Tapi kena guna plugin untuk optimize imej tue. Sebab banyak kan..lagipun bukan start from scratch. boleh cuba plugin ni: https://bloggerkickstart.com/go/perfmatters/. Saya akan research sikit pasal untuk ecommerce. Dan kalau terlampau berat tue..probably perlu guna CDN.(saya akan cover ni sekiranya saya decide use later)

  7. Hadee Roslan Reply
    July 27, 2018

    Salam.. Excellentlah artikel nih.. Den nak tambah satu lagi point..
    Sekiranya site banyak guna Video, boleh guna plugin A3 Lazy Load dari A3rev Software supaya YouTube scripts are only loaded bila visitor klik on the video image.

    1. BloggerKickstart Reply
      July 27, 2018

      Thanks bos for rekemen. boleh update lagi nanti. πŸ™‚

  8. Suhimi Reply
    August 7, 2018

    Terima kasih Tuan atas perkongsiannya, ni kalau ikut betul dah boleh buat satu mini ebook da. πŸ™‚ info memang betul berkualiti kandungannya.

    1. BloggerKickstart Reply
      August 7, 2018

      Alhamdulillah.. πŸ™‚ InshaALLAH akan saya wat lagi tambahan dan banyak lagi artikel sebegini.

  9. sulhi radi Reply
    August 18, 2018

    salam tuan,

    mohon tuan kongsikan tentang “Remove Query Strings From Static Resources”.

    Saya test speed website saya, skor pada Remove Query Strings From Static Resources tu failed. mohon share tuan

    1. BloggerKickstart Reply
      August 19, 2018

      Salam. Remove Query String from Static Resource ni merujuk dalam term GTmetrix yg berkenaan di dalam belakang URL biasanya ada tanda “?”atau “&” di fail CSS atau JavaScript yang kadang-kadang tidak dapat dibuang oleh certain CDN atau Cloudflare. Contoh Query String file: edd.min.css?ver=1.09. Ianya bersifat dynamic jadi tidak akan proper cache oleh CDN or proxy server. Ade few plugin boleh cuba seperti Autoptimize, Perfmatters, Remove Query String dan Browser Cache . Sekiranya masih takdapat remove tue..mungkin kena tweak bahagian coding tertentu dan depend ngan theme/plugin yang digunakan. Untuk ini saya belum buat lagi secara menyeluruh.. inshaALLAH sekiranya saya dapat info saya akan bincangkan lagi di sini

Leave a Reply

Your email address will not be published. Required fields are marked *

*