리액트 UI tearing example

default.mov

Posts 탭을 클릭하여 렌더링 되는 중에 글로벌 상태인 localStorage의 색깔을 변경하면, UI tearing이 일어납니다.

대신 color.js파일에 있는 코드를 사용해서 useSyncExternalStore를 사용하면 UI tearing현상이 일어나지 않습니다.

설치

npm install

npm run dev

Name		Name	Last commit message	Last commit date
Latest commit History 1 Commit
public		public
src		src
.eslintrc.cjs		.eslintrc.cjs
.gitignore		.gitignore
README.md		README.md
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
vite.config.js		vite.config.js