Contexto y Problema
Imaginemos un componente Blazor que muestra un mensaje personalizado basado en un parámetro de entrada. En la implementación inicial, la lógica para calcular el mensaje se realiza directamente durante el renderizado del componente. Aunque funcional, esta aproximación puede llevar a una ejecución innecesaria de cálculos repetitivos, especialmente cuando el componente se renderiza múltiples veces.
<span style="font-size:@FontSize;">
@if (!string.IsNullOrEmpty(Name))
{
var greeting = $"Hello, {Name}!";
<p>@greeting</p>
}
else
{
<p>Hello, Guest!</p>
}
</span>
@code {
[Parameter] public string Name { get; set; }
[Parameter] public string FontSize { get; set; } = "16px";
}
Optimización
Para mejorar el rendimiento, podemos mover la lógica de cálculo a OnParametersSet, asegurando que los cálculos solo se realicen cuando los parámetros cambien. Esto reduce la carga de procesamiento durante cada renderizado y mejora la claridad del código.
<span style="font-size:@FontSize;">
<p>@GreetingMessage</p>
</span>
@code {
[Parameter] public string Name { get; set; }
[Parameter] public string FontSize { get; set; } = "16px";
private string GreetingMessage { get; set; }
protected override void OnParametersSet()
{
if (!string.IsNullOrEmpty(Name))
{
GreetingMessage = $"Hello, {Name}!";
}
else
{
GreetingMessage = "Hello, Guest!";
}
}
}
