본문 바로가기

전체 글

React useTransition vs useDeferredValue 차이와 선택 기준 정리 한 줄 요약: React useTransition은 상태를 바꾸는 코드(setState)를 낮은 우선순위로 표시하고, useDeferredValue는 이미 받은 값의 업데이트를 뒤로 미룹니다. 내가 setState를 직접 호출할 수 있으면 useTransition, props나 외부 라이브러리에서 값만 받는다면 useDeferredValue를 선택하세요. 두 훅 모두 React 18의 동시성 렌더링(Concurrent Rendering)을 기반으로 하며, 무거운 렌더링 때문에 입력이 버벅이는 문제를 줄여 줍니다.React useTransition과 useDeferredValue는 무엇인가요?useTransition은 상태 업데이트를 "긴급하지 않은 전환(transition)"으로 표시해 UI 차단 없이 .. 더보기
C# IAsyncEnumerable 사용법과 await foreach 정리 한 줄 요약: C# IAsyncEnumerable는 비동기로 생성되는 데이터를 한 건씩 흘려보내는 비동기 스트림 인터페이스이며, await foreach로 소비합니다. C# 8.0(.NET Core 3.0)부터 지원되고, async 메서드 안에서 yield return을 쓰면 간단히 만들 수 있습니다.C# IAsyncEnumerable이란 무엇인가요?IAsyncEnumerable는 System.Collections.Generic 네임스페이스에 정의된, 비동기 방식으로 요소를 하나씩 열거하는 인터페이스입니다. 기존 IEnumerable가 "다음 요소를 동기적으로 가져오는" 방식이라면, IAsyncEnumerable는 다음 요소를 가져오는 과정(MoveNextAsync)이 ValueTask를 반환해 대기할 .. 더보기
React useActionState 사용법: React 19 폼 상태 관리 정리 한 줄 요약: React useActionState는 React 19에서 폼 액션의 결과를 상태로 관리하고 pending 여부까지 함께 돌려주는 훅입니다. const [state, formAction, isPending] = useActionState(action, initialState) 형태로 쓰며, useState와 onSubmit을 조합하던 폼 코드를 크게 줄여 줍니다.React useActionState란 무엇인가요?useActionState는 폼 액션이 실행된 결과를 상태로 저장하고, 그 상태와 새 액션 함수, 진행 중 여부(isPending)를 반환하는 React 19의 내장 훅입니다. React 18 Canary 시절 react-dom의 useFormState로 불리던 훅이 이름이 바뀌어 .. 더보기
C# Task.WhenAll 사용법: 비동기 병렬 처리와 Parallel.ForEachAsync 비교 한 줄 요약: C#에서 여러 비동기 작업을 동시에 실행하려면 Task.WhenAll로 작업을 모두 시작한 뒤 한 번에 await 하면 됩니다. 동시 실행 개수를 제한해야 하면 SemaphoreSlim 또는 .NET 6부터 제공되는 Parallel.ForEachAsync를 사용하세요.이 글은 C# 비동기 병렬 처리의 핵심인 Task.WhenAll의 동작 방식, 예외 처리, 동시 실행 수 제한, Parallel.ForEachAsync와의 차이를 .NET 8 기준으로 정리합니다.Task.WhenAll이란 무엇인가요?Task.WhenAll은 여러 개의 Task가 모두 완료되면 완료되는 하나의 Task를 반환하는 정적 메서드입니다. 새로운 스레드를 만드는 기능이 아니라, 이미 시작된 비동기 작업들을 한꺼번에 기다.. 더보기
React useEffect 무한 루프 원인과 해결 방법 5가지 정리 한 줄 요약: React useEffect 무한 루프는 effect 안에서 상태를 바꾸는데 그 상태(또는 매 렌더링마다 새로 만들어지는 객체·함수)가 의존성 배열에 들어 있어서 "렌더링 → effect → 상태 변경 → 재렌더링"이 끝없이 반복될 때 발생합니다. 의존성 배열을 점검하고, 객체·함수 참조를 고정하거나, effect 자체를 없애는 것이 해결책입니다.React useEffect 무한 루프란 무엇인가요?useEffect 무한 루프(무한 렌더링)는 effect가 실행될 때마다 상태가 갱신되고, 그 갱신이 다시 같은 effect를 실행시키는 상태를 말합니다. 브라우저 콘솔에 "Maximum update depth exceeded" 경고가 뜨거나 네트워크 탭에 같은 요청이 계속 쌓인다면 대부분 이 문.. 더보기
C# 기본 생성자(Primary Constructor) 사용법: C# 12 클래스·구조체 정리 한 줄 요약: C# 기본 생성자(Primary Constructor)는 C# 12부터 클래스와 구조체의 선언부에 생성자 매개변수를 바로 쓸 수 있게 해 주는 문법입니다. 의존성 주입(DI) 코드의 필드 선언과 대입 보일러플레이트를 크게 줄여 주지만, 매개변수는 자동으로 속성이 되지 않는다는 점을 반드시 알아야 합니다.C# 기본 생성자(Primary Constructor)란 무엇인가요?C# 기본 생성자는 타입 이름 뒤 괄호에 매개변수 목록을 선언하면 해당 매개변수를 타입 본문 전체에서 사용할 수 있게 하는 C# 12 문법입니다. .NET 8과 함께 제공되며, 이전에는 record 타입에서만 가능했던 형태를 일반 class와 struct로 확장한 것입니다.public class OrderService(ILo.. 더보기
React useMemo vs useCallback 차이와 사용 시점 정리 한 줄 요약: React useMemo는 계산 결과 값을 캐싱하고, useCallback은 함수 자체를 캐싱한다. 두 훅 모두 의존성 배열이 바뀌지 않으면 이전 값을 재사용하며, 비싼 계산이나 React.memo로 감싼 자식 컴포넌트에 전달하는 함수처럼 실제로 리렌더링 비용이 문제일 때만 쓰는 것이 좋다.React에서 useMemo와 useCallback 차이를 헷갈리는 분이 많다. 이 글에서는 두 훅의 정의, 사용 시점, React.memo와의 관계, 흔한 실수를 React 18/19 기준 예제와 함께 정리한다.useMemo와 useCallback은 각각 무엇인가요?useMemo는 렌더링 사이에 계산 결과를 캐싱하는 React 훅이고, useCallback은 렌더링 사이에 함수 정의를 캐싱하는 Reac.. 더보기
C# 컬렉션 식 사용법: C# 12 대괄호 문법과 spread 연산자 정리 한 줄 요약: C# 컬렉션 식(collection expression)은 C# 12(.NET 8)에서 추가된 문법으로, [1, 2, 3]처럼 대괄호 하나로 배열, List, Span 등 다양한 컬렉션을 같은 방식으로 만들 수 있습니다. 여러 컬렉션을 합칠 때는 spread 연산자 ..를 사용합니다. 컬렉션 타입마다 다른 초기화 문법을 외울 필요가 없어 코드가 짧고 일관돼집니다.C# 컬렉션 식이란 무엇인가요?컬렉션 식은 대괄호 [ ] 안에 요소를 나열해 컬렉션을 만드는 C# 12의 표현식입니다. 컴파일러가 대입되는 대상의 타입(target type)을 보고 알맞은 컬렉션을 생성하므로, 같은 문법으로 배열과 리스트, 스팬을 모두 초기화할 수 있습니다.기존에는 new int[] { 1, 2, 3 }, new .. 더보기

티스토리툴바