Panduan Optimasi Performa Website

Website yang lemot bikin pengalaman pengguna jadi buruk. Akibatnya, banyak pengunjung yang bakal langsung cabut sebelum sempat eksplor lebih jauh. Kalau sering terjadi, Google juga bakal menurunkan peringkat website kamu.

Bahkan kalau websitemu cukup cepat, tetap bisa kalah saing sama yang performanya lebih optimal. Makanya, optimasi performa website itu penting banget!

Apa Itu Performa Website?

Performa website itu bukan cuma soal kecepatan. Walaupun kecepatan loading itu penting, ada faktor lain yang juga menentukan apakah website kamu nyaman buat dikunjungi.

Misalnya, apakah websitemu bisa diakses dengan baik di semua perangkat, apakah sudah pakai HTTPS, dan masih banyak lagi. Jadi, optimasi performa website itu lebih dari sekadar mempercepat loading halaman.

Kamu harus memastikan semua elemen di websitemu bekerja dengan optimal.

Apa Itu Optimasi Performa Website?

Optimasi performa website adalah proses meningkatkan berbagai aspek teknis website, baik di bagian depan (front-end) maupun belakang (back-end), supaya pengunjung bisa mengaksesnya dengan lancar dan tanpa hambatan.

Misalnya, website kamu mungkin cepat diakses dari AS, tapi lambat banget kalau dibuka dari negara lain karena servernya ada di AS dan nggak pakai CDN. Nah, itu tandanya performanya masih kurang optimal.

Untuk meningkatkan performa website, kamu perlu melihat berbagai aspek yang mempengaruhi kecepatan dan kestabilan website secara keseluruhan.

Kenapa Optimasi Performa Website Itu Penting?

Tahukah kamu kalau tambahan waktu loading 100 milidetik bisa mengurangi pendapatan sebesar 1%?

Website itu sering jadi kesan pertama dari brand kamu. Kalau pengunjung buka websitemu dan loading-nya lama, gambar nggak muncul, atau malah kena redirect terus-menerus, mereka pasti bakal cari alternatif lain alias kompetitor kamu.

Google juga nggak mau kasih peringkat tinggi ke website yang performanya buruk. Tujuan Google adalah menyajikan konten dan pengalaman terbaik buat pengguna. Jadi, kalau websitemu lemot dan nggak optimal, jangan harap bisa dapat peringkat bagus di hasil pencarian.

Faktor-Faktor yang Mempengaruhi Performa Website

Kalau sudah paham pentingnya optimasi performa website, sekarang saatnya membahas faktor-faktor yang mempengaruhinya. Salah satu metrik utama yang digunakan untuk menilai performa website adalah Core Web Vitals, yang dikembangkan oleh Google untuk mengukur pengalaman pengguna secara langsung. Core Web Vitals terdiri dari tiga metrik utama:

1. Largest Contentful Paint (LCP)

LCP mengukur waktu yang dibutuhkan untuk merender elemen terbesar dalam viewport (bagian halaman yang terlihat di layar pengguna) sejak halaman mulai dimuat. Elemen ini biasanya berupa gambar utama, blok teks besar, atau video thumbnail. Semakin cepat elemen terbesar ini muncul, semakin baik pengalaman pengguna. Google merekomendasikan LCP di bawah 2,5 detik agar dianggap memiliki performa baik.

Faktor yang bisa mempengaruhi LCP antara lain server yang lambat, gambar yang tidak dioptimalkan, serta CSS atau JavaScript yang memperlambat proses rendering.

2. Interaction to Next Paint (INP)

INP mengukur waktu respons website terhadap interaksi pengguna, seperti klik tombol, input pada form, atau aksi lain yang memerlukan respons visual. Jika responsnya terlalu lama, pengguna bisa merasa website tidak responsif atau lag. Google merekomendasikan INP di bawah 200 milidetik untuk pengalaman pengguna yang optimal.

Beberapa faktor yang mempengaruhi INP termasuk JavaScript yang berat, terlalu banyak tugas yang berjalan di latar belakang, serta kurangnya optimasi pada event listener.

3. Cumulative Layout Shift (CLS)

CLS mengukur stabilitas tata letak halaman selama proses loading. Jika elemen-elemen pada halaman berubah posisi saat pengguna sedang membaca atau berinteraksi, itu disebut layout shift.

