The React LifeCycle - Simple Language


To mitro aaj hm fir haazir h apki sewa m , Chaliye mitro aaj hm React LifeCycle ka Funda samjhte hai or doubt clear krte hai, aakhir ye life cycle ka funda h kya , bahut baar interview m bhi pucha jata h.

React ka Component Lifecycle ek tarah ka journey hai jo har React component ko through karna padta hai jab woh create hota hai, update hota hai, ya destroy hota hai. Isme kuch steps hote hain jaise ki:

Initialization (Pehli Mulakat): Jab component create hota hai, toh constructor() function chalta hai, jisme initial state aur props set hote hain.

Mounting (Pahad par chadhna): Yeh phase jab component pehli baar DOM mein render hota hai. Isme do functions chalte hain: componentWillMount() aur componentDidMount(). Pehla function render se pehle chalta tha, dusra render hone ke baad.

Updating (Naye Rang Dikhana): Jab koi update hota hai, naye props ya state aate hain toh component re-renders hota hai. Yahaan shouldComponentUpdate(), componentWillUpdate(), aur componentDidUpdate() functions hote hain jo is process mein madad karte hain.

Unmounting (Alvida Kehna): Jab component DOM se remove hota hai, tab componentWillUnmount() function chalta hai jisme cleanup ki activities hoti hain jaise ki event listeners ya subscriptions ko remove karna.

Error Handling (Galti se Bhool): Agar koi error aata hai during rendering, toh componentDidCatch() function error ko catch karke fallback UI render karta hai.


In sab phases mein, developers ko functions provide kiye gaye hain jo specific actions execute karne ke liye use hote hain. Yeh saare steps ek component ke life cycle ko define karte hain aur inki madad se developers component ke behavior ko control kar sakte hain as per requirement.


Popular posts from this blog

React Reconciliation

Image
                           React Reconciliation        T oh, picture ye hai ki React ka reconciliation ek bahut  important concept hai. Ye basically process hai jisme React check karta hai ki kya changes huye hai component ke props ya state mein aur phir wo changes ko reflect karta hai DOM mein. Toh aap imagine karo, ki aapki website pe koi ek component hai jiska data change ho gaya. Ab React kehta hai, "Chalo bhai, ab main check karunga ki kya changes huye hain." Wo pehle naye aur purane data ko compare karta hai, fir dekhta hai ki kya actual DOM mein change hona chahiye. Ye process bahut smart hai, kyun ki React sirf actual changes ko update karta hai instead of pura DOM rebuild karke. Isse performance improve hoti hai. Ab, agar React ko lagta hai ki data mein kuch badlaav hua hai, toh wo ek algorithm use karta hai jiska naam hai "Diffing algorithm." Ye algorithm compare k...
Read more

Virtual Dom kaise kaam krta hai ?

Image
                  Virtual Dom kaise kaam krta hai ?  Virtual DOM ka funda samajhne ke liye pehle real DOM ke baare mein thoda sa bata doon. Real DOM woh actual HTML elements hote hain jo browser mein dikhte hain, jaise ki heading tag, paragraph tag, ya koi bhi HTML tags. Virtual DOM basically real DOM ki copy hai . Jab hum koi change karte hain apne webpage mein, jaise ki koi text update ya element remove karna ho, toh sabse pehle woh change Virtual DOM mein hota hai, Real DOM mein nahi. Yeh Virtual DOM kaafi fast hota hai as compared to Real DOM, because it's just a copy, not the actual thing that the user sees. Ab, jab yeh changes Virtual DOM mein hote hain,then React smartly compares the current Virtual DOM with the previous one, using a process called " reconciliation ." Woh dekhta hai kya changes huye hain and then Jab React ko pata chal jata hai ki Virtual DOM mein kya change hua hai, tab woh smartly decide karta hai ki Real DOM me...
Read more