상태의 위치에너지
2025. 4. 22.
상태의 위치에너지
Avoid the State Synchronization Trap | Ondrej Velisek 🔗이전에 소개 했던 useState()
가 아니라 상태와 친해지기는 수많은 경우에 어떻게 해야하는지를 보여줬다면, 이 글에서는 상위(혹은 루트) 컴포넌트와 하위 컴포넌트 간에 어떻게 상태를 주고 받아야 하는지, 어디에 위치해야 하는지 전략을 소개하고 장단점을 알아보는 글입니다.
Rolldown 해체분석
How Rolldown Works: Module Loading, Dependency Graphs, and Optimization Explained | Atriiy 🔗Rolldown의 작동 원리를 다이어그램으로 잘 보여주는 글입니다. 더 잘 이해하기 위해서, 현재 번들러의 역사나, Vite는 어떻게 작동하는지를 보시길 추천드립니다.
SVG 파일 lazy loading하기..?
Lazy load SVG icons with <use/> in React.js · Jean Tinland 🔗svg에서의 <use>
태그와 IntersectionObserver
를 통해 SVG 파일을 Lazy loading하는 기법을 구현한 글입니다. 물론 특이 상황에 대한 해답 글이지만, 이처럼 svg의 여러 태그를 살펴보는 것은 기발한 애니메이션 구현하기처럼 svg를 더 잘 사용하는데 도움이 될 것입니다.
Next.js는 왜 이렇게 느려요?
Why is Next.js so slow?? - YouTube 🔗Next.js의 RSC 방식이 너무 느리다는 트윗(과 간접적으로 @fastify/react보다 Next.js가 느리다는 벤치마크 글)에 반박하는 글입니다. 비슷하게 2023년에도 비슷한 영상이 있었는데, 해당 영상에는 fetch하는 방식이 기존과 다름을 강조했는데, 이 에서는 RSC가 작동하는 방식과 함께 기존 SPA, SSR과 다루는 방식이 달라져야 하는 것을 설명합니다.
어둡다고 모두 다크모드가 아니다.
Inclusive Dark Mode: Designing Accessible Dark Themes For All Users — Smashing Magazine 🔗현재 많은 사이트들이 다크모드를 지원하지만, 다크모드의 접근성을 놓치는 경우가 많습니다. 이 글에서는 다크모드에서 중시해야 할 접근성 요소들을 소개합니다. 어느 요소는 적용하는데 시간이 걸리겠지만, 배경을 짙은 회색으로 해야 한다는 점이나, 색상 대조 도구를 사용해보는 것은 쉽게 적용해볼 수 있겠네요.
currentColor
사용하지 않을래요?
Using currentColor in 2025 – Frontend Masters Blog 🔗currentColor
에 대한 간단한 소개와 주의해야 할 점은 무엇인지 소개하는 글입니다.
API에서 RSC payload로.
JSX Over The Wire — overreacted 🔗이전에 리액트 메인테이너가 말하는 RSC 아키텍쳐에서는 아키텍쳐가 어떻게 만들어져왔는지를 소개했다면, 이 글에서는 API를 만드는 대신 RSC payload를 사용하기 원하는 이유를 단계에 걸쳐 소개합니다.
때로는, 다른 라이브러리가 좋을 수도 있다.
You Might Not Need react-native-svg | Software Mansion 🔗글은 react-native-svg
가 어떤 라이브러리이고, 장단점을 확실히 보여주고, 그에 대한 다른 대체 라이브러리를 소개하는 글입니다. 하지만 이는 다른 모든 라이브러리에 적용되는 말이므로, 다른 라이브러리에도 이런 사고를 적용해볼 수 있겠습니다.
서버 기반 Toast 메세지 구현하기
Toast messages in React Server Components 🔗server action과 cookie를 사용하여 Server Action과 함께 새로고침해도 사라지지 않는 상태관리를 소개하는 튜토리얼 글입니다.
JS 문법 알아보기
Some features that every JavaScript developer should know in 2025 | WaspDev 🔗많이 사용하지 않지만, 최신 브라우저에서는 모두 지원하는 JS 문법을 소개하는 글입니다.
새 친구들
Introducing Zod 4 beta | Zod Docs 🔗여러 새로운 기능과 성능 최적화가 포함된 zod 4 beta 배포 소식입니다.
Astro 5.7 | Astro 🔗네이티브 폰트 최적화 기능을 포함한 업데이트한 Astro 5.7 소식입니다.
Faster Lazy Loading in React Router v7.5+ | Remix 🔗React Router 7.5에서 데이터를 lazy loading하는 방식이 바뀌면서 빠르게 되었다는 소식입니다.
Default styles for h1 elements are changing | MDN Blog 🔗이전에는 h1 태그의 스타일이 depth에 따라 바뀌었었는데, 이를 모든 모던 브라우저에서 바꾼다는 소식입니다.
una.im | Updates to the customizable select API 🔗Chrome에서만이지만, Native <select>
의 요소들을 모두 수정할 수 있게 pesudo class을 제공한다는 소식입니다.
오랜 기간을 끌어온 Record, Tuple 기능 제안이 닫히고 Composite으로 바뀌었다는 소식입니다.
Native Platform · React Native 🔗RN에서 Native기능들을 쓰기 위해 Native Components와 Native Modules를 사용해야 합니다. 이를 잘 설명하는 공식문서가 추가되었습니다.
The new Cookie Store API | Fotis Papadogeorgopoulos 🔗아직 모든 모던 브라우저에서 구현되진 않았지만, Cookie를 비동기적으로 관리할 수 있는 API를 새로 도입한다는 소식입니다.