𝗦𝘁𝗼𝗽 𝗕𝗹𝗼𝗰𝗸𝗶𝗻𝗴 𝗧𝗵𝗲 𝗨𝗜: 𝗜𝗻𝘁𝗲𝗿𝗿𝘂𝗽𝘁𝗶𝗯𝗹𝗲 𝗥𝗲𝗻𝗱𝗲𝗿𝗶𝗻𝗴 𝗜𝗻 𝗥𝗲𝗮𝗰𝘁

𝗦𝘁𝗼𝗽 𝗕𝗹𝗼𝗰𝗸𝗶𝗻𝗴 𝗧𝗵𝗲 𝗨𝗜: 𝗜𝗻𝘁𝗲𝗿𝗿𝘂𝗽𝘁𝗶𝗯𝗹𝗲 𝗥𝗲𝗻𝗱𝗲𝗿𝗶𝗻𝗴 𝗜𝗻 𝗥𝗲𝗮𝗰𝘁

Proses render React dapat membekukan antarmuka pengguna (UI) Anda.

Komputasi yang berat memblokir main thread. Pengguna Anda akan melihat layar yang membeku. Hal ini merusak pengalaman pengguna.

Interruptible rendering mengatasi masalah ini. Fitur ini memungkinkan React menjeda pekerjaan untuk menangani input pengguna.

Cara kerjanya:

• React membagi pekerjaan menjadi potongan-potongan kecil.
• Ia memeriksa tugas prioritas tinggi seperti klik atau mengetik.
• Jika pengguna berinteraksi, React menjeda tugas latar belakang tersebut.
• React menangani input terlebih dahulu.
• React melanjutkan kembali tugas latar belakang tersebut kemudian.

Anda menggunakan transitions untuk mengelola hal ini. Gunakan useTransition untuk menandai pembaruan yang tidak mendesak. Ini memberi tahu React untuk menjaga UI tetap responsif.

Jangan biarkan pemrosesan data yang berat merusak performa aplikasi Anda.

Sumber: https://dev.to/iprajapatiparesh/stop-blocking-the-ui-interruptible-rendering-in-react-32mb