perf(compiler-sfc): ignore empty blocks (#3520)

Author: cexbrayat

packages/compiler-sfc/__tests__/parse.spec.ts

@@ -135,8 +135,13 @@ h1 { color: red }
 
   test('should ignore other nodes with no content', () => {
     expect(parse(`<script/>`).descriptor.script).toBe(null)
+    expect(parse(`<script> \n\t  </script>`).descriptor.script).toBe(null)
     expect(parse(`<style/>`).descriptor.styles.length).toBe(0)
+    expect(parse(`<style> \n\t </style>`).descriptor.styles.length).toBe(0)
     expect(parse(`<custom/>`).descriptor.customBlocks.length).toBe(0)
+    expect(
+      parse(`<custom> \n\t </custom>`).descriptor.customBlocks.length
+    ).toBe(0)
   })
 
   test('handle empty nodes with src attribute', () => {

packages/compiler-sfc/src/parse.ts

@@ -162,7 +162,8 @@ export function parse(
     if (node.type !== NodeTypes.ELEMENT) {
       return
     }
-    if (!node.children.length && !hasSrc(node) && node.tag !== 'template') {
+    // we only want to keep the nodes that are not empty (when the tag is not a template)
+    if (node.tag !== 'template' && isEmpty(node) && !hasSrc(node)) {
       return
     }
     switch (node.tag) {
@@ -415,3 +416,15 @@ function hasSrc(node: ElementNode) {
     return p.name === 'src'
   })
 }
+
+/**
+ * Returns true if the node has no children
+ * once the empty text nodes (trimmed content) have been filtered out.
+ */
+function isEmpty(node: ElementNode) {
+  return (
+    node.children.filter(
+      child => child.type !== NodeTypes.TEXT || child.content.trim() !== ''
+    ).length === 0
+  )
+}