Repository navigation
Conversation
🦋 Changeset detectedLatest commit: 1d21b7f The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Size Change: +144 B (+0.13%) Total Size: 115 kB 📦 View Changed
ℹ️ View Unchanged
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #557 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 69 69
Lines 2280 2280
Branches 737 737
=========================================
Hits 2280 2280 🚀 New features to boost your workflow:
|
| `useIsomorphicLayoutEffect`는 서버 사이드 렌더링 중에 경고를 일으키지 않고 브라우저에서 `useLayoutEffect`를 실행하는 리액트 훅이에요. SSR 환경에서는 동기적으로 측정하거나 변경할 DOM이 없기 때문에, `useLayoutEffect`를 사용하면 리액트가 경고를 보내요. | ||
|
|
||
| 리액트는 서버에서 effect를 실행하지 않으므로 effect는 브라우저에서만 실행돼요. 서버에서 이 훅은 `useEffect`이고, 리액트는 이를 실행하지 않아요. 이 훅은 경고를 피하기 위해서만 존재해요. 서버에서 아무것도 실행하지 않으며, 서버 출력을 클라이언트와 맞춰 주지도 않아요. |
There was a problem hiding this comment.
| `useIsomorphicLayoutEffect`는 서버 사이드 렌더링 중에 경고를 일으키지 않고 브라우저에서 `useLayoutEffect`를 실행하는 리액트 훅이에요. SSR 환경에서는 동기적으로 측정하거나 변경할 DOM이 없기 때문에, `useLayoutEffect`를 사용하면 리액트가 경고를 보내요. | |
| 리액트는 서버에서 effect를 실행하지 않으므로 effect는 브라우저에서만 실행돼요. 서버에서 이 훅은 `useEffect`이고, 리액트는 이를 실행하지 않아요. 이 훅은 경고를 피하기 위해서만 존재해요. 서버에서 아무것도 실행하지 않으며, 서버 출력을 클라이언트와 맞춰 주지도 않아요. | |
| `useIsomorphicLayoutEffect`는 서버 사이드 렌더링 중에 경고를 일으키지 않고 브라우저에서 `useLayoutEffect`를 실행하는 리액트 훅이에요. SSR 환경에서는 동기적으로 측정하거나 변경할 DOM이 없기 때문에, `useLayoutEffect`를 사용하면 리액트가 경고를 보내요. (보내요...?! 더 적절한 단어가 있을지 고민이네요 ..) 이 훅은 경고를 피하기 위해서만 존재해요. 서버에서 아무것도 실행하지 않으며, 서버 출력을 클라이언트와 맞춰 주지도 않아요. |
이렇게 한 문단으로 적어볼 수도 있을거 같아요 ! 🤔
'서버에서 이 훅은 useEffect이고, 리액트는 이를 실행하지 않아요.' < 요것은 구현에 대한 세부사항을 드러내는 것 아닐까 싶기도 하구요 🤔 🤔 🤔 (물론 간단하고 + 개발자가 알고 사용하면 좋긴 할거라 공감도 돼요 🤔 )
이 부분에 대해서는 어떻게 생각하시나요 ??!
There was a problem hiding this comment.
"useLayoutEffect를 사용하면 리액트가 경고를 보내요." -> "useLayoutEffect를 사용하면 경고가 발생해요."
여기서는 굳이 "리액트"가 붙지 않아도 괜찮을거 같아요.
"보내요" 자체가 React시점이기 때문에 조금 어색하게 느껴지는거 아닐까 생각이 듭니다.
문서를 읽는 독자 시점에서는 누가 경고를 보내는지보다 어떤 상황에서 경고가 발생하는지에 대한 여부만 아는 형태면 될거같아요.
조금 더 독자에게 필요한 정보에 초점을 맞추는 형태(?)로 전환하는건 어떨까요 ?
|
This isn’t directly related to the current change, but I noticed that this file also has its own check for whether it’s running on the server. It might be worth reusing the existing isServer utility.Since both checks serve the same purpose, keeping the logic in one place would ensure they stay in sync if the criteria change. This isn’t urgent, so how about addressing it in a separate follow up? 😁 |
Overview
The JSDoc of
useIsomorphicLayoutEffectlisted "Supporting both client and server environments safely" as a use case, which suggests the hook does something on the server. It doesn't: React never runs effects on the server, and on the server this hook isuseEffect, which React skips. Its only job is to avoid theuseLayoutEffectSSR warning.Refs #188. Thanks @jungpaeng for pointing out how the current wording misleads 🙏
Checklist
yarn run fixto format and lint the code and docs?yarn run test:coverageto make sure there is no uncovered line?