perf(weapp-tailwindcss): 复用类名判定与 js 后处理结果

Author: sonofmagic

packages/weapp-tailwindcss/src/js/babel.ts

@@ -162,9 +162,16 @@ export function jsHandler(rawSource: string, options: IJsHandlerOptions): JsHand
 
   const result: JsHandlerResult = {
     code: ms.toString(),
-    get map() {
-      return ms.generateMap()
-    },
+  }
+
+  if (options.generateMap) {
+    Object.defineProperty(result, 'map', {
+      configurable: true,
+      enumerable: true,
+      get() {
+        return ms.generateMap()
+      },
+    })
   }
 
   if (options.moduleGraph && options.filename) {

packages/weapp-tailwindcss/src/shared/classname-transform.ts

@@ -2,6 +2,11 @@ import type { IJsHandlerOptions } from '../types'
 import { replaceWxml } from '../wxml/shared'
 
 export type ClassNameTransformDecision = 'direct' | 'escaped' | 'fallback' | 'skip'
+type EscapeMap = NonNullable<IJsHandlerOptions['escapeMap']>
+
+const escapedCandidateCacheByEscapeMap = new WeakMap<EscapeMap, Map<string, string>>()
+const defaultEscapedCandidateCache = new Map<string, string>()
+const URL_LIKE_CANDIDATE_REGEXP = /^(?:https?:)?\/\//
 
 /**
  * 决策结果，附带已计算的 escaped 值以避免下游重复计算。
@@ -31,7 +36,7 @@ function isArbitraryValueCandidate(candidate: string) {
   }
 
   // URL 片段中的 [] 不应作为任意值候选处理。
-  if (/^(?:https?:)?\/\//.test(normalized)) {
+  if (URL_LIKE_CANDIDATE_REGEXP.test(normalized)) {
     return false
   }
 
@@ -61,6 +66,30 @@ const SKIP_RESULT: ClassNameTransformResult = { decision: 'skip' }
 const DIRECT_RESULT: ClassNameTransformResult = { decision: 'direct' }
 const FALLBACK_RESULT: ClassNameTransformResult = { decision: 'fallback' }
 
+function getEscapedCandidate(candidate: string, escapeMap?: EscapeMap) {
+  if (!escapeMap) {
+    let cached = defaultEscapedCandidateCache.get(candidate)
+    if (cached === undefined) {
+      cached = replaceWxml(candidate, { escapeMap })
+      defaultEscapedCandidateCache.set(candidate, cached)
+    }
+    return cached
+  }
+
+  let store = escapedCandidateCacheByEscapeMap.get(escapeMap)
+  if (!store) {
+    store = new Map<string, string>()
+    escapedCandidateCacheByEscapeMap.set(escapeMap, store)
+  }
+
+  let cached = store.get(candidate)
+  if (cached === undefined) {
+    cached = replaceWxml(candidate, { escapeMap })
+    store.set(candidate, cached)
+  }
+  return cached
+}
+
 /**
  * JS 转译严格遵循 runtime class set：
  * 1. 直接命中 classNameSet 原始值；
@@ -94,7 +123,7 @@ export function resolveClassNameTransformWithResult(
   }
 
   if (classNameSet && classNameSet.size > 0) {
-    const escapedCandidate = replaceWxml(candidate, { escapeMap })
+    const escapedCandidate = getEscapedCandidate(candidate, escapeMap)
     if (escapedCandidate !== candidate && classNameSet.has(escapedCandidate)) {
       return { decision: 'escaped', escapedValue: escapedCandidate }
     }

packages/weapp-tailwindcss/test/js/babel-utils.test.ts

@@ -103,4 +103,16 @@ describe('babel helpers additional coverage', () => {
     expect(handled.error).toBeUndefined()
     expect(handled.map).toBeDefined()
   })
+
+  it('does not define a source map getter unless generateMap is enabled', () => {
+    const handled = babel.jsHandler('const cls = "w-[100px]"', {
+      classNameSet: new Set(['w-[100px]']),
+      escapeMap: MappingChars2String,
+      alwaysEscape: true,
+    })
+
+    expect(handled.code).toContain('w-_b100px_B')
+    expect(Object.hasOwn(handled, 'map')).toBe(false)
+    expect(handled.map).toBeUndefined()
+  })
 })

packages/weapp-tailwindcss/test/js/classname-transform.test.ts

@@ -0,0 +1,27 @@
+import { MappingChars2String } from '@weapp-core/escape'
+import { describe, expect, it, vi } from 'vitest'
+import * as classNameTransform from '@/shared/classname-transform'
+import * as wxmlShared from '@/wxml/shared'
+
+describe('classname transform caching', () => {
+  it('reuses escaped candidate results for repeated lookups', () => {
+    const spy = vi.spyOn(wxmlShared, 'replaceWxml')
+    const classNameSet = new Set(['bg-_b_h123456_B'])
+
+    const first = classNameTransform.resolveClassNameTransformWithResult('bg-[#123456]', {
+      classNameSet,
+      escapeMap: MappingChars2String,
+    })
+    const second = classNameTransform.resolveClassNameTransformWithResult('bg-[#123456]', {
+      classNameSet,
+      escapeMap: MappingChars2String,
+    })
+
+    expect(first).toEqual({
+      decision: 'escaped',
+      escapedValue: 'bg-_b_h123456_B',
+    })
+    expect(second).toEqual(first)
+    expect(spy).toHaveBeenCalledTimes(1)
+  })
+})