Cara Mempercepat Toko Shopify untuk Pembeli di Indonesia

Diperbarui 16 Oktober 2026 · ±6 menit baca

Shopify semakin banyak dipakai brand lokal Indonesia, terutama yang menjual ke luar negeri atau ingin tampil lebih profesional daripada sekadar toko di marketplace. Server, SSL, dan CDN sudah diurus Shopify, sehingga waktu respons server biasanya baik. Namun banyak toko Shopify tetap terasa lambat di ponsel, apalagi di jaringan seluler di luar kota besar. Penyebab utamanya hampir selalu tema, aplikasi tambahan, gambar, dan skrip pemasaran.

Kecepatan berpengaruh langsung pada penjualan. Pembeli dari iklan Instagram atau TikTok biasanya membuka toko lewat ponsel dan cepat menutupnya jika halaman produk tidak segera muncul. Panduan ini membahas cara memperbaikinya tanpa kehilangan fitur yang mendatangkan uang.

Mulai dari pengukuran

Shopify punya laporan kecepatan sendiri di Analytics › Reports › Web performance, yang memakai data pengunjung nyata (Core Web Vitals). Laporan itu bagus untuk melihat tren, tetapi tidak menjelaskan penyebab masalah.

Untuk mencari penyebabnya, uji halaman-halaman ini di webmaster.my.id dengan mode mobile:

• Beranda.
• Satu halaman koleksi (kategori).
• Satu halaman produk terlaris.
• Halaman keranjang.

Paling praktis, masukkan keempatnya sekaligus di Uji Massal. Catat skor Performa, LCP, TBT, dan CLS. Halaman produk biasanya paling penting, karena di sanalah pembeli memutuskan untuk membeli.

Langkah 1: Audit aplikasi (apps)

Aplikasi adalah penyebab paling umum toko Shopify melambat. Setiap aplikasi ulasan, pop-up, chat, upsell, atau penghitung waktu mundur bisa menambah file JavaScript dan CSS di setiap halaman, bukan hanya di halaman yang memakainya.

Cara mengauditnya:

1. Buka Settings › Apps and sales channels dan daftar semua aplikasi.
2. Untuk setiap aplikasi, tanyakan: apakah masih dipakai, dan apakah benar-benar menambah penjualan?
3. Hapus aplikasi yang tidak penting. Penting: menghapus aplikasi tidak selalu menghapus kodenya. Periksa file tema (Online Store › Themes › Edit code) dan cari sisa potongan kode di theme.liquid atau folder snippets.
4. Untuk fitur yang mirip, pilih satu aplikasi saja. Misalnya, jangan memakai dua aplikasi ulasan atau dua aplikasi pop-up.

Tema modern Shopify (Online Store 2.0) memakai app embeds dan app blocks yang bisa dimatikan dari editor tema tanpa mengedit kode. Matikan embed yang tidak dipakai di Customize › App embeds.

Langkah 2: Pilih tema yang ringan

Tema bawaan Shopify seperti Dawn dan turunannya dirancang ringan dan sudah mendapat skor performa yang baik. Banyak tema premium terlihat menarik di demo, tetapi memuat slider, animasi, dan pustaka JavaScript besar.

Saat memilih atau mengganti tema:

• Uji halaman demo tema itu di webmaster.my.id sebelum membeli.
• Hindari tema yang memakai jQuery atau banyak efek animasi saat menggulir.
• Duplikat tema yang sedang aktif sebelum mengubah apa pun, lalu uji perubahan di salinan tersebut (Preview).

Langkah 3: Optimasi gambar produk

Shopify otomatis menyajikan gambar dalam format WebP atau AVIF dan dalam beberapa ukuran, asalkan tema memakai filter gambar Liquid dengan benar, seperti image_url dengan parameter width dan atribut srcset. Tetap ada yang perlu Anda perhatikan:

• Unggah gambar dengan ukuran wajar. Lebar 2.000 piksel sudah lebih dari cukup untuk fitur zoom. File asli 8 MB dari kamera hanya memperlambat pemrosesan.
• Gunakan rasio yang konsisten untuk semua foto produk, misalnya 1:1 atau 4:5. Ini membuat tata letak koleksi rapi dan mengurangi CLS.
• Jangan lazy load gambar utama. Gambar banner di beranda dan foto pertama di halaman produk biasanya elemen LCP. Pastikan gambar tersebut memakai loading="eager" atau fetchpriority="high". Banyak tema sudah mengaturnya, tetapi tema lama dan aplikasi galeri sering lupa.
• Batasi slider banner. Slider dengan 5 gambar besar di beranda berarti 5 gambar besar yang perlu diunduh. Satu gambar hero yang kuat biasanya lebih cepat dan lebih efektif.

Lihat juga Optimasi Gambar Website.

Langkah 4: Video dan media berat

Video latar di beranda membuat toko terlihat mewah, tetapi bisa berukuran puluhan megabyte. Untuk pengunjung mobile di Indonesia, pertimbangkan:

• Menampilkan gambar statis di mobile dan video hanya di desktop.
• Memakai video pendek dengan resolusi rendah (720p atau lebih kecil) dan tanpa suara.
• Untuk video YouTube atau Vimeo, tampilkan gambar thumbnail dulu dan muat pemutar hanya saat pengunjung menekan tombol putar.

Langkah 5: Skrip pemasaran dan pelacakan

Toko online biasanya memasang banyak piksel: Meta Pixel, TikTok Pixel, Google Analytics, Google Ads, dan lainnya. Masing-masing menambah JavaScript.

• Pasang lewat integrasi resmi. Aplikasi saluran resmi seperti Facebook & Instagram, TikTok, dan Google & YouTube memakai sistem Customer Events Shopify yang lebih efisien daripada menempelkan kode manual di theme.liquid.
• Hapus piksel yang tidak dipakai. Kampanye lama sering meninggalkan kode pelacakan yang tidak pernah dilihat lagi.
• Hindari Google Tag Manager yang berisi puluhan tag tanpa pemeriksaan rutin.
• Tunda widget chat. WhatsApp chat, Tawk.to, dan sejenisnya bisa dimuat setelah halaman tampil atau setelah pengunjung menggulir.

Baca Skrip Pihak Ketiga untuk cara menunda skrip dengan aman.

Langkah 6: Font dan ikon

• Gunakan font dari pustaka font Shopify atau font sistem. Font yang dipilih lewat editor tema sudah disajikan dari CDN Shopify dengan pengaturan yang efisien.
• Batasi jumlah ketebalan font yang dipakai, misalnya hanya 400 dan 700.
• Hindari memuat pustaka ikon besar seperti Font Awesome jika hanya dipakai lima ikon. Gunakan ikon SVG langsung.

Detail teknisnya ada di Font Web yang Cepat.

Langkah 7: Kurangi isi halaman beranda

Beranda yang terlalu panjang, berisi belasan section seperti slider, koleksi unggulan, testimoni, feed Instagram, blog, dan logo partner, memaksa browser memuat semuanya. Pertahankan section yang benar-benar membantu pembeli memilih produk. Feed Instagram adalah salah satu section paling berat dan paling jarang diklik.

Domain dan pengaturan lain

• Hubungkan domain sendiri dan pastikan domain utama sudah diatur di Settings › Domains, agar alamat lain dialihkan ke satu domain.
• Shopify sudah memakai HTTPS dan CDN global. Tidak perlu memasang Cloudflare proxy di depan Shopify. Shopify tidak menyarankan konfigurasi itu, dan bisa menimbulkan masalah sertifikat.
• Periksa header keamanan dan pengalihan di hasil tes webmaster.my.id untuk memastikan domain lama dialihkan dengan benar.

Mengukur hasilnya

Uji ulang halaman yang sama setelah setiap perubahan besar. Simpan tautan halaman hasil di webmaster.my.id untuk setiap halaman agar riwayat skornya mudah dibandingkan. Pantau juga laporan Web performance Shopify selama 28 hari berikutnya, karena laporan itu memakai data pengunjung nyata dan butuh waktu untuk berubah.

Kesalahan yang sering terjadi

• Menguji hanya saat toko sepi kode. Uji dalam kondisi nyata, lengkap dengan aplikasi dan piksel yang aktif, karena itulah yang dialami pembeli.
• Memasang aplikasi baru tanpa uji ulang. Biasakan menguji halaman produk setiap kali menambah aplikasi, agar Anda tahu dampaknya pada kecepatan.
• Menghapus aplikasi tetapi membiarkan sisa kodenya. Kode yang tertinggal bisa terus memuat file yang sudah tidak ada dan memunculkan error di konsol.
• Mengejar skor sempurna dengan mengorbankan fitur penjualan. Ulasan produk dan tombol chat tetap penting. Tujuannya adalah keseimbangan, bukan angka 100.
• Mengabaikan halaman koleksi. Halaman koleksi dengan puluhan produk dan gambar hover sering lebih lambat daripada halaman produk.

Pertanyaan yang sering diajukan

Kenapa skor Shopify saya rendah padahal servernya cepat?

Server Shopify memang cepat, tetapi skor performa sebagian besar ditentukan oleh apa yang dimuat di browser: JavaScript aplikasi, piksel pemasaran, gambar besar, dan video. Periksa bagian "skrip pihak ketiga" dan "JavaScript yang tidak terpakai" di hasil tes.

Apakah menghapus aplikasi bisa merusak toko?

Bisa, jika aplikasi itu menambahkan kode ke tema. Duplikat tema sebelum menghapus, lalu periksa halaman produk, keranjang, dan checkout setelahnya. Hapus sisa kode secara manual jika perlu.

Apakah perlu aplikasi "speed booster"?

Biasanya tidak. Banyak aplikasi seperti ini hanya menambah skrip baru atau memakai trik yang mengecoh alat uji tanpa mempercepat toko bagi pembeli. Mengurangi aplikasi dan skrip jauh lebih efektif.

Berapa skor yang realistis untuk toko Shopify?

Untuk mobile, skor 60–80 sudah tergolong baik bagi toko dengan beberapa aplikasi dan piksel. Toko yang sangat minimalis dengan tema ringan bisa menembus 90. Yang lebih penting adalah LCP di bawah 2,5 detik dan CLS di bawah 0,1.