perf: avoid force reflow in use-size (#2068)

* fix: avoid force reflow in use-size * fix: update size init logic * docs: there is no need comment for simple logic --------- Co-authored-by: lijianan <[email protected]> Co-authored-by: 云泥 <[email protected]>
alibaba · Feb 28, 2023 · 1da40fe · 1da40fe
1 parent 29c9203
commit 1da40fe
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/packages/hooks/src/useSize/index.ts b/packages/hooks/src/useSize/index.ts
@@ -7,14 +7,16 @@ import useIsomorphicLayoutEffectWithTarget from '../utils/useIsomorphicLayoutEff
 type Size = { width: number; height: number };
 
 function useSize(target: BasicTarget): Size | undefined {
-  let el = getTargetElement(target);
   const [state, setState] = useRafState<Size | undefined>(
-    el ? { width: el.clientWidth, height: el.clientHeight } : undefined,
+    () => {
+      const el = getTargetElement(target);
+      return el ? { width: el.clientWidth, height: el.clientHeight } : undefined
+    },
   );
 
   useIsomorphicLayoutEffectWithTarget(
     () => {
-      el = getTargetElement(target);
+      const el = getTargetElement(target);
 
       if (!el) {
         return;