From a8518a103618fbedaea711601ad2a731ccdc0056 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Fri, 24 Jun 2022 00:37:58 +0800
Subject: [PATCH] chore: less render on the time (#318)

---
 src/hooks/useMergedState.ts |  9 ++++++---
 tests/hooks.test.js         | 13 +++++++++++++
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/hooks/useMergedState.ts b/src/hooks/useMergedState.ts
index 69130ada..5d148c54 100644
--- a/src/hooks/useMergedState.ts
+++ b/src/hooks/useMergedState.ts
@@ -16,17 +16,20 @@ enum Source {
 type ValueRecord<T> = [T, Source, T];
 
 const useUpdateEffect: typeof React.useEffect = (callback, deps) => {
-  const [firstMount, setFirstMount] = React.useState(true);
+  const firstMountRef = React.useRef(true);
 
   useLayoutEffect(() => {
-    if (!firstMount) {
+    if (!firstMountRef.current) {
       return callback();
     }
   }, deps);
 
   // We tell react that first mount has passed
   useLayoutEffect(() => {
-    setFirstMount(false);
+    firstMountRef.current = false;
+    return () => {
+      firstMountRef.current = true;
+    };
   }, []);
 };
 
diff --git a/tests/hooks.test.js b/tests/hooks.test.js
index 15a0bef4..90ee1e3e 100644
--- a/tests/hooks.test.js
+++ b/tests/hooks.test.js
@@ -281,6 +281,19 @@ describe('hooks', () => {
 
       expect(container.textContent).toBe('1');
     });
+
+    it('render once', () => {
+      let count = 0;
+
+      const Demo = () => {
+        const [] = useMergedState();
+        count += 1;
+        return null;
+      };
+
+      render(<Demo />);
+      expect(count).toBe(1);
+    });
   });
 
   describe('useLayoutEffect', () => {