perf(weapp-tailwindcss): 减少候选解析与 legacy 回退开销

Author: sonofmagic

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

@@ -105,6 +105,12 @@ function createCandidatePlanResolver(
   classContext: boolean,
 ) {
   const { escapeMap } = options
+  const transformOptions = classContext
+    ? {
+        ...options,
+        classContext,
+      }
+    : options
   const cache = new Map<string, CandidatePlan>()
 
   return (candidate: string): CandidatePlan => {
@@ -113,10 +119,7 @@ function createCandidatePlanResolver(
       return cached
     }
 
-    const result = resolveClassNameTransformWithResult(candidate, {
-      ...options,
-      classContext,
-    })
+    const result = resolveClassNameTransformWithResult(candidate, transformOptions)
 
     if (result.decision === 'skip') {
       const plan = { result }

packages/weapp-tailwindcss/src/wxml/utils/codegen/legacy-rewriter.ts

@@ -5,11 +5,15 @@ import { JsTokenUpdater } from '../../../js/JsTokenUpdater'
 import { createLegacyTraverseOptions } from './legacy-visitor'
 
 export function rewriteLegacyExpression(match: string, options: ITemplateHandlerOptions) {
-  const ms = new MagicString(match)
   const ast = parseExpression(match)
   const jsTokenUpdater = new JsTokenUpdater()
 
   traverse(ast, createLegacyTraverseOptions(options, jsTokenUpdater))
+  if (jsTokenUpdater.length === 0) {
+    return match
+  }
+
+  const ms = new MagicString(match)
   jsTokenUpdater.updateMagicString(ms)
 
   return ms.toString()

packages/weapp-tailwindcss/src/wxml/utils/codegen/legacy-visitor.ts

@@ -22,6 +22,12 @@ export function createLegacyTraverseOptions(
   options: ITemplateHandlerOptions,
   jsTokenUpdater: JsTokenUpdater,
 ) {
+  const legacyReplaceOptions = {
+    escapeMap: options.escapeMap,
+    classNameSet: options.runtimeSet,
+    needEscaped: true,
+    alwaysEscape: true,
+  }
   return {
     StringLiteral(path) {
       if (shouldSkipLegacyStringLiteral(path)) {
@@ -30,12 +36,7 @@ export function createLegacyTraverseOptions(
       jsTokenUpdater.addToken(
         replaceHandleValue(
           path,
-          {
-            escapeMap: options.escapeMap,
-            classNameSet: options.runtimeSet,
-            needEscaped: true,
-            alwaysEscape: true,
-          },
+          legacyReplaceOptions,
         ),
       )
 

packages/weapp-tailwindcss/test/js/handlers-branches.test.ts

@@ -1,9 +1,10 @@
 import type { NodePath } from '@babel/traverse'
 import type { NumericLiteral, StringLiteral, TemplateElement } from '@babel/types'
 import { MappingChars2String } from '@weapp-core/escape'
-import { describe, expect, it } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import { parse, traverse } from '@/babel'
 import { replaceHandleValue } from '@/js/handlers'
+import * as classNameTransform from '@/shared/classname-transform'
 
 type LiteralKind = 'StringLiteral' | 'TemplateElement'
 
@@ -164,6 +165,20 @@ describe('replaceHandleValue branch coverage', () => {
     expect(token?.value).toBe('gap-_b20px_B gap-_b20px_B')
   })
 
+  it('reuses the candidate plan for repeated candidates in one literal', () => {
+    const literal = getLiteralPath('const repeated = \'w-[100px] w-[100px]\'', 'StringLiteral')
+    const spy = vi.spyOn(classNameTransform, 'resolveClassNameTransformWithResult')
+
+    const token = replaceHandleValue(literal, {
+      escapeMap: MappingChars2String,
+      classNameSet: new Set(['w-[100px]']),
+      needEscaped: true,
+    })
+
+    expect(token?.value).toBe('w-_b100px_B w-_b100px_B')
+    expect(spy).toHaveBeenCalledTimes(1)
+  })
+
   it('evaluates unicode decoding guard when no escape is present', () => {
     const literal = getLiteralPath('const plain = \'flex\'', 'StringLiteral')
     const token = replaceHandleValue(literal, {

packages/weapp-tailwindcss/test/wxml/utils.test.ts

@@ -102,4 +102,9 @@ describe('utils', () => {
       wrapExpression: true,
     })
   })
+
+  it('falls back to legacy expression rewriting when runtime js handler is unavailable', () => {
+    const code = generateCode(`{'w-[100px]': flag}`)
+    expect(code).toContain(`'w-_b100px_B'`)
+  })
 })