Contoh masalah CLS adalah iklan atau gambar yang muncul terlambat dan mendorong teks ke bawah, font yang berubah ukuran setelah dimuat, atau elemen yang bergeser akibat pemuatan JavaScript atau CSS. Google merekomendasikan CLS di bawah 0,1 agar pengalaman pengguna tetap nyaman.

Selain Core Web Vitals, ada juga metrik tambahan yang mempengaruhi performa website:

4. First Contentful Paint (FCP)

FCP mengukur waktu yang dibutuhkan untuk menampilkan elemen pertama di halaman, seperti teks, gambar, atau latar belakang. Semakin cepat FCP, semakin cepat pengguna tahu bahwa halaman sedang dimuat. Google merekomendasikan FCP di bawah 1,8 detik untuk pengalaman yang baik.

Faktor yang mempengaruhi FCP mencakup server yang lambat, CSS atau JavaScript yang memblokir rendering, serta terlalu banyak permintaan HTTP.

5. Speed Index (SI)

Speed Index mengukur seberapa cepat konten halaman terlihat selama proses loading. Semakin kecil nilainya, semakin baik.

Beberapa faktor yang mempengaruhi SI adalah gambar yang tidak dioptimalkan, JavaScript yang berat, serta tidak menggunakan lazy loading.

6. Time to Interactive (TTI)

TTI mengukur waktu yang dibutuhkan sejak halaman mulai dimuat hingga benar-benar bisa digunakan (interaktif). Misalnya, pengguna bisa mulai mengetik di formulir atau mengklik tombol tanpa mengalami lag. Google menyarankan TTI di bawah 5 detik.

Faktor yang mempengaruhi TTI antara lain terlalu banyak skrip yang dijalankan sebelum halaman siap dan penggunaan JavaScript yang berat tanpa optimasi.

7. Total Blocking Time (TBT)

TBT mengukur total waktu di mana halaman tidak bisa merespons pengguna karena JavaScript sedang memproses sesuatu di latar belakang. Metrik ini berhubungan dengan TTI, karena semakin lama TBT, semakin lama halaman menjadi interaktif. Google merekomendasikan TBT di bawah 200 milidetik.

Beberapa faktor yang mempengaruhi TBT termasuk terlalu banyak JavaScript yang harus dieksekusi sebelum halaman siap serta tidak menggunakan teknik code-splitting untuk memuat JavaScript secara bertahap.

Mengoptimalkan performa website bukan cuma soal kecepatan, tapi juga memastikan pengalaman pengguna tetap nyaman dan responsif. Dengan memahami metrik Core Web Vitals dan metrik tambahan lainnya, kamu bisa mengidentifikasi masalah dan melakukan perbaikan agar websitemu lebih cepat, stabil, dan lebih ramah pengguna. 🚀

 

Cara Mengukur Performa Website

Banyak alat gratis yang bisa kamu gunakan untuk mengecek performa website. Alat-alat ini membantu mengidentifikasi berbagai masalah yang bisa memperlambat loading halaman, mengganggu pengalaman pengguna, atau menurunkan peringkat website di mesin pencari. Berikut adalah beberapa alat yang umum digunakan:

1. PageSpeed Insights

PageSpeed Insights adalah alat dari Google yang menganalisis performa halaman website di perangkat mobile dan desktop. Alat ini memberikan skor performa dari 0 hingga 100, serta rekomendasi untuk meningkatkan kecepatan dan pengalaman pengguna.

Beberapa metrik utama yang dianalisis PageSpeed Insights:

• Core Web Vitals, termasuk Largest Contentful Paint (LCP), Interaction to Next Paint (INP), dan Cumulative Layout Shift (CLS).
• First Contentful Paint (FCP), yang mengukur seberapa cepat elemen pertama muncul di halaman.
• Time to Interactive (TTI), yang menunjukkan kapan halaman benar-benar bisa digunakan.

PageSpeed Insights juga memberikan saran spesifik, seperti mengoptimalkan gambar, mengurangi pemblokiran render oleh JavaScript, dan memanfaatkan cache browser.

2. GTmetrix

GTmetrix adalah alat yang menganalisis kecepatan dan performa website berdasarkan berbagai faktor teknis. Alat ini menggunakan Lighthouse sebagai dasarnya, tetapi juga memberikan laporan yang lebih mendetail, termasuk:

• Waterfall Chart, yang menunjukkan urutan pemuatan setiap elemen di halaman.
• Skor dari Google Lighthouse dan YSlow, dua sistem yang menilai performa dan optimasi halaman.
• Rekomendasi optimasi, seperti penggunaan Content Delivery Network (CDN) atau pengurangan HTTP request.

