Virtual DOM (VDOM) एक हल्का JavaScript object tree हो जसले वर्णन गर्दछ कि UI कस्तो देखिनु पर्छ। यो एक सरल मेमोरीमा भएको प्रतिनिधित्व हो — वास्तविक ब्राउजर DOM होइन। React यसलाई प्रयोग गर्दछ किनभने वास्तविक DOM लाई सीधै हेरफेर गर्नु ढिलो हुन्छ, र प्रत्येक state परिवर्तनमा यो म्यानुएली गर्नु त्रुटि-सम्भव हुन्छ।
जब state परिवर्तन हुन्छ, React तुरुन्त पृष्ठलाई छोयदैन। यसको सट्टा:
function Counter() {
const [n, setN] = useState(0);
// Each click produces a NEW virtual tree describing <button>{n}</button>.
// React compares old vs new and updates ONLY the text node that changed,
// not the whole button or the page.
return <button onClick={() => setN(n + 1)}>{n}</button>;
}
त्यसोभए तपाई घोषणात्मक रुपमा कोड लेख्नु हुन्छ ("UI यस तरीकाले दिखिन्छ यस state को लागि") र React ले imperative DOM अपरेशनहरू तपाईको लागि काढेर दिन्छ।
document.querySelector + mutate भन्दा गर्न सजिलो हुन्छ।