refactor(vapor): drop v-memo (#288)

* refactor(runtime-vapor): drop memo

* drop

Author: sxzz

packages/compiler-vapor/__tests__/transforms/__snapshots__/vFor.spec.ts.snap

@@ -72,7 +72,7 @@ export function render(_ctx) {
       const n4 = t0()
       _renderEffect(() => _setText(n4, _ctx1[0].value+_ctx0[0].value))
       return n4
-    }, null, null, n5)
+    }, null, n5)
     _insert(n2, n5)
     return n5
   })

packages/compiler-vapor/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap

@@ -71,7 +71,7 @@ export function render(_ctx) {
   const n0 = _createFor(() => (_ctx.list), (_ctx0) => {
     const n2 = t0()
     return n2
-  }, null, null, null, null, true)
+  }, null, null, null, true)
   return n0
 }"
 `;

packages/compiler-vapor/src/generators/for.ts

@@ -16,18 +16,8 @@ export function genFor(
   context: CodegenContext,
 ): CodeFragment[] {
   const { vaporHelper } = context
-  const {
-    source,
-    value,
-    key,
-    index,
-    render,
-    keyProp,
-    once,
-    id,
-    memo,
-    container,
-  } = oper
+  const { source, value, key, index, render, keyProp, once, id, container } =
+    oper
 
   let isDestructure = false
   let rawValue: string | null = null
@@ -71,7 +61,6 @@ export function genFor(
       sourceExpr,
       blockFn,
       genCallback(keyProp),
-      genCallback(memo),
       container != null && `n${container}`,
       false, // todo: hydrationNode
       once && 'true',

packages/compiler-vapor/src/ir/index.ts

@@ -78,7 +78,6 @@ export interface IRFor {
   value?: SimpleExpressionNode
   key?: SimpleExpressionNode
   index?: SimpleExpressionNode
-  memo?: SimpleExpressionNode
 }
 
 export interface ForIRNode extends BaseIRNode, IRFor {

packages/compiler-vapor/src/transforms/vFor.ts

@@ -15,7 +15,7 @@ import {
   IRNodeTypes,
   type VaporDirectiveNode,
 } from '../ir'
-import { findDir, findProp, propToExpression } from '../utils'
+import { findProp, propToExpression } from '../utils'
 import { newBlock, wrapTemplate } from './utils'
 
 export const transformVFor: NodeTransform = createStructuralDirectiveTransform(
@@ -45,7 +45,6 @@ export function processFor(
   const { source, value, key, index } = parseResult
 
   const keyProp = findProp(node, 'key')
-  const memo = findDir(node, 'memo')
   const keyProperty = keyProp && propToExpression(keyProp)
   context.node = node = wrapTemplate(node, ['for'])
   context.dynamic.flags |= DynamicFlag.NON_TEMPLATE | DynamicFlag.INSERT
@@ -75,7 +74,6 @@ export function processFor(
       keyProp: keyProperty,
       render,
       once: context.inVOnce,
-      memo: memo && memo.exp,
       container,
     })
   }

packages/runtime-vapor/src/apiCreateFor.ts

@@ -17,7 +17,6 @@ import { currentInstance } from './component'
 import { componentKey } from './component'
 import type { DynamicSlot } from './componentSlots'
 import { renderEffect } from './renderEffect'
-import { withMemo } from './memo'
 
 interface ForBlock extends Fragment {
   scope: EffectScope
@@ -27,7 +26,6 @@ interface ForBlock extends Fragment {
     index: ShallowRef<number | undefined>,
   ]
   key: any
-  memo: any[] | undefined
 }
 
 type Source = any[] | Record<any, any> | number | Set<any> | Map<any, any>
@@ -37,7 +35,6 @@ export const createFor = (
   src: () => Source,
   renderItem: (block: ForBlock['state']) => Block,
   getKey?: (item: any, key: any, index?: number) => any,
-  getMemo?: (item: any, key: any, index?: number) => any[],
   container?: ParentNode,
   hydrationNode?: Node,
   once?: boolean,
@@ -61,7 +58,6 @@ export const createFor = (
     warn('createFor() can only be used inside setup()')
   }
 
-  const update = getMemo ? updateWithMemo : updateWithoutMemo
   once ? renderList() : renderEffect(renderList)
 
   return ref
@@ -276,23 +272,9 @@ export const createFor = (
       scope,
       state,
       key: getKey && getKey(item, key, index),
-      memo: getMemo && getMemo(item, key, index),
       [fragmentKey]: true,
     })
-    block.nodes = scope.run(() => {
-      if (getMemo) {
-        return withMemo(
-          () =>
-            getMemo(
-              block.state[0].value,
-              block.state[1].value,
-              block.state[2].value,
-            ),
-          () => renderItem(state),
-        )
-      }
-      return renderItem(state)
-    })!
+    block.nodes = scope.run(() => renderItem(state))!
 
     if (parent) insert(block.nodes, parent, anchor)
 
@@ -314,28 +296,7 @@ export const createFor = (
     }
   }
 
-  function updateWithMemo(
-    block: ForBlock,
-    newItem: any,
-    newKey = block.state[1].value,
-    newIndex = block.state[2].value,
-  ) {
-    const [, key, index] = block.state
-    let needsUpdate = newKey !== key.value || newIndex !== index.value
-    if (!needsUpdate) {
-      const oldMemo = block.memo!
-      const newMemo = (block.memo = getMemo!(newItem, newKey, newIndex))
-      for (let i = 0; i < newMemo.length; i++) {
-        if ((needsUpdate = newMemo[i] !== oldMemo[i])) {
-          break
-        }
-      }
-    }
-
-    if (needsUpdate) updateState(block, newItem, newKey, newIndex)
-  }
-
-  function updateWithoutMemo(
+  function update(
     block: ForBlock,
     newItem: any,
     newKey = block.state[1].value,

packages/runtime-vapor/src/memo.ts

@@ -12,7 +12,6 @@ import {
   queuePostFlushCb,
 } from './scheduler'
 import { VaporErrorCodes, callWithAsyncErrorHandling } from './errorHandling'
-import { memoStack } from './memo'
 
 export function renderEffect(cb: () => void): void {
   const instance = getCurrentInstance()
@@ -33,13 +32,6 @@ export function renderEffect(cb: () => void): void {
     job.id = instance.uid
   }
 
-  let memos: (() => any[])[] | undefined
-  let memoCaches: any[][]
-  if (memoStack.length) {
-    memos = Array.from(memoStack)
-    memoCaches = memos.map(memo => memo())
-  }
-
   const effect = new ReactiveEffect(() =>
     callWithAsyncErrorHandling(cb, instance, VaporErrorCodes.RENDER_FUNCTION),
   )
@@ -60,28 +52,6 @@ export function renderEffect(cb: () => void): void {
       return
     }
 
-    if (memos) {
-      let dirty: boolean | undefined
-      for (let i = 0; i < memos.length; i++) {
-        const memo = memos[i]
-        const cache = memoCaches[i]
-        const value = memo()
-
-        for (let j = 0; j < Math.max(value.length, cache.length); j++) {
-          if (value[j] !== cache[j]) {
-            dirty = true
-            break
-          }
-        }
-
-        memoCaches[i] = value
-      }
-
-      if (!dirty) {
-        return
-      }
-    }
-
     const reset = instance && setCurrentInstance(instance)
 
     if (instance && instance.isMounted && !instance.isUpdating) {