GTmetrix juga memungkinkan pengguna memilih lokasi pengujian, sehingga bisa mengevaluasi performa dari berbagai wilayah geografis.

3. Lighthouse

Lighthouse adalah alat open-source dari Google yang bisa dijalankan di Chrome DevTools atau sebagai ekstensi browser. Alat ini memberikan audit lengkap terhadap website dalam beberapa kategori:

• Performance, mengukur kecepatan dan efisiensi website.
• Accessibility, menguji apakah website dapat diakses dengan baik oleh semua pengguna, termasuk mereka yang memiliki keterbatasan.
• Best Practices, menilai apakah website mengikuti standar pengembangan yang baik.
• SEO, memberikan saran untuk meningkatkan optimasi mesin pencari.

Lighthouse sering digunakan oleh pengembang untuk melakukan pengujian mendalam sebelum website di-publish atau diperbarui.

4. WebPageTest

WebPageTest adalah alat yang lebih teknis yang memungkinkan pengguna melakukan pengujian performa website dari berbagai lokasi dan menggunakan berbagai jenis koneksi internet. Fitur utama WebPageTest meliputi:

• Multistep Testing, untuk menganalisis bagaimana website berperilaku saat pengguna menavigasi dari satu halaman ke halaman lain.
• Filmstrip View, yang memperlihatkan bagaimana halaman dimuat dari awal hingga selesai.
• Analisis kompresi dan caching, untuk mengetahui apakah file statis telah dioptimalkan dengan baik.

WebPageTest sering digunakan oleh profesional untuk mendapatkan data yang lebih detail dan akurat dibandingkan alat lain.

Cara Optimasi Performa Website

Ada banyak cara buat meningkatkan performa website. Biar lebih gampang, kita bagi jadi tiga kategori berdasarkan dampaknya:

1. Optimasi dengan Dampak Tinggi

Optimasi website dengan dampak tinggi adalah langkah-langkah yang memberikan perbaikan signifikan terhadap performa website dalam waktu relatif singkat. Langkah-langkah ini wajib dilakukan karena langsung berdampak pada kecepatan loading, pengalaman pengguna, dan peringkat di mesin pencari.

1. Upgrade ke HTTP/2 Supaya Transfer Data Lebih Cepat

Protokol HTTP/2 adalah pembaruan dari HTTP/1.1 yang dirancang untuk mempercepat transfer data antara server dan browser. Dibandingkan HTTP/1.1 yang hanya bisa mengirim satu permintaan dalam satu waktu, HTTP/2 memungkinkan banyak permintaan dikirim sekaligus dalam satu koneksi, yang disebut multiplexing.

Keunggulan HTTP/2:

✅ Multiplexing – Browser dapat mengunduh banyak file secara bersamaan tanpa harus menunggu satu per satu.
✅ Header Compression – Data yang dikirim lebih ringan karena header HTTP dikompresi dengan algoritma HPACK.
✅ Server Push – Server dapat mengirimkan data ke browser sebelum browser memintanya, mengurangi waktu loading.
✅ Lebih Efisien dalam Penggunaan Sumber Daya – Mengurangi jumlah koneksi TCP yang diperlukan, sehingga lebih hemat bandwidth.

Cara Upgrade ke HTTP/2:

1. Pastikan server mendukung HTTP/2 – Kebanyakan server modern seperti Apache dan Nginx sudah mendukung HTTP/2, tetapi mungkin perlu diaktifkan secara manual.
2. Gunakan HTTPS – HTTP/2 memerlukan koneksi aman (SSL/TLS). Pastikan website menggunakan sertifikat SSL.
3. Periksa dengan alat uji – Gunakan KeyCDN HTTP/2 Test untuk memastikan website sudah berjalan dengan HTTP/2.

---

2. Gunakan Content Delivery Network (CDN) untuk Mempercepat Loading dari Berbagai Lokasi

Content Delivery Network (CDN) adalah jaringan server yang tersebar di berbagai lokasi di seluruh dunia. CDN menyimpan salinan file statis website (seperti gambar, CSS, dan JavaScript) di beberapa lokasi geografis sehingga pengunjung dapat mengaksesnya dari server terdekat.

Manfaat Menggunakan CDN:

✅ Mengurangi Latency – File diambil dari server yang paling dekat dengan pengguna, mempercepat waktu loading.
✅ Meningkatkan Keandalan – Jika satu server mengalami gangguan, CDN akan mengarahkan permintaan ke server lain.
✅ Mengurangi Beban Server Utama – CDN menangani sebagian besar permintaan pengguna, mengurangi tekanan pada server utama.

