# Quick Helper For Blazor Performance

# How do you check your renders?

## Here's my method

Create a base class that inherits ComponentBase, override **ShouldRender** and **OnAfterRender** to start and stop the **Stopwatch**, and keep track of how many renders there have been.

```csharp
public class PerfTestBase : ComponentBase
{
	Stopwatch Stopwatch = new Stopwatch();
	int RenderCount =0;

	protected override bool ShouldRender()
	{
		Stopwatch.Start();
		RenderCount++;
		return base.ShouldRender();
	}
	protected override void OnAfterRender(bool firstRender)
	{
		base.OnAfterRender(firstRender);
		Stopwatch.Stop();
		Console.WriteLine($"{GetType().Name} : Render #{RenderCount} Duration {Stopwatch.ElapsedMilliseconds}");
	}
}
```

Add `@inherits PerfTestBase` to your `_Imports.razor` to make every component that doesn't already inherit a base class use this one.

*If you already use a base class, maybe consider just adding these bits to it while perf testing.*

Now, you will see log messages in your console for every Component render, like this:

``` log
App : Render #0 Duration 0
Navbar : Render #0 Duration 0
ChatRoomList : Render #0 Duration 0
Index : Render #0 Duration 0
Fetching gitter user.
Navbar : Render #1 Duration 0
ChatRoomList : Render #1 Duration 0
Index : Render #1 Duration 1
ChatRoomList : Render #2 Duration 42
ChatRoomList : Render #3 Duration 87
Navbar : Render #2 Duration 1
ChatRoomList : Render #4 Duration 127
RoomTitle : Render #0 Duration 0
RoomMessages : Render #0 Duration 0
RoomSend : Render #0 Duration 0
RoomSearch : Render #0 Duration 0
RoomMessages : Render #1 Duration 33
20 Message : Render #0 Duration 0
RoomTitle : Render #1 Duration 25
RoomMessages : Render #2 Duration 58
RoomMessages : Render #3 Duration 60
```

It's now simple to locate Components that render too often or take too long to render.

*Goes away to fix ChatRoomList - it looks slow...*

***Don't leave this in your production build - it will slow things down!***
