A component is instantiated, rendered, and rerendered during its lifecycle. A component rerenders only when there’s a programmatic or value change that requires a rerender. For example, if a browser event triggers an action that updates the component’s data, the component rerenders.
In Aura Components, just like in Lightning Web Components, you can use life cycle hooks to control the behavior of your components at various stages of their life cycle. Understanding and using these hooks is crucial for building effective Aura Components. Here are some of the most commonly used life cycle hooks in Aura Components:
You will learn in this section
1. init()
2. render()
3. afterRender()
4. rerender()
5. urender()
1. init:
The init() life cycle hook is fired when the component is initialized. It's often used for setting up initial values and configurations.
2. render:
The render() life cycle hook is triggered when the component is rendered. It's used to define the component's markup and structure. The render() lief cycle hook return DOM node, array of DOM nodes or nothing.
3. afterRender:
The afterRender() life cycle hook is fired after the component has been rendered in the DOM. You can use it for tasks that require access to the DOM after rendering. It is not final call in the rendering lifecycle. It is simply called after render() and it does not return a value.
4. rerender:
The rerender() life cycle hook is called when the component should re-render due to changes in its attributes or other factors. If you do update something in component it does automatically call the rerender() life cycle hook. It dose not return a value.
5. unrender:
The unrender() life cycle hook is triggered when the component is removed from the DOM. It's used for cleanup tasks like removing event listeners. This life cycle hook be usefull when you are working with third-party library that are not navtive to the framework.