Optimize interpolators

d0rich · Jul 9, 2023 · edc0151 · edc0151
1 parent e1c5772
commit edc0151
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 7 deletions.
diff --git a/components/d/character/Index.vue b/components/d/character/Index.vue
@@ -94,15 +94,16 @@ watch(
       useHref.value = `#${newPose}-shape`
       return
     }
-    const interpolator = interpolate(
-      poseShapeMap[oldPose]?.getAttribute('d') ?? '',
-      poseShapeMap[newPose]?.getAttribute('d') ?? '',
-      { maxSegmentLength: 100 }
-    )
-    console.log(interpolator)
+    const interpolator = useCache(`character:morph:${oldPose}-${newPose}`, () => {
+      return interpolate(
+        poseShapeMap[oldPose]?.getAttribute('d') ?? '',
+        poseShapeMap[newPose]?.getAttribute('d') ?? '',
+        { maxSegmentLength: 30 }
+      )
+    })
 
     const howFarAlongTheAnimationIsOnAScaleOfZeroToOne =
-      createTimeInterpolator(150)
+      createTimeInterpolator(200)
 
     requestAnimationFrame(draw)
 

diff --git a/composables/calculations.ts b/composables/calculations.ts
@@ -0,0 +1,10 @@
+const cache = new Map<string, any>()
+
+export function useCache<T>(key: string, fn: () => T): T {
+  if (cache.has(key)) {
+    return cache.get(key)
+  }
+  const value = fn()
+  cache.set(key, value)
+  return value
+}