Microsoft MVP성태의 닷넷 이야기
닷넷: 2161. .NET Conf 2023 - Day 1 Blazor 개요 정리 [링크 복사], [링크+제목 복사],
조회: 12174
글쓴 사람
정성태 (techsharer at outlook.com)
홈페이지
첨부 파일
 

(시리즈 글이 5개 있습니다.)
닷넷: 2161. .NET Conf 2023 - Day 1 Blazor 개요 정리
; https://www.sysnet.pe.kr/2/0/13446

닷넷: 2163. .NET 8 - Dynamic PGO를 결합한 성능 향상
; https://www.sysnet.pe.kr/2/0/13448

닷넷: 2178. C# - .NET 8부터 COM Interop에 대한 자동 소스 코드 생성 도입
; https://www.sysnet.pe.kr/2/0/13470

닷넷: 2180. .NET 8 - 함수 포인터에 대한 Reflection 정보 조회
; https://www.sysnet.pe.kr/2/0/13475

닷넷: 2181. C# - .NET 8 JsonStringEnumConverter의 AOT를 위한 개선
; https://www.sysnet.pe.kr/2/0/13476




.NET Conf 2023 - Day 1 Blazor 개요 정리

아래의 동영상에서,

.NET Conf 2023 - Day 1
; https://youtu.be/xEFO1sQ2bUc?t=5853

본 내용을 개인적인 흥미로 간략하게 정리한 것입니다.




.NET 8의 Blazor는 기존의 "Server", "WebAssembly" 모드에 이어 새롭게 "Static SSR" 모드를 지원한다고 합니다. 이 모드의 특징은,

* Scale (WebSocket을 사용하지 않으므로.)
* Presenting Information
* Navigation (links)
* Forms

등이 가능하고,

x Rich interactivity (all events handlers)
x Real-time updates

가 불가능합니다. 대신 위의 2가지 사항에 대해서는 부가적으로 기존의 Server, WebAssembly 모드를 섞어 해결할 수 있습니다.

net8_blazor_overview_1.png

설정도 단순히, @rendermode를 통해 가능합니다.

@rendermode InteractiveServer // by WebSocket
@rendermode InteractiveWebAssembly
@rendermode InteractiveAuto

그리고, 아래와 같은 특징의 "Streaming SSR" 모드를 지원하고,

Skip waiting for database/API calls

* Fast initial UI render/update
* Begin loading static resources in parallel
! Requires UI design to make sense
  * Use when data loading is likely to take multiple seconds

코드에서는 간략하게 "@attribute [StreamRendering]"를 추가하는 것으로 그 효과를 볼 수 있습니다.

@page "/timercounter"
@attribute [StreamRendering]

<p>
   The count is: @count
</p>

@code {
    int count;

    protected override async Task OnInitializedAsync()
    {
        for (var i = 0; i < 5; i ++)
        {
            await Task.Dealy(1000);
            count ++;
            StateHasChanged(); // Only needed to show intermediate states
        }
    }
}




"Enhanced navigation"과 함께,

 Get SPA-like responsiveness without needing a SPA

* Faster page loads with fewer HTTP requests
* Retain most DOM elements
* Enable/disable on any DOM subtree
  * On by default
  ! Consider disabling to reset JS state or navigating to non-Blazor pages

"Static SSR Forms"도 추가되었고,

Accept and validate input on static SSR pages

* All capabilities of  or EditForm
   * @onsubmit handlers
   * anti-forgery protection (CSRF)
   * server-side validation

* Same APIs as for interactive components
* Supports enhance and works with streaming SSR

Interactive components도 제공합니다.

Get full Blazor interactivity, arbitrary events, and real-time updates
 
* Mark any page/components as Server/WebAssembly/both
* Works with enhanced navigation / forms
  * Retain interactive state while navigating or refreshing static SSR content
  * Closes/reopens server circuit automatically
! Requires WebSocket connection or WebAssembly payload

마지막으로, 웹 소켓을 요구하는 "Server"와 "WebAssembly" 간에 고민을 해결할 수 있는 "Auto mode"가 나왔습니다.

Use WebAssembly without the first-download cost

* Uses Server while caching WebAssembly files
* ... then uses WebAssembly on the next visit
! Components must support WebAssembly
  * Must be in Client project and use API endpoints for data




기존 응용 프로그램 방식을 Blazor로 옮기는 경우 다음과 같이 대응할 수 있습니다.

net8_blazor_overview_2.png

최종 기능 정리는 이렇게!

net8_blazor_overview_3.png

개인적으로, blazor를 거의 사용해 본 적이 없지만 처음 blazor를 접했던 2018년보다 확실히 많은 진전이 있음을 체감할 수 있었습니다.

흥미 있으신 분은 다음의 사이트에서. ^^

Build beautiful web apps with Blazor
; https://blazor.net




[이 글에 대해서 여러분들과 의견을 공유하고 싶습니다. 틀리거나 미흡한 부분 또는 의문 사항이 있으시면 언제든 댓글 남겨주십시오.]







[최초 등록일: ]
[최종 수정일: 11/16/2023]

Creative Commons License
이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-변경금지 2.0 대한민국 라이센스에 따라 이용하실 수 있습니다.
by SeongTae Jeong, mailto:techsharer at outlook.com

비밀번호

댓글 작성자
 




... 76  [77]  78  79  80  81  82  83  84  85  86  87  88  89  90  ...
NoWriterDateCnt.TitleFile(s)
12042정성태10/26/201918660오류 유형: 573. OneDrive 하위에 위치한 Documents, Desktop 폴더에 대한 권한 변경 시 "Unable to display current owner"
12041정성태10/23/201920219오류 유형: 572. mstest.exe - The load test results database could not be opened.
12040정성태10/23/201920708오류 유형: 571. Unhandled Exception: System.Net.Mail.SmtpException: Transaction failed. The server response was: 5.2.0 STOREDRV.Submission.Exception:SendAsDeniedException.MapiExceptionSendAsDenied
12039정성태10/22/201917676스크립트: 16. cmd.exe의 for 문에서는 ERRORLEVEL이 설정되지 않는 문제
12038정성태10/17/201918188오류 유형: 570. SQL Server 2019 RC1 - SQL Client Connectivity SDK 설치 오류
12037정성태10/15/201925806.NET Framework: 867. C# - Encoding.Default 값을 바꿀 수 있을까요?파일 다운로드1
12036정성태10/14/201927135.NET Framework: 866. C# - 고성능이 필요한 환경에서 GC가 발생하지 않는 네이티브 힙 사용파일 다운로드1
12035정성태10/13/201920522개발 환경 구성: 461. C# 8.0의 #nulable 관련 특성을 .NET Framework 프로젝트에서 사용하는 방법 [2]파일 다운로드1
12034정성태10/12/201920021개발 환경 구성: 460. .NET Core 환경에서 (프로젝트가 아닌) C# 코드 파일을 입력으로 컴파일하는 방법 [1]
12033정성태10/11/201924461개발 환경 구성: 459. .NET Framework 프로젝트에서 C# 8.0/9.0 컴파일러를 사용하는 방법
12032정성태10/8/201920083.NET Framework: 865. .NET Core 2.2/3.0 웹 프로젝트를 IIS에서 호스팅(Inproc, out-of-proc)하는 방법 - AspNetCoreModuleV2 소개
12031정성태10/7/201918027오류 유형: 569. Azure Site Extension 업그레이드 시 "System.IO.IOException: There is not enough space on the disk" 예외 발생
12030정성태10/5/201925101.NET Framework: 864. .NET Conf 2019 Korea - "닷넷 17년의 변화 정리 및 닷넷 코어 3.0" 발표 자료 [1]파일 다운로드1
12029정성태9/27/201925325제니퍼 .NET: 29. Jennifersoft provides a trial promotion on its APM solution such as JENNIFER, PHP, and .NET in 2019 and shares the examples of their application.
12028정성태9/26/201920919.NET Framework: 863. C# - Thread.Suspend 호출 시 응용 프로그램 hang 현상을 해결하기 위한 시도파일 다운로드1
12027정성태9/26/201915574오류 유형: 568. Consider app.config remapping of assembly "..." from Version "..." [...] to Version "..." [...] to solve conflict and get rid of warning.
12026정성태9/26/201921900.NET Framework: 862. C# - Active Directory의 LDAP 경로 및 정보 조회
12025정성태9/25/201920135제니퍼 .NET: 28. APM 솔루션 제니퍼, PHP, .NET 무료 사용 프로모션 2019 및 적용 사례 (8) [1]
12024정성태9/20/201922089.NET Framework: 861. HttpClient와 HttpClientHandler의 관계 [2]
12023정성태9/18/201922600.NET Framework: 860. ServicePointManager.DefaultConnectionLimit와 HttpClient의 관계파일 다운로드1
12022정성태9/12/201926114개발 환경 구성: 458. C# 8.0 (Preview) 신규 문법을 위한 개발 환경 구성 [3]
12021정성태9/12/201942201도서: 시작하세요! C# 8.0 프로그래밍 [4]
12020정성태9/11/201925178VC++: 134. SYSTEMTIME 값 기준으로 특정 시간이 지났는지를 판단하는 함수
12019정성태9/11/201918883Linux: 23. .NET Core + 리눅스 환경에서 Environment.CurrentDirectory 접근 시 주의 사항
12018정성태9/11/201917698오류 유형: 567. IIS - Unrecognized attribute 'targetFramework'. Note that attribute names are case-sensitive. (D:\lowSite4\web.config line 11)
12017정성태9/11/201921594오류 유형: 566. 비주얼 스튜디오 - Failed to register URL "http://localhost:6879/" for site "..." application "/". Error description: Access is denied. (0x80070005)
... 76  [77]  78  79  80  81  82  83  84  85  86  87  88  89  90  ...