전역 상태 관리와 시사하는 바
2025. 3. 31.
전역 상태 관리와 시사하는 바
Reflections on managing state 🔗저자가 다양한 상태 라이브러리를 써보면서 느낀 점을 풀어낸 글입니다. 전역 상태를 다루는 로직이 필요한 때가 많이 있지만, 라이브러리들의 목적(데이터 가져오기/전역에서 가져오기)과 저장소가 리액트 바깥에서 가져온다는 것을 명심해야 할 것입니다. useEffect
와 useSyncExternalStore
의 차이, 그리고 상태 라이브러리와의 상호작용, 여러가지를 고려해야겠죠. 더 자세한 상태 관리의 역사와 자세한 접근 방식은 FrontendMastery의 리액트 상태관리의 새로운 물결 글을 참고하세요.
Next.js에서 Astro로 변경하기
Why we switched to Astro (and why it might interest you) 🔗간단하게 Next.js에서 실망한 점과 Astro를 선택했는지를 소개하는 글입니다. Next.js가 사용자가 많은만큼, 그에 따른 단점도 명확합니다(Why I won’t use next.js, App router의 장단). 그런 만큼 요구사항에 따라 선택지를 넓게 보는 것 또한 필요해보입니다. 이 글은 단순히 자신들의 요구사항에 맞춰서 글을 썼기에, 여러가지 관점을 살펴보기를 원하신다면 React를 선택하지 않는다면을 읽기를 추천드립니다. React를 쓰지 말아야 한다에 100% 동조하긴 어렵지만(그만큼 생태계는 중요하다고 생각합니다), React외의 다른 선택지를 선택하는 두려움을 줄여야 한다고는 생각합니다.
브라우저 캐싱의 종류, 그리고 어떻게 다뤄야 할까
How To Leverage Browser Caching to Improve Site Speed | DebugBear 🔗캐싱을 왜 사용해야 하는지, 캐시의 종류, 그리고 어떻게 사용하는지 모두 소개하는 글입니다. 이 글에서는 Cache-Control
헤더와 CDN, 서버에서 캐시를 다루는 방법과 자료를 간단하게만 소개하고 있으니, 경우에 따라 Next.js의 캐시 위치(App router, Page router), Tanstack query, Vite의 hashing으로 캐시 버스팅… 여러 문서를 참고하세요.
Node.js를 계속 업데이트 해야 하는 이유
State of Node.js Performance 2024 🔗Node.js에서 보안 패치를 오래 해주지 않는 이유 또한 업데이트해야 하는 이유에 포함되지만, 기본 함수들의 성능이 올라가는 것 또한 주기적으로 업데이트해야 하는 이유에 포함됩니다. 이 글에서는 상당한 성능 개선이 이루어진 API와 벤치마크를 제대로 실행하기 위한 간단한 수정도 소개합니다.
CSS 단축 속성과 가독성
My issues with shorthand properties | Håvard Brynjulfsen 🔗간단한 padding
, margin
에서부터, 여러 방면에서 단축 속성을 쓰지만, 많이 쓰는 단축 속성에 대해 소개하고, 때에 따라 늘여쓰는 것이 도움이 된다는 것을 보여주는 글입니다. 저자는 CSS에서만을 예를 들었지만, 다른 언어에서도 똑같습니다.
React 19의 ref cleanup과 useCallback
.
Ref Callbacks, React 19 and the Compiler | TkDodo's blog 🔗저자의 전 글인 ref를 사용해서 useEffect
사용을 피한 글에서 잘못된 부분을 수정하고, React 19의 추가된 ref cleanup과 컴파일러의 useCallback
작동에 맞게 수정하는 방법을 소개합니다. 물론 마지막에 소개하듯이, 요구사항에 맞는 경우에만 이 방식을 사용해야 합니다.
번들러 없이 자바스크립트 활용하기
Writing Modern JavaScript without a Bundler | Playful Programming 🔗이전에 소개했던 빌드 도구 없이 라이브러리 불러오기과 비슷한 글입니다(HMR과 린터를 추가함). 이 글도 commonjs 대응 때문에 esbuild 과정을 추가한 것이 인상적이네요.
Micro-Frontend와 Next.js 멀티존
Building Scalable Micro-Frontends with Next.js Multi Zones - iO tech_hub 🔗Next.js의 rewrites
기능으로 간단하게 다른 소스코드 기반(물론 둘 다 Next.js)으로 Micro Frontend을 구현하는 방식을 소개합니다. 자세하게 적용하는 방법은 공식 문서의 Multizone deploying이 더 잘 소개하고 있습니다. 하지만 장단점과 어떻게 적용할지는 글에서 잘 소개하고 있습니다.
Node.js와 Readable Stream
Vercel Security Checkpoint 🔗Readable Stream이 어디에 사용되는지와 핵심 개념을 소개합니다.