Every Blazor component goes through a predictable lifecycle. Understanding these methods lets you load data at the right time and clean up resources properly.

Lifecycle Methods in Order

• SetParametersAsync — called first; sets parameter values
• OnInitialized / OnInitializedAsync — called once on first render; best place to load initial data
• OnParametersSet / OnParametersSetAsync — called every time parameters change
• OnAfterRender / OnAfterRenderAsync — called after each render; safe for JS interop here
• Dispose / DisposeAsync — called when component is removed; implement IDisposable to clean up

Load Data on Init

protected override async Task OnInitializedAsync()
{
    products = await Http.GetFromJsonAsync<List<Product>>("/api/products");
}

FirstRender Guard

protected override async Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        await JS.InvokeVoidAsync("initChart");
    }
}

Use the firstRender flag to avoid running JS interop on every re-render.

Reference:

Wikipedia: Component-Based Software Engineering

https://en.wikipedia.org/wiki/Component-based_software_engineering