SvelteJS component’s lifecycle for React developers

SvelteJS for React Developers

I am working as React Developer for past 3 years now. I love to work with ReactJS/React Native. For some months I am using SvelteJS for my small and personal projects and it’s new fresh air in the JS environment and am really enjoying it.

I have already written some articles related to SvelteJS.

• A Basic Introduction to Svelte by Building a TodoApp App
• SvelteJS component’s lifecycle

I find lifecycle in ReactJS and SvelteJS very much similar and very easy to understand. If you want to understand the lifecycle of React(class based lifecycle), check this.

I will be comparing the useEffect hook of React to lifecycle of Svelte.

Mounting (initialization)

Mounting is the initial and first lifecycle of any component where component is created and inserted in DOM.

REACT:

SVELTE :

After/Before Update

If there is any state change, we can listen that update or get inform about that change.

REACT:

SVELTE :

UnMount/Destory

After component is leaved or unmounted, we need to perform some tasks.

REACT:

SVELTE :

SvelteJS is very easy to learn and follow. Try once, you will love it.

Thanks for reading.