![]()
* 이 글은 4 React Tips to Instantly Improve Your Code를 번역하였습니다. 4 React Tips to Instantly Improve Your CodeSolid knowledge of React is one of the most valuable skills for a front-end developer. Many companies are constantly searching for React…javascript.plainenglish.io1. 핸들러에서 함수 반환하기핸들러에서 함수(예: 커링 기법)를 반환하여 중복 코드를 줄이고 효율성을 높일 수 있습니다.export default function App() { const [user, setUser] = useStat..
![]()
* 이글은 What's new in React 19를 번역하였습니다. What’s new in React 19 - VercelReact 19 is near. Here's what to expect and how you can get started deploying React 19 on Vercel.vercel.comSever Components서버 컴포넌트는 React가 10년 전 처음 출시된 이후 가장 큰 변화 중 하나입니다. 이들은 React 19의 새로운 기능들의 기반 역할을 하며 다음과 같은 개선을 제공합니다:초기 페이지 로드 시간: 서버에서 컴포넌트를 렌더링하여 클라이언트로 전송되는 JavaScript의 양을 줄임으로써 초기 로드 속도를 빠르게 합니다. 또한, 페이지가 클라이언트에 전송되기 전에..
![]()
* 이 글은 Yes, the Next.js Router Cache is Actually Good 를 번역하였습니다.TL;DRNext.js의 라우터 캐시는 논란이 있지만, 유용한 기능입니다.라우터 캐시는 서버 부하를 줄이고, 사용자 경험(UX)을 개선하며, "허용 가능한" 정도의 오래된 데이터를 제공하는 것을 목표로 합니다.사용자가 시작하는 변경 작업(mutation)의 경우 서버 액션(server actions)을 사용해야 합니다.항상 최신 데이터가 필요한 경우에는 클라이언트 측 데이터 페칭을 사용하십시오.staleTimes와 router.refresh는 예외적으로 사용할 수 있는 방법이지만, 라우터 캐시와 관련하여 대부분의 경우 더 나은 해결책이 존재합니다.The Controversy Known as ..
![]()
* 이 글은 You might not need an effect 를 번역하였습니다. You Might Not Need an Effect A JavaScript library for building user interfaces beta.reactjs.org TL;DR 렌더링을 하는 동안 어떤 것을 계산해야 한다면, effect를 사용하지 말아주세요. 무거운 계산들을 캐시하려면, useMemo를 사용해주세요. 모든 컴포넌트 트리의 상태 값을 초기화 시키기 위해서는 다른 key를 전달해주세요. prop 의 변경에 대한 응답으로 상태값을 초기화 시키기 위해서는, 렌더링 중에 해주세요. 컴포넌트가 유저에게 이미 노출되었다면 코드는 effect에 있어야하고, 나머지는 event 안에 있어야 합니다. 여러 컴포넌트 ..
