theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: v-memo

Browse Source
This commit is contained in:
Evan You
2021-07-09 21:41:44 -04:00
parent 5cea9a1d4e
commit 3b64508e3b
23 changed files with 563 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/compiler-core/__tests__/transforms/__snapshots__/hoistStatic.spec.ts.snap
View File

@@ -218,7 +218,7 @@ export function render(_ctx, _cache) {
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_createElementVNode(\\"div\\", null, [
_createElementVNode(\\"div\\", {
onClick: _cache[1] || (_cache[1] = (...args) => (_ctx.foo && _ctx.foo(...args)))
onClick: _cache[0] || (_cache[0] = (...args) => (_ctx.foo && _ctx.foo(...args)))
})
])
]))

82
packages/compiler-core/__tests__/transforms/__snapshots__/vMemo.spec.ts.snap Normal file
View File

@@ -0,0 +1,82 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`compiler: v-memo transform on component 1`] = `
"import { resolveComponent as _resolveComponent, createVNode as _createVNode, withMemo as _withMemo, openBlock as _openBlock, createElementBlock as _createElementBlock } from \\"vue\\"
export function render(_ctx, _cache) {
const _component_Comp = _resolveComponent(\\"Comp\\")
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_withMemo([_ctx.x], () => _createVNode(_component_Comp), _cache, 0)
]))
}"
`;
exports[`compiler: v-memo transform on normal element 1`] = `
"import { openBlock as _openBlock, createElementBlock as _createElementBlock, withMemo as _withMemo } from \\"vue\\"
export function render(_ctx, _cache) {
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_withMemo([_ctx.x], () => (_openBlock(), _createElementBlock(\\"div\\")), _cache, 0)
]))
}"
`;
exports[`compiler: v-memo transform on root element 1`] = `
"import { openBlock as _openBlock, createElementBlock as _createElementBlock, withMemo as _withMemo } from \\"vue\\"
export function render(_ctx, _cache) {
return _withMemo([_ctx.x], () => (_openBlock(), _createElementBlock(\\"div\\")), _cache, 0)
}"
`;
exports[`compiler: v-memo transform on template v-for 1`] = `
"import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, isMemoSame as _isMemoSame, withMemo as _withMemo } from \\"vue\\"
export function render(_ctx, _cache) {
return (_openBlock(), _createElementBlock(\\"div\\", null, [
(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.list, ({ x, y }, __, ___, _cached) => {
const _memo = ([x, y === z])
if (_cached && _cached.key === x && _isMemoSame(_cached.memo, _memo)) return _cached
const _item = (_openBlock(), _createElementBlock(\\"span\\", { key: x }, \\"foobar\\"))
_item.memo = _memo
return _item
}, _cache, 0), 128 /* KEYED_FRAGMENT */))
]))
}"
`;
exports[`compiler: v-memo transform on v-for 1`] = `
"import { renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createElementVNode as _createElementVNode, isMemoSame as _isMemoSame, withMemo as _withMemo } from \\"vue\\"
export function render(_ctx, _cache) {
return (_openBlock(), _createElementBlock(\\"div\\", null, [
(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.list, ({ x, y }, __, ___, _cached) => {
const _memo = ([x, y === _ctx.z])
if (_cached && _cached.key === x && _isMemoSame(_cached.memo, _memo)) return _cached
const _item = (_openBlock(), _createElementBlock(\\"div\\", { key: x }, [
_createElementVNode(\\"span\\", null, \\"foobar\\")
]))
_item.memo = _memo
return _item
}, _cache, 0), 128 /* KEYED_FRAGMENT */))
]))
}"
`;
exports[`compiler: v-memo transform on v-if 1`] = `
"import { createElementVNode as _createElementVNode, createTextVNode as _createTextVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, withMemo as _withMemo, createCommentVNode as _createCommentVNode, resolveComponent as _resolveComponent, createBlock as _createBlock } from \\"vue\\"
export function render(_ctx, _cache) {
const _component_Comp = _resolveComponent(\\"Comp\\")
return (_openBlock(), _createElementBlock(\\"div\\", null, [
(_ctx.ok)
? _withMemo([_ctx.x], () => (_openBlock(), _createElementBlock(\\"div\\", { key: 0 }, [
_createElementVNode(\\"span\\", null, \\"foo\\"),
_createTextVNode(\\"bar\\")
])), _cache, 0)
: _withMemo([_ctx.x], () => (_openBlock(), _createBlock(_component_Comp, { key: 1 })), _cache, 1)
]))
}"
`;

30
packages/compiler-core/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap
View File

