Web is cool!
Partial Hydration 둘러보기
안녕하세요! 이번 글에서는 최근 1~2년간 프론트엔드 영역에서 상당히 핫했던 주제 중 하나인 Partial Hydration에 대해 소개하고, 이를 구현하는 다양한 기법들을 살펴보는 시간을 가져보려고 합니다. SSR의 문제 SSR의 도입은 웹 애플리케이션의 최초 로딩 퍼포먼스에 있어서 많은 개선을 가져왔습니다. (SSR이 단순히 SEO를 위한 것이라고만 알고 계셨다면, 제 과거 발표를 시청하신 후에 글을 마저 읽으시는 것을 추천드립니다) 하지만...
Race Condition과 Data Race 알아보기
이 글은 @RanolP_777 님의 트윗을 기본 레퍼런스로 하여 작성되었습니다. 멀티쓰레드 등을 활용한 동시성 프로그래밍을 하다 보면, 데이터 레이스(Data Race, 데이터 경쟁)에 관해서 접하게 됩니다. 흔히 여러 쓰레드가 동시에 한 메모리 영역에 접근할 때 읽기/쓰기 순서가 꼬여서 데이터가 뒤죽박죽이 되는 걸 보고 데이터 레이스라고 하고, 대충 그러니까 우리는 공유 변수에 접근할 때는 뮤텍스를 써야 한다! 정도로만 이야기하고 넘어가는 ...
쉽게 배우는 Relay - 1. Relay 소개
안녕하세요! 이번에는 짧게 끝내는 글이 아닌 시리즈로 연재하는 튜토리얼을 만들어 보려고 하는데요, Relay의 공식 문서가 너무 어렵고 복잡하다는 수많은 울부짖음을 듣고(...) 한번 한국어로 쉽게 따라갈 수 있는 튜토리얼을 써 봐야겠다고 결심하게 되었습니다. Relay의 보급은 대의를 위해 매우 중요한 이슈이니까요. (?) 그럼 한 번 시작해 볼까요? Relay란? Relay는 Meta(구 Facebook)에서 개발 중인 GraphQL 클라이...
React Suspense 알아보기
React 18이 정식으로 출시되었는데요, React 18은 Suspense 사용에 있어서 큰 변화를 가져왔고, 따라서 이번 글에서는 React 18에서 변한 사항들을 포함하여 Suspense의 전체적인 내용들에 대해 알아보려고 합니다. 전통적 방식의 비동기 데이터 기반 렌더링 React에서 컴포넌트를 작성하다 보면, 비동기 데이터에 의존하여 UI를 그리는 컴포넌트를 심심치 않게 작성하게 됩니다. 일반적인 React의 컴포넌트 렌더링은 동기적으...