Cara Menggunakan CDN:

1. Pilih layanan CDN yang sesuai, misalnya Cloudflare, Akamai, AWS CloudFront, atau Fastly.
2. Konfigurasikan DNS agar lalu lintas website melewati CDN.
3. Pastikan file statis (gambar, video, CSS, dan JavaScript) di-cache di server CDN.
4. Cek performa website menggunakan GTmetrix atau WebPageTest untuk melihat pengaruh penggunaan CDN.

---

3. Kompres File Website Supaya Lebih Ringan

Kompresi file membantu mempercepat waktu loading dengan mengurangi ukuran file yang dikirim dari server ke browser pengguna. Teknik ini sangat efektif untuk file HTML, CSS, JavaScript, dan bahkan gambar.

Teknik Kompresi yang Direkomendasikan:

✅ Gunakan Gzip atau Brotli – Gzip dan Brotli adalah dua algoritma kompresi yang dapat mengurangi ukuran file hingga 70%. Brotli lebih efisien daripada Gzip dan didukung oleh sebagian besar browser modern.
✅ Minify CSS, JavaScript, dan HTML – Menghapus karakter yang tidak perlu seperti spasi dan komentar dalam file kode agar lebih ringan.
✅ Gunakan Format Gambar yang Efisien – Gunakan format gambar modern seperti WebP yang lebih kecil dibandingkan PNG atau JPEG tanpa mengorbankan kualitas.

Cara Mengaktifkan Kompresi di Server:

1. Jika menggunakan Apache, aktifkan Gzip dengan menambahkan kode berikut ke .htaccess:

   <IfModule mod_deflate.c>
       AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/javascript
   </IfModule>
   

2. Jika menggunakan Nginx, aktifkan Brotli atau Gzip dengan menambahkan konfigurasi berikut di file nginx.conf:

   gzip on;
   gzip_types text/plain text/css application/javascript;
   gzip_comp_level 6;
   

3. Gunakan plugin cache jika memakai WordPress, seperti WP Rocket atau W3 Total Cache, yang bisa mengaktifkan kompresi secara otomatis.

---

4. Gunakan Sistem Caching Baik di Sisi Server Maupun Browser

Caching adalah teknik menyimpan data sementara agar bisa diakses lebih cepat tanpa perlu memuat ulang dari server setiap kali halaman dibuka.

Jenis-Jenis Caching:

✅ Browser Caching – Menyimpan file statis di browser pengguna, sehingga saat mereka mengunjungi halaman yang sama lagi, browser tidak perlu mengunduh ulang semua file.
✅ Server Caching – Menyimpan hasil pemrosesan halaman di server untuk menghindari pemrosesan ulang setiap kali ada permintaan dari pengguna.
✅ CDN Caching – CDN menyimpan salinan file website agar bisa diakses lebih cepat dari lokasi terdekat pengguna.
✅ Database Caching – Menyimpan hasil kueri database agar tidak perlu memproses ulang data yang sama berulang kali.

Cara Mengaktifkan Caching:

1. Atur Header Cache-Control di Server – Contoh konfigurasi untuk Apache di .htaccess:

   <IfModule mod_expires.c>
       ExpiresActive On
       ExpiresByType text/css "access plus 1 week"
       ExpiresByType application/javascript "access plus 1 week"
       ExpiresByType image/jpeg "access plus 1 month"
       ExpiresByType image/png "access plus 1 month"
   </IfModule>
   

2. Gunakan Plugin Caching (jika menggunakan CMS seperti WordPress), misalnya:
   • WP Rocket
   • W3 Total Cache
   • LiteSpeed Cache
3. Gunakan Redis atau Memcached untuk Database Caching – Mengurangi waktu yang dibutuhkan untuk mengambil data dari database.

Dengan menerapkan langkah-langkah optimasi ini, website akan lebih cepat, lebih efisien, dan memberikan pengalaman pengguna yang lebih baik, sekaligus meningkatkan peringkat di mesin pencari.

2. Optimasi dengan Dampak Menengah

Optimasi ini tidak selalu memberikan peningkatan performa secara instan, tetapi tetap penting untuk menjaga efisiensi website dalam jangka panjang. Dengan melakukan langkah-langkah ini, website bisa berjalan lebih ringan, lebih cepat, dan lebih responsif tanpa harus mengubah arsitektur atau infrastruktur secara drastis.

Optimalkan Database Supaya Lebih Efisien

Seiring waktu, database website dapat menjadi lebih besar dan tidak efisien karena banyaknya data yang tersimpan, seperti revisi post, komentar spam, dan data lama yang tidak lagi dibutuhkan. Mengoptimalkan database dapat mempercepat waktu pemrosesan dan mengurangi beban server.

Beberapa langkah yang bisa dilakukan untuk mengoptimalkan database adalah menghapus data yang tidak diperlukan, menggunakan indeks untuk mempercepat pencarian, serta menggunakan plugin optimasi database jika menggunakan WordPress. Menghapus revisi post yang menumpuk, komentar spam, dan transient options dapat membantu mengurangi beban database. Selain itu, perintah OPTIMIZE TABLE pada MySQL bisa digunakan untuk mengurangi fragmentasi tabel.

Menggunakan object caching seperti Redis atau Memcached juga bisa membantu menyimpan hasil query database yang sering digunakan, sehingga server tidak perlu melakukan pemrosesan berulang kali.

Hapus Plugin yang Nggak Dipakai di CMS Seperti WordPress

Plugin memang menambah fungsionalitas, tetapi terlalu banyak plugin bisa memperlambat website, meningkatkan risiko keamanan, dan memperberat beban server.

Beberapa dampak negatif dari terlalu banyak plugin adalah meningkatnya waktu loading website akibat permintaan HTTP yang berlebihan, konsumsi sumber daya server yang lebih tinggi, serta potensi terjadinya konflik kode antara satu plugin dengan yang lain. Selain itu, plugin yang tidak diperbarui juga bisa menjadi celah keamanan.

Cara mengelola plugin dengan lebih efisien adalah dengan menghapus plugin yang tidak dipakai, memilih plugin yang lebih ringan, serta menggunakan kode manual jika memungkinkan. Jika perlu mengecek dampak masing-masing plugin terhadap performa, bisa menggunakan alat seperti Query Monitor atau P3 (Plugin Performance Profiler).

Hindari Render-Blocking Resources Seperti CSS dan JavaScript yang Memperlambat Tampilan Halaman

Render-blocking resources adalah file CSS dan JavaScript yang harus dimuat sebelum halaman bisa ditampilkan. Jika tidak dioptimalkan, mereka bisa memperlambat loading halaman karena pengguna harus menunggu sebelum bisa melihat konten utama.

Salah satu cara untuk mengoptimalkan JavaScript adalah dengan menggunakan atribut async atau defer. Async memungkinkan skrip dimuat bersamaan dengan halaman, tetapi bisa menyebabkan skrip berjalan tidak berurutan. Defer memastikan skrip dimuat setelah halaman selesai dirender, menjaga urutan eksekusi.

Selain itu, penggunaan Critical CSS bisa membantu memuat hanya CSS yang diperlukan untuk tampilan awal halaman, sedangkan CSS lainnya bisa dimuat setelahnya. Menggunakan alat seperti WP Rocket atau Autoptimize di WordPress dapat membantu dalam implementasi ini.

Mengompresi dan meminimalkan file CSS dan JavaScript juga bisa meningkatkan kecepatan website. Ini bisa dilakukan dengan alat seperti Terser untuk JavaScript dan CSSNano untuk CSS.

Gambar dan video juga bisa dioptimalkan dengan menerapkan lazy loading, sehingga elemen-elemen ini hanya dimuat saat pengguna menggulir ke area yang membutuhkannya. Ini bisa dilakukan dengan menambahkan atribut loading="lazy" pada gambar atau menggunakan preload="none" pada video agar tidak langsung dimuat sebelum diperlukan.

Menggunakan CDN juga bisa membantu mempercepat pemuatan resource statis seperti CSS, JavaScript, dan gambar dengan mendistribusikan file dari server yang lebih dekat dengan lokasi pengguna.

Dengan menerapkan strategi ini, website akan lebih cepat dimuat, mengurangi waktu tunggu pengguna, dan meningkatkan pengalaman secara keseluruhan.

3. Optimasi dengan Dampak Rendah (Tetap Penting!)

Walaupun optimasi ini memiliki dampak yang lebih kecil dibandingkan strategi lain, bukan berarti tidak penting. Setiap perbaikan kecil tetap bisa berkontribusi pada peningkatan kecepatan dan pengalaman pengguna secara keseluruhan. Langkah-langkah berikut dapat membantu mengurangi beban website tanpa mengorbankan kualitas tampilan atau fungsionalitasnya.

Kompres Gambar Supaya Lebih Ringan Tanpa Mengurangi Kualitas

Gambar adalah salah satu elemen yang paling sering menyebabkan halaman website menjadi berat dan lambat dimuat. Semakin besar ukuran gambar, semakin lama waktu yang dibutuhkan untuk mengunduhnya. Oleh karena itu, penting untuk mengompresi gambar agar ukurannya lebih kecil tanpa kehilangan kualitas yang signifikan.

Beberapa alat yang bisa digunakan untuk mengompresi gambar secara otomatis antara lain TinyPNG, Squoosh, ImageOptim, dan ShortPixel. Jika menggunakan WordPress, plugin seperti Smush atau Imagify bisa membantu mengompresi gambar langsung di dalam sistem tanpa harus mengunggah ulang secara manual.

Selain mengompresi, gunakan teknik lazy loading, di mana gambar hanya dimuat ketika pengguna menggulir ke bagian yang menampilkan gambar tersebut. Ini bisa dilakukan dengan menambahkan atribut loading="lazy" pada tag <img>.

Kurangi atau Hilangkan Redirect yang Nggak Perlu

Redirect yang berlebihan bisa memperlambat waktu loading halaman karena setiap kali pengguna mengakses sebuah URL yang dialihkan ke URL lain, browser harus mengirim permintaan tambahan ke server. Jika ada terlalu banyak redirect berantai, ini bisa menyebabkan peningkatan waktu respons secara signifikan.

Cara terbaik untuk mengurangi redirect yang tidak perlu adalah dengan:

• Memastikan tidak ada redirect berantai atau redirect loop
• Menggunakan redirect permanen (301) untuk pengalihan jangka panjang daripada redirect sementara (302)
• Memeriksa tautan internal dan memperbarui URL lama ke URL yang langsung dituju tanpa melalui redirect

Alat seperti Screaming Frog SEO Spider atau Google Search Console bisa digunakan untuk menganalisis dan menemukan redirect yang tidak diperlukan.

Gunakan Format Gambar yang Tepat

Selain mengompresi gambar, menggunakan format yang lebih efisien dapat mengurangi ukuran file secara drastis. Format gambar modern seperti WebP menawarkan ukuran yang lebih kecil dengan kualitas yang sama dibandingkan dengan JPEG atau PNG.

Sebagai contoh, WebP bisa mengurangi ukuran file hingga 25-34% lebih kecil dibandingkan JPEG dengan kualitas yang sama. Format ini juga didukung oleh mayoritas browser modern.

Jika format WebP tidak dapat digunakan pada beberapa browser tertentu, bisa disiapkan fallback ke format lain dengan menggunakan tag <picture> di HTML:

<picture>
  <source srcset="gambar.webp" type="image/webp">
  <img src="gambar.jpg" alt="Deskripsi gambar">
</picture>

Selain WebP, ada juga format lain seperti AVIF yang memiliki kompresi lebih baik daripada WebP tetapi belum didukung oleh semua browser.

Optimalkan Web Font Supaya Nggak Memperlambat Loading Halaman

Font yang digunakan di website juga bisa menjadi penyebab lambatnya loading, terutama jika menggunakan banyak variasi font atau ukuran file yang besar.

Beberapa cara untuk mengoptimalkan web font:

• Gunakan hanya font yang diperlukan. Hindari memuat terlalu banyak variasi gaya (bold, italic, light, dll.) jika tidak benar-benar dibutuhkan.
• Gunakan format font yang lebih efisien, seperti WOFF2. Format ini memiliki ukuran yang lebih kecil dibandingkan TTF atau WOFF.
• Gunakan display swap. Menambahkan font-display: swap; di CSS memungkinkan teks ditampilkan lebih cepat menggunakan font fallback sebelum font utama selesai dimuat.
• Hindari pemuatan font dari sumber eksternal yang lambat. Jika memungkinkan, host font langsung di server sendiri atau gunakan layanan yang cepat seperti Google Fonts dengan preload.

Dengan mengoptimalkan web font, website dapat menampilkan teks lebih cepat tanpa jeda yang mengganggu pengalaman pengguna.

Meskipun optimasi ini mungkin tidak memberikan peningkatan performa sebesar optimasi dengan dampak tinggi atau menengah, menerapkan strategi ini tetap penting untuk menjaga pengalaman pengguna yang optimal dan meningkatkan kecepatan website secara keseluruhan.