ASP.NET Core Blazor 성능 모범 사례

Blazor는 가장 현실적인 애플리케이션 UI 시나리오에서 고성능을 구현하도록 최적화되어 있습니다. 그러나 최상의 성능을 위해서는 개발자가 적합한 패턴과 기능을 채택해야 합니다.

비고

이 문서 노드의 코드 예제는 NRT(nullable 참조 형식) 및 .NET 컴파일러 null 상태 정적 분석을 채택하며, 이는 .NET 6 이상의 ASP.NET Core에서 지원됩니다.

AOT(Ahead-Of-Time) 컴파일

AOT(Ahead-of-Time) 컴파일은 앱의 .NET 코드를 네이티브 WebAssembly로 변환하여 브라우저가 직접 실행할 수 있도록 Blazor 컴파일합니다. AOT 컴파일 앱을 사용하면 다운로드하는 데 더 많은 시간이 소요되지만 AOT 컴파일된 앱, 특히 CPU 집약적 작업을 실행하는 앱의 경우, 일반적으로 더 나은 런타임 성능을 제공합니다. 자세한 내용은 ASP.NET Core Blazor WebAssembly 빌드 도구 및 AOT(Ahead-Of-Time) 컴파일을 참조하세요.

메트릭 및 추적

메트릭 및 추적 기능은 앱 성능을 모니터링 및 진단하고, 사용자 상호 작용을 추적하고, 프로덕션 환경의 구성 요소 동작을 이해하는 데 도움이 됩니다.

구성 / 설정

앱에서 Blazor 메트릭 및 추적을 활성화하려면, 서비스가 등록된 앱의 파일에서 다음과 같은 미터 및 활동 소스를 사용하여 Program를 구성합니다.

builder.Services.ConfigureOpenTelemetryMeterProvider(meterProvider =>
{
    meterProvider.AddMeter("Microsoft.AspNetCore.Components");
    meterProvider.AddMeter("Microsoft.AspNetCore.Components.Lifecycle");
    meterProvider.AddMeter("Microsoft.AspNetCore.Components.Server.Circuits");
});

builder.Services.ConfigureOpenTelemetryTracerProvider(tracerProvider =>
{
    tracerProvider.AddSource("Microsoft.AspNetCore.Components");
    tracerProvider.AddSource("Microsoft.AspNetCore.Components.Server.Circuits");
});

성능 미터

다음 성능 미터에 대한 자세한 내용은 ASP.NET Core 기본 제공 메트릭을 참조하세요.

Microsoft.AspNetCore.Components 미터:

• aspnetcore.components.navigate: 앱의 총 경로 변경 횟수를 추적합니다.
• aspnetcore.components.handle_event.duration: 비즈니스 논리를 포함하여 브라우저 이벤트를 처리하는 기간을 측정합니다.

Microsoft.AspNetCore.Components.Lifecycle 미터:

• aspnetcore.components.update_parameters.duration: 비즈니스 논리를 포함하여 구성 요소 매개 변수 처리 기간을 측정합니다.
• aspnetcore.components.render_diff.duration: 렌더링 일괄 처리 기간을 추적합니다.
• aspnetcore.components.render_diff.size: 렌더링 일괄 처리의 크기를 추적합니다.

Microsoft.AspNetCore.Components.Server.Circuits 미터:

서버 쪽 Blazor 앱에서 회로별 추가 메트릭은 다음과 같습니다.

• aspnetcore.components.circuit.active: 현재 메모리에 있는 활성 회로 수를 표시합니다.
• aspnetcore.components.circuit.connected: 클라이언트에 연결된 회로 수를 추적합니다.
• aspnetcore.components.circuit.duration: 회로 수명 기간을 측정하고 총 회로 수를 제공합니다.

Blazor 추적

다음 추적 활동에 대한 자세한 내용은 ASP.NET Core 기본 제공 메트릭을 참조하세요.

새 활동 추적 기능은 활동 원본을 사용 Microsoft.AspNetCore.Components 하며 회로 수명 주기, 탐색 및 이벤트 처리의 세 가지 주요 유형의 추적 작업을 제공합니다.

회로 수명 주기 추적:

Microsoft.AspNetCore.Components.StartCircuit: 형식 Circuit {circuitId}을 사용하여 회로 초기화를 추적합니다.

태그:

• aspnetcore.components.circuit.id: 고유 회로 식별자입니다.
• error.type: 예외 유형 전체 이름(선택 사항)

링크:

• HTTP 추적
• SignalR 트레이스

사용: 동일한 세션/회로의 다른 Blazor 추적을 HTTP 및 SignalR 컨텍스트에 연결합니다.

탐색 추적:

Microsoft.AspNetCore.Components.Navigate: 형식 Route {route} -> {componentType}을 사용하여 경로 변경 내용을 추적합니다.

태그:

• aspnetcore.components.route: 페이지의 URL 경로 패턴입니다.
• aspnetcore.components.type: 구성 요소의 Razor 클래스 이름입니다.
• error.type: 예외 유형 전체 이름(선택 사항).

링크:

• HTTP 추적
• SignalR 트레이스
• 회로 추적

어떤 Blazor 페이지가 이 세션에서 방문되었습니까?

이벤트 처리 추적:

Microsoft.AspNetCore.Components.HandleEvent: 형식 Event {attributeName} -> {componentType}.{methodName}을 사용하여 이벤트 처리를 추적합니다.

태그:

• aspnetcore.components.attribute.name: 이벤트를 트리거하는 HTML 특성의 이름(예: onClick)입니다.
• code.function.name: 처리기의 C# 메서드 이름입니다.
• aspnetcore.components.type: 이벤트를 수신하는 대상 C# 구성 요소의 전체 이름입니다.
• error.type: 예외 유형 전체 이름(선택 사항).

링크:

• 회로 추적
• 경로 추적

사용:

• 예외를 발생시킨 구성 요소와 페이지를 클릭하십시오.
• 어떤 연결된 회로에서 어떤 HTTP 컨텍스트가 발생합니까?