wip(compiler): adjust statement positions

diff --git a/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap
index 8ce723cf944b3ab709b9052749b8d2d90d0d142e..d5e65e6a763478553050472da9d7ed4d57e413e8 100644 (file)
--- a/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap
@@ -71,10 +71,10 @@ return function render() {
 `;
 
 exports[`compiler: codegen function mode preamble 1`] = `
-"const { helperOne, helperTwo } = Vue
-
+"const _Vue = Vue
 return function render() {
   with (this) {
+    const { helperOne, helperTwo } = _Vue
     return null
   }
 }"
@@ -147,10 +147,10 @@ return function render() {
 exports[`compiler: codegen statements 1`] = `
 "
 return function render() {
-  const a = 1
-  const b = 2
-  
   with (this) {
+    const a = 1
+    const b = 2
+    
     return null
   }
 }"

diff --git a/packages/compiler-core/__tests__/codegen.spec.ts b/packages/compiler-core/__tests__/codegen.spec.ts
index 5f21af633fa148d8616fd109dc9a10cd2f7a8cb8..5e76e6258005797100b702f0d93f1d22086ee79f 100644 (file)
--- a/packages/compiler-core/__tests__/codegen.spec.ts
+++ b/packages/compiler-core/__tests__/codegen.spec.ts
@@ -55,7 +55,8 @@ describe('compiler: codegen', () => {
       imports: [`helperOne`, `helperTwo`]
     })
     const { code } = generate(root, { mode: 'function' })
-    expect(code).toMatch(`const { helperOne, helperTwo } = Vue`)
+    expect(code).toMatch(`const _Vue = Vue`)
+    expect(code).toMatch(`const { helperOne, helperTwo } = _Vue`)
     expect(code).toMatchSnapshot()
   })
 

diff --git a/packages/compiler-core/__tests__/compile.spec.ts b/packages/compiler-core/__tests__/compile.spec.ts
index ad28e5653fa2829b65070bf9f43a9eb9e61954a0..d961d0693857adedf4b7f315547f116e4425daf0 100644 (file)
--- a/packages/compiler-core/__tests__/compile.spec.ts
+++ b/packages/compiler-core/__tests__/compile.spec.ts
@@ -9,10 +9,10 @@ test('basic source map support', async () => {
     filename: `foo.vue`
   })
   expect(code).toMatch(
-    `const { toString } = Vue
-
+    `const _Vue = Vue
 return function render() {
   with (this) {
+    const { toString } = _Vue
     return [
       "hello ",
       toString(world)

diff --git a/packages/compiler-core/src/codegen.ts b/packages/compiler-core/src/codegen.ts
index b6c66a7d373d76c6c05229cf1652cbb7ae452c6d..84e5a5d74a93c3d877052ec5afa65e3d3c85dfdc 100644 (file)
--- a/packages/compiler-core/src/codegen.ts
+++ b/packages/compiler-core/src/codegen.ts
@@ -145,10 +145,20 @@ export function generate(
   const context = createCodegenContext(ast, options)
   const { mode, push, prefixIdentifiers, indent, deindent, newline } = context
   const imports = ast.imports.join(', ')
+
+  // preambles
   if (mode === 'function') {
-    // generate const declarations for helpers
+    // Generate const declaration for helpers
+    // In prefix mode, we place the const declaration at top so it's done
+    // only once; But if we not prefixing, we place the decalration inside the
+    // with block so it doesn't incur the `in` check cost for every helper access.
     if (imports) {
-      push(`const { ${imports} } = Vue\n`)
+      if (prefixIdentifiers) {
+        push(`const { ${imports} } = Vue\n`)
+      } else {
+        // save Vue in a separate variable to avoid collision
+        push(`const _Vue = Vue`)
+      }
     }
     genHoists(ast.hoists, context)
     push(`return `)
@@ -160,8 +170,24 @@ export function generate(
     genHoists(ast.hoists, context)
     push(`export default `)
   }
+
+  // enter render function
   push(`function render() {`)
   indent()
+
+  if (!prefixIdentifiers) {
+    push(`with (this) {`)
+    indent()
+    // function mode const declarations should be inside with block
+    if (mode === 'function' && imports) {
+      push(`const { ${imports} } = _Vue`)
+      newline()
+    }
+  } else {
+    push(`const _ctx = this`)
+    newline()
+  }
+
   // generate asset resolution statements
   if (ast.statements.length) {
     ast.statements.forEach(s => {
@@ -170,13 +196,8 @@ export function generate(
     })
     newline()
   }
-  if (!prefixIdentifiers) {
-    push(`with (this) {`)
-    indent()
-  } else {
-    push(`const _ctx = this`)
-    newline()
-  }
+
+  // generate the VNode tree expression
   push(`return `)
   genChildren(ast.children, context, true /* asRoot */)
   if (!prefixIdentifiers) {

diff --git a/packages/runtime-core/src/componentPublicInstanceProxy.ts b/packages/runtime-core/src/componentPublicInstanceProxy.ts
index e0555e5dedbebfc762d4f1c23073474af12fa4a8..5741eaedfc20a3ffde658689d2b394eb0a06ab05 100644 (file)
--- a/packages/runtime-core/src/componentPublicInstanceProxy.ts
+++ b/packages/runtime-core/src/componentPublicInstanceProxy.ts
@@ -82,9 +82,10 @@ export const PublicInstanceProxyHandlers = {
     const { renderContext, data, props } = target
     // TODO handle $xxx properties
     return (
-      (data !== EMPTY_OBJ && hasOwn(data, key)) ||
-      hasOwn(renderContext, key) ||
-      hasOwn(props, key)
+      key[0] !== '_' &&
+      ((data !== EMPTY_OBJ && hasOwn(data, key)) ||
+        hasOwn(renderContext, key) ||
+        hasOwn(props, key))
     )
   },
   set(target: ComponentInternalInstance, key: string, value: any): boolean {