perf(Tab): skip rendering empty pane (#7238)

src/tab/index.js

@@ -55,9 +55,15 @@ export default createComponent({
 
   render(h) {
     const { slots, parent, isActive } = this;
-    const shouldRender = this.inited || parent.scrollspy || !parent.lazyRender;
+    const slotContent = slots();
+
+    if (!slotContent) {
+      return;
+    }
+
     const show = parent.scrollspy || isActive;
-    const Content = shouldRender ? slots() : h();
+    const shouldRender = this.inited || parent.scrollspy || !parent.lazyRender;
+    const Content = shouldRender ? slotContent : h();
 
     if (parent.animated) {
       return (

src/tab/test/__snapshots__/index.spec.js.snap

@@ -202,6 +202,22 @@ exports[`name prop 1`] = `
 </div>
 `;
 
+exports[`render empty tab 1`] = `
+<div class="van-tabs van-tabs--line">
+  <div class="van-tabs__wrap">
+    <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
+      <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
+      <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
+      <div class="van-tabs__line"></div>
+    </div>
+  </div>
+  <div class="van-tabs__content">
+    <!---->
+    <!---->
+  </div>
+</div>
+`;
+
 exports[`render nav-left & nav-right slot 1`] = `
 <div class="van-tabs van-tabs--line">
   <div>

src/tab/test/index.spec.js

@@ -410,3 +410,16 @@ test('before-change prop', async () => {
   expect(onChange).toHaveBeenCalledTimes(2);
   expect(onChange).toHaveBeenLastCalledWith(4, 'title5');
 });
+
+test('render empty tab', async () => {
+  const wrapper = mount({
+    template: `
+      <van-tabs>
+        <van-tab title="title1" />
+        <van-tab title="title2" />
+      </van-tabs>
+    `,
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});