DEV Community

dwlhm
dwlhm

Posted on

react-dom.createRoot

Setelah mendeskripsikan tampilan dalam bentuk React.createElement atau JSX, langkah berikutnya dalam membangun aplikasi web dengan React.js adalah melakukan proses rendering menggunakan fungsi createRoot. Fungsi createRootyang disediakan oleh react-dom dikhususkan untuk menangani rendering pada aplikasi web.

createRootadalah fungsi di React yang digunakan untuk menerapkan elemen React (ReactElement) hasil dari React.createElement atau JSX ke dalam browser client. Fungsi ini membutuhkan elemen DOM sebagai wadah tempat penerapan ReactElement, yang bisa berupa Element, Document, atau DocumentFragment. Selain itu, terdapat parameter opsional optionsuntuk mengatur perilaku rendering React, seperti mode concurrent untuk meningkatkan efisiensi rendering asinkron.

Hasil dari createRootadalah sebuah objek yang menyediakan beberapa metode penting, antara lain:

  • render: berfungsi untuk merender ReactElement ke dalam DOM yang telah ditentukan.
  • unmount: digunakan untuk menghapus (unmount) ReactElement dari DOM.
  • _internalRoot: menyimpan informasi internal terkait DOM container yang digunakan sebagai wadah untuk ReactElement.

Dengan menggunakan createRoot, React dapat mengontrol proses rendering dan pengelolaan elemen DOM secara lebih efisien.

Top comments (1)

Collapse
 
programmerraja profile image
Boopathi

This explanation of react-dom.createRoot is really helpful! It clearly explains the function's purpose and the key methods it provides.