Waktu membaca

0

menit

Waktu membaca

0

menit

Masalah / Isu

22 Jul 2025

Publikasi/Mengatasi Masalah Kesalahan Optimasi

FramerFramer의 퍼블리시 및 최적화 오류를 이해하고 해결하는 방법을 안내하며, 코드 컴포넌트의 오류와 최적화 경고의 중요성을 강조합니다. Pengguna perlu memeriksa status optimasi untuk meningkatkan pengalaman pengguna dan SEO.

Blogger Logo Framer

Diposting oleh

Blogger profil Song Yebin

Diterjemahkan oleh

Publikasi dan panduan mengatasi masalah optimisasi melalui thumbnail blog, termasuk cara pengguna FramerFramer untuk mendebug kesalahan dan meningkatkan kondisi optimisasi.
Publikasi dan panduan mengatasi masalah optimisasi melalui thumbnail blog, termasuk cara pengguna FramerFramer untuk mendebug kesalahan dan meningkatkan kondisi optimisasi.
Publikasi dan panduan mengatasi masalah optimisasi melalui thumbnail blog, termasuk cara pengguna FramerFramer untuk mendebug kesalahan dan meningkatkan kondisi optimisasi.

Daftar Isi

Daftar Isi

Dokumen ini bertujuan untuk mengatasi kesulitan yang dialami pengguna dalam negeri dalam mempelajari FramerFramer karena kurangnya materi dalam bahasa Indonesia, dengan menerjemahkan konten dari blog resmi dan menambahkan informasi praktis. Semoga dapat memberikan manfaat bagi Anda yang menggunakan FramerFramer.

Apa itu kesalahan publikasi (Publish Error)?

Kesalahan publikasi terjadi ketika masalah muncul pada komponen atau halaman saat mendistribusikan situs, sehingga distribusi dihentikan.
Jika ada kesalahan publikasi, pemberitahuan toast “Failed to publish because there is an error on a page.” akan ditampilkan.
Dalam situasi ini, tombol Review akan terlihat, memungkinkan Anda memeriksa komponen mana yang bermasalah.

Penyebab umum yang sering terjadi

  1. Batas waktu pembuatan komponen habis

    Saat FramerFramer menyusun halaman, ia memuat dan merakit komponen satu per satu. Jika ada komponen yang terlalu lambat atau berhenti, dan waktu habis, publikasi akan gagal.
    Sebagai contoh, di alat pemeriksa web (developer tools) Anda mungkin melihat pesan seperti ensureComponentsInLoader: Component loader not updated in time.

    Cara mengatasinya

    Silakan coba publikasikan kembali. Jika terus gagal, Anda perlu memperbaiki atau bahkan menghapus komponen yang bermasalah.


  2. Komponen yang digunakan hilang (Kesalahan Hilang)

    Jika Anda menggunakan komponen yang dibuat sebelumnya, dan komponen tersebut telah dihapus, namanya diubah, atau file-nya tidak dimuat dengan benar, akan ada masalah. Di FramerFramer, komponen seperti itu akan ditampilkan sebagai kotak abu-abu di panel layer.
    Dengan menekan tombol Review, Anda dapat segera memeriksa bagian mana yang bermasalah.

    Cara mengatasinya

    Kotak abu-abu yang ditampilkan perlu Anda muat ulang atau buat baru untuk menggantikannya.

Apa itu kesalahan optimasi (Optimization Error)?

Di FramerFramer, untuk menampilkan situs lebih cepat, optimasi dilakukan dengan prapenggambaran (Pre-rendering) halaman di server. Namun, karena server bukanlah browser, informasi berikut tidak dapat diketahui.

  • Cookie

  • Ukuran jendela

  • Bahasa

  • Atau objek browser seperti window, document, navigator

최적화 경고(Optimization Warning) 화면을 나타냅니다.

Namun, jika komponen kode kustom atau Override yang Anda buat mencoba mengakses informasi tersebut, server tidak dapat menjalankannya dan akan muncul peringatan optimasi (Optimization Warning).

Status Optimasi

  1. Telah Dioptimasi (Optimized)

Deskripsi

  • FramerFramer berhasil merender halaman di server

Penyebab

  • Semua kode sepenuhnya kompatibel dengan lingkungan server

Hasil

  • Kecepatan pemuatan yang cepat

  • SEO yang baik

  • Pengalaman pengguna yang mulus

  1. Peringatan Optimasi (Optimization Warning)

Deskripsi

  • Optimalisasi tercapai, tetapi ada beberapa masalah pada kode atau strukturnya

Penyebab

  • Penggunaan API browser khusus seperti window, document

  • Struktur yang salah seperti tautan dalam tautan

  • Kriteria aksesibilitas tidak dipenuhi

Hasil

  • Beberapa konten mungkin dimuat terlambat

  • Halaman mungkin terlihat lambat atau tidak stabil

  • Penurunan aksesibilitas

  1. Kegagalan Optimasi (Optimization Error)

Deskripsi

  • Gagal merender halaman di server

Penyebab

  • Akses tidak terkontrol ke API khusus browser

  • Kesalahan kode yang kompleks

Hasil

  • Gagal merender server

  • Kompresi kode/penggabungan tidak diterapkan

  • Kecepatan lambat, SEO rendah

  • Penurunan skor Core Web Vitals

최적화 상태를 확인할 수 있는 Versions 창을 나타냅니다.

Catatan: Anda dapat memeriksa status optimasi di Settings → Domains atau Settings → Versions.

Mengapa ini penting?

  • Bahkan pada tingkat peringatan, beberapa halaman mungkin menunjukkan konten yang terlambat muncul atau terlihat kosong.

  • Jika ada kesalahan, halaman terkait dapat terkena dampak pada SEO, Core Web Vitals, dan metrik kualitas lainnya.

Komponen kode yang harus diperhatikan

Penyebab paling umum dari kesalahan optimasi adalah komponen kode yang menggunakan API khusus browser seperti window, document, dan navigator. Karena server bukanlah lingkungan browser, nilai-nilai ini tidak ada.

Dalam situasi ini, gunakanlah rendering bersyarat atau

```js
if (typeof window !== "undefined") {
  // window가 있을 때만 실행되도록 처리
}
```

Refactor kode Anda sesuai dengan panduan FramerFramer agar sesuai dengan optimasi.
Catatan: Silakan lihat panduan detail di 'How to fix custom code optimization errors'.


Artikel ini merupakan adaptasi dari konten FramerFramer blog resmi ‘How to debug a publish or optimization warning’.

Bagikan Blog

Bagikan Blog

Menjadi
FramerFramer Ahli

Framer freelance yang berpengalaman dapat mendaftar.
Menghubungkan langsung ahli dengan klien, tanpa biaya perantara.

Menjadi
FramerFramer Ahli

Framer freelance yang berpengalaman dapat mendaftar.
Menghubungkan langsung ahli dengan klien, tanpa biaya perantara.

Menjadi
FramerFramer Ahli

Jika Anda adalah ahli yang dapat mengambil proyek Framer,
semua orang dapat melamar.
Tidak ada biaya komisi, langsung menghubungkan
pakar dengan klien.