0Pricing
React Academy · Pelajaran

Suspense untuk Batas Asinkron (Konsep)

Gunakan Suspense untuk menampilkan cadangan saat sebagian UI belum siap. Buat batas dan pertahankan bagian halaman lainnya tetap interaktif.

Suspense untuk Batas Asinkron (Konsep) adalah pelajaran React Academy gratis di CoddyKit. Ini adalah pelajaran 2 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar React Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus React Academy mencakup 3 pelajaran total.

Apa itu Suspense?

Tujuan: Gunakan Suspense untuk membungkus bagian UI yang dimuat secara asinkron. Selama menunggu, tampilkan tampilan cadangan (pemutar atau kerangka).

Batas & tampilan cadangan

  • Batas: area terkecil yang ingin Anda tunda
  • Tampilan cadangan: hal yang ditampilkan selama pemuatan
  • Biarkan bagian layar lainnya tetap dapat digunakan

Demonstrasi: pemuatan tertunda + tampilan cadangan

Muat komponen secara tertunda dengan React.lazy. Suspense menampilkan tampilan cadangan kecil saat komponen sedang "memuat".


<div id="root"></div>

Demonstrasi: Suspense bertingkat

Anda dapat membuat batas bertingkat agar satu bagian yang lambat tidak menghambat bagian lainnya. Setiap batas menampilkan tampilan cadangannya sendiri.


<div id="root"></div>

Tempat menempatkan batas

  • Bungkus hanya bagian yang dimuat
  • Pilih tampilan cadangan yang kecil dan membantu (pemutar atau kerangka)
  • Gunakan batas yang bertingkat untuk area yang tidak saling bergantung

Hal yang perlu diperhatikan & batasan

Catatan:

  • Suspense bekerja dengan komponen yang menangguhkan (misalnya, React.lazy dan pustaka data yang mendukung Suspense).
  • Tampilan cadangan dirender selama menunggu; hindari logika berat di dalamnya.

Pemeriksaan tujuan Suspense

Apa tujuan batas Suspense dalam React?

Ringkasan

Ringkasan: Bungkus bagian yang lambat dengan Suspense dan sediakan tampilan cadangan yang membantu. Gunakan batas bertingkat agar bagian yang tidak saling bergantung dimuat secara terpisah.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Suspense untuk Batas Asinkron (Konsep)” gratis?

Ya — teks lengkap “Suspense untuk Batas Asinkron (Konsep)” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus React Academy, upgrade ke CoddyKit PRO. Kursus React Academy mencakup 3 pelajaran total.

Apa yang akan aku pelajari di “Suspense untuk Batas Asinkron (Konsep)”?

Gunakan Suspense untuk menampilkan cadangan saat sebagian UI belum siap. Buat batas dan pertahankan bagian halaman lainnya tetap interaktif. Kamu berlatih React Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai React Academy?

Tidak diperlukan pengalaman sebelumnya. React Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 2 dari 3.

Berapa lama pelajaran “Suspense untuk Batas Asinkron (Konsep)” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran React Academy ini?

Ya. Setiap pelajaran React Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

  1. useTransition untuk UI Tertunda (Dasar Konkruensi)
  2. Suspense untuk Batas Asinkron (Konsep)
  3. Cadangan & Pemisahan Jalur Lambat
← Kembali ke React Academy