perf(Overlay): lazy render

src/overlay/index.js

@@ -1,6 +1,7 @@
 import { Transition } from 'vue';
 import { createNamespace, isDef, noop } from '../utils';
 import { preventDefault } from '../utils/dom/event';
+import { useLazyRender } from '../composition/use-lazy-render';
 
 const [createComponent, bem] = createNamespace('overlay');
 
@@ -22,7 +23,9 @@ export default createComponent({
   },
 
   setup(props, { slots }) {
-    return function () {
+    const lazyRender = useLazyRender(() => props.show);
+
+    const renderOverlay = lazyRender(() => {
       const style = {
         zIndex: props.zIndex,
         ...props.customStyle,
@@ -33,7 +36,6 @@ export default createComponent({
       }
 
       return (
-        <Transition name="van-fade">
         <div
           vShow={props.show}
           style={style}
@@ -42,8 +44,9 @@ export default createComponent({
         >
           {slots.default?.()}
         </div>
-        </Transition>
       );
-    };
+    });
+
+    return () => <Transition name="van-fade">{renderOverlay()}</Transition>;
   },
 });