@@ -7,11 +7,11 @@ return function render(_ctx, _cache) {
with (_ctx) {
const { setBlockTracking: _setBlockTracking, createElementVNode: _createElementVNode } = _Vue
return _cache[1] || (
return _cache[0] || (
_setBlockTracking(-1),
_cache[1] = _createElementVNode(\\"div\\", { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_cache[0] = _createElementVNode(\\"div\\", { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_setBlockTracking(1),
_cache[1]
_cache[0]
)
}
}"
@@ -27,11 +27,11 @@ return function render(_ctx, _cache) {
const _component_Comp = _resolveComponent(\\"Comp\\")
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_cache[1] || (
_cache[0] || (
_setBlockTracking(-1),
_cache[1] = _createVNode(_component_Comp, { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_cache[0] = _createVNode(_component_Comp, { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_setBlockTracking(1),
_cache[1]
_cache[0]
)
]))
}
@@ -46,11 +46,11 @@ return function render(_ctx, _cache) {
const { setBlockTracking: _setBlockTracking, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_cache[1] || (
_cache[0] || (
_setBlockTracking(-1),
_cache[1] = _createElementVNode(\\"div\\", { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_cache[0] = _createElementVNode(\\"div\\", { id: foo }, null, 8 /* PROPS */, [\\"id\\"]),
_setBlockTracking(1),
_cache[1]
_cache[0]
)
]))
}
@@ -65,11 +65,11 @@ return function render(_ctx, _cache) {
const { setBlockTracking: _setBlockTracking, renderSlot: _renderSlot, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_cache[1] || (
_cache[0] || (
_setBlockTracking(-1),
_cache[1] = _renderSlot($slots, \\"default\\"),
_cache[0] = _renderSlot($slots, \\"default\\"),
_setBlockTracking(1),
_cache[1]
_cache[0]
)
]))
}
@@ -84,11 +84,11 @@ return function render(_ctx, _cache) {
const { setBlockTracking: _setBlockTracking, createElementVNode: _createElementVNode, openBlock: _openBlock, createElementBlock: _createElementBlock } = _Vue
return (_openBlock(), _createElementBlock(\\"div\\", null, [
_cache[1] || (
_cache[0] || (
_setBlockTracking(-1),
_cache[1] = _createElementVNode(\\"div\\"),
_cache[0] = _createElementVNode(\\"div\\"),
_setBlockTracking(1),
_cache[1]
_cache[0]
)
]))
}

56
packages/compiler-core/__tests__/transforms/vMemo.spec.ts Normal file
View File

@@ -0,0 +1,56 @@
import { baseCompile } from '../../src'
describe('compiler: v-memo transform', () => {
function compile(content: string) {
return baseCompile(`<div>${content}</div>`, {
mode: 'module',
prefixIdentifiers: true
}).code
}
test('on root element', () => {
expect(
baseCompile(`<div v-memo="[x]"></div>`, {
mode: 'module',
prefixIdentifiers: true
}).code
).toMatchSnapshot()
})
test('on normal element', () => {
expect(compile(`<div v-memo="[x]"></div>`)).toMatchSnapshot()
})
test('on component', () => {
expect(compile(`<Comp v-memo="[x]"></Comp>`)).toMatchSnapshot()
})
test('on v-if', () => {
expect(
compile(
`<div v-if="ok" v-memo="[x]"><span>foo</span>bar</div>
<Comp v-else v-memo="[x]"></Comp>`
)
).toMatchSnapshot()
})
test('on v-for', () => {
expect(
compile(
`<div v-for="{ x, y } in list" :key="x" v-memo="[x, y === z]">
<span>foobar</span>
</div>`
)
).toMatchSnapshot()
})
test('on template v-for', () => {
expect(
compile(
`<template v-for="{ x, y } in list" :key="x" v-memo="[x, y === z]">
<span>foobar</span>
</template>`
)
).toMatchSnapshot()
})
})

10
packages/compiler-core/__tests__/transforms/vOn.spec.ts
View File

@@ -452,7 +452,7 @@ describe('compiler: transform v-on', () => {
(vnodeCall.props as ObjectExpression).properties[0].value
).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.SIMPLE_EXPRESSION,
content: `() => {}`
@@ -473,7 +473,7 @@ describe('compiler: transform v-on', () => {
(vnodeCall.props as ObjectExpression).properties[0].value
).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.COMPOUND_EXPRESSION,
children: [
@@ -498,7 +498,7 @@ describe('compiler: transform v-on', () => {
(vnodeCall.props as ObjectExpression).properties[0].value
).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.COMPOUND_EXPRESSION,
children: [
@@ -543,7 +543,7 @@ describe('compiler: transform v-on', () => {
(vnodeCall.props as ObjectExpression).properties[0].value
).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.COMPOUND_EXPRESSION,
children: [`() => `, { content: `_ctx.foo` }, `()`]
@@ -565,7 +565,7 @@ describe('compiler: transform v-on', () => {
(vnodeCall.props as ObjectExpression).properties[0].value
).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.COMPOUND_EXPRESSION,
children: [

10
packages/compiler-core/__tests__/transforms/vOnce.spec.ts
View File

@@ -26,7 +26,7 @@ describe('compiler: v-once transform', () => {
expect(root.helpers).toContain(SET_BLOCK_TRACKING)
expect(root.codegenNode).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.VNODE_CALL,
tag: `"div"`
@@ -41,7 +41,7 @@ describe('compiler: v-once transform', () => {
expect(root.helpers).toContain(SET_BLOCK_TRACKING)
expect((root.children[0] as any).children[0].codegenNode).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.VNODE_CALL,
tag: `"div"`
@@ -56,7 +56,7 @@ describe('compiler: v-once transform', () => {
expect(root.helpers).toContain(SET_BLOCK_TRACKING)
expect((root.children[0] as any).children[0].codegenNode).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.VNODE_CALL,
tag: `_component_Comp`
@@ -71,7 +71,7 @@ describe('compiler: v-once transform', () => {
expect(root.helpers).toContain(SET_BLOCK_TRACKING)
expect((root.children[0] as any).children[0].codegenNode).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.JS_CALL_EXPRESSION,
callee: RENDER_SLOT
@@ -90,7 +90,7 @@ describe('compiler: v-once transform', () => {
expect(root.hoists.length).toBe(0)
expect((root.children[0] as any).children[0].codegenNode).toMatchObject({
type: NodeTypes.JS_CACHE_EXPRESSION,
index: 1,
index: 0,
value: {
type: NodeTypes.VNODE_CALL,
tag: `"div"`