Component Lifecycle

Lightning web components have a lifecycle managed by the framework. The framework creates components, inserts them into the DOM, renders them, and removes them from the DOM. It also monitors components for property changes.

• Lifecycle Flow

• This diagram shows the flow of the component lifecycle from creation through render.
• Run Code When a Component Is Created
  The constructor() method fires when a component instance is created. Don’t add attributes to the host element during construction. You can add attributes to the host element in any other lifecycle hook.
• Run Code When a Component Is Inserted or Removed from the DOM
  The connectedCallback() lifecycle hook fires when a component is inserted into the DOM. The disconnectedCallback() lifecycle hook fires when a component is removed from the DOM.
• Run Code When a Component Renders
  The renderedCallback() is unique to Lightning Web Components. Use it to perform logic after a component has finished the rendering phase.
• Handle Component Errors
  The errorCallback() is unique to Lightning Web Components. Implement it to create an error boundary component that captures errors in all the descendent components in its tree. It captures errors that occur in the descendant's lifecycle hooks or during an event handler declared in an HTML template. You can code the error boundary component to log stack information and render an alternative view to tell users what happened and what to do next.

Refer By:

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_lifecycle_hooks_intro