𝗠𝗲𝗻𝗴𝗼𝗽𝘁𝗶𝗺𝘂𝗸𝗮𝗻 𝗖𝗼𝗿𝗲 𝗪𝗲𝗯 𝗩𝗶𝘁𝗮𝗹𝘀 𝗠𝗲𝗻𝗴𝗴𝘂𝗻𝗮𝗸𝗮𝗻 𝗖𝗗𝗡 𝗱𝗮𝗻 𝗛𝗲𝗮𝗱𝗲𝗿 𝗖𝗮𝗰𝗵𝗶𝗻𝗴

Google menggunakan Core Web Vitals untuk mengukur kelajuan dan kestabilan laman web anda. Skor yang tinggi meningkatkan SEO dan pengalaman pengguna anda.

Anda perlu memantau tiga metrik utama: • Largest Contentful Paint (LCP): Sasarkan di bawah 2.5 saat. • Interaction to Next Paint (INP): Sasarkan di bawah 200ms. • Cumulative Layout Shift (CLS): Sasarkan di bawah 0.1.

Content Delivery Network (CDN) yang dipadankan dengan header caching yang pintar adalah cara terpantas untuk meningkatkan skor ini.

Bagaimana CDN membantu:

  • Ia mengurangkan kependaman (latency) dengan menghantar fail dari lokasi yang berdekatan dengan pengguna anda.
  • Ia menyimpan cache respons API di bahagian edge untuk melindungi pelayan anda.
  • Ia menghantar kandungan lama (stale content) jika pelayan asal (origin server) anda tergendala.
  • Ia mengoptimumkan imej dengan mengubah saiz dan memampatkannya secara automatik.

Gunakan strategi caching ini: • Aset statik: Gunakan tempoh cache yang lama dengan hash fail. • Halaman HTML: Tetapkan header cache khusus berdasarkan kekerapan kemas kini anda. • Respons API: Simpan cache kandungan di bahagian edge untuk mengurangkan beban pelayan asal.

Pengoptimuman imej adalah sangat penting untuk LCP. Kebanyakan isu LCP berpunca daripada imej hero yang besar. CDN boleh menukar imej ini kepada format WebP atau AVIF dan menghantarnya dari pelayan yang paling dekat. Ini mengurangkan saiz halaman mudah alih sehingga 70%.

Mengurus kemas kini adalah mudah dengan alatan moden. Gunakan webhook untuk mencetuskan pembersihan cache (cache purging). Apabila anda mengemas kini kandungan, CDN anda hanya akan membuang data lama. Ini memastikan laman web anda kekal pantas tanpa memaparkan maklumat yang lapuk.

Langkah-langkah yang perlu diambil:

  • Gunakan CDN moden dengan edge computing.
  • Tetapkan header cache-control yang betul untuk setiap jenis sumber.
  • Optimumkan imej di bahagian edge.
  • Simpan cache respons API.
  • Gunakan webhook untuk membersihkan cache semasa kemas kini.
  • Pantau metrik pengguna sebenar untuk melihat kemajuan anda.

Perubahan kecil dalam cara anda menghantar fail akan membawa kepada kedudukan (ranking) yang lebih baik dan lebih banyak penukaran (conversions).

Sumber: https://dev.to/sohanaakbar7/optimizing-core-web-vitals-using-cdn-caching-headers-2lfd