@vxrn/compiler 1.2.17 → 1.2.18

package/src/cache.ts

@@ -0,0 +1,135 @@
+import { createHash } from 'node:crypto'
+import { existsSync, mkdirSync, readFileSync, statSync, writeFileSync } from 'node:fs'
+import { join } from 'node:path'
+
+/**
+ * Fast file-based cache for babel transforms
+ * Uses file mtime + content hash for invalidation
+ */
+
+interface CacheEntry {
+  /** File modification time when cached */
+  mtime: number
+  /** Hash of file content for additional validation */
+  hash: string
+  /** Cached transform result */
+  code: string
+  /** Optional source map */
+  map?: any
+}
+
+interface CacheStats {
+  hits: 0
+  misses: 0
+  writes: 0
+}
+
+const stats: CacheStats = { hits: 0, misses: 0, writes: 0 }
+
+function getCacheDir(): string {
+  // Use .vxrn cache directory
+  const cacheDir = join(process.cwd(), 'node_modules', '.vxrn', 'compiler-cache')
+  if (!existsSync(cacheDir)) {
+    mkdirSync(cacheDir, { recursive: true })
+  }
+  return cacheDir
+}
+
+function getCacheKey(filePath: string, environment: string): string {
+  // Create a hash of the file path + environment for the cache key
+  const hash = createHash('sha1').update(`${environment}:${filePath}`).digest('hex')
+  return hash
+}
+
+function getContentHash(code: string): string {
+  // Fast hash of file content
+  return createHash('sha1').update(code).digest('hex').slice(0, 16)
+}
+
+export function getCachedTransform(
+  filePath: string,
+  code: string,
+  environment: string
+): { code: string; map?: any } | null {
+  try {
+    const cacheDir = getCacheDir()
+    const cacheKey = getCacheKey(filePath, environment)
+    const cachePath = join(cacheDir, `${cacheKey}.json`)
+
+    if (!existsSync(cachePath)) {
+      stats.misses++
+      return null
+    }
+
+    const cached: CacheEntry = JSON.parse(readFileSync(cachePath, 'utf-8'))
+
+    // Check file mtime
+    const currentMtime = statSync(filePath).mtimeMs
+    if (cached.mtime !== currentMtime) {
+      stats.misses++
+      return null
+    }
+
+    // Double-check with content hash for safety
+    const currentHash = getContentHash(code)
+    if (cached.hash !== currentHash) {
+      stats.misses++
+      return null
+    }
+
+    stats.hits++
+    return { code: cached.code, map: cached.map }
+  } catch (err) {
+    // If cache read fails, just treat as miss
+    stats.misses++
+    return null
+  }
+}
+
+export function setCachedTransform(
+  filePath: string,
+  code: string,
+  result: { code: string; map?: any },
+  environment: string
+): void {
+  try {
+    const cacheDir = getCacheDir()
+    const cacheKey = getCacheKey(filePath, environment)
+    const cachePath = join(cacheDir, `${cacheKey}.json`)
+
+    const mtime = statSync(filePath).mtimeMs
+    const hash = getContentHash(code)
+
+    const entry: CacheEntry = {
+      mtime,
+      hash,
+      code: result.code,
+      map: result.map,
+    }
+
+    writeFileSync(cachePath, JSON.stringify(entry), 'utf-8')
+    stats.writes++
+  } catch (err) {
+    // Silently fail cache writes
+    console.warn(`[cache] Failed to write cache for ${filePath}:`, err)
+  }
+}
+
+export function getCacheStats(): CacheStats {
+  return { ...stats }
+}
+
+export function logCacheStats(): void {
+  // Only log cache stats when debugging
+  if (!process.env.DEBUG_COMPILER_PERF) {
+    return
+  }
+
+  const total = stats.hits + stats.misses
+  if (total === 0) return
+
+  const hitRate = ((stats.hits / total) * 100).toFixed(1)
+  console.info(
+    `\n💾 [Cache Stats] ${stats.hits} hits / ${stats.misses} misses (${hitRate}% hit rate), ${stats.writes} writes`
+  )
+}

package/src/index.ts

@@ -15,12 +15,57 @@ import { debug, runtimePublicPath, validParsers } from './constants'
 import { getBabelOptions, transformBabel } from './transformBabel'
 import { transformSWC } from './transformSWC'
 import type { Environment, GetTransformProps, Options } from './types'
+import { getCachedTransform, logCacheStats, setCachedTransform } from './cache'
 
 export * from './configure'
 export * from './transformBabel'
 export * from './transformSWC'
 export type { GetTransform } from './types'
 
+// Performance tracking
+const perfStats = {
+  babel: {
+    totalCalls: 0,
+    totalTransforms: 0,
+    totalTime: 0,
+    byEnvironment: {} as Record<string, { calls: number; transforms: number; time: number }>,
+  },
+  optimizeDeps: {
+    byEnvironment: {} as Record<
+      string,
+      { filesChecked: number; filesTransformed: number; startTime: number }
+    >,
+  },
+}
+
+function logPerfSummary() {
+  // Only log detailed perf stats when debugging
+  if (!process.env.DEBUG_COMPILER_PERF) {
+    return
+  }
+
+  console.info('\n📊 [Compiler Performance Summary]')
+  console.info(
+    `Babel: ${perfStats.babel.totalTransforms} transforms / ${perfStats.babel.totalCalls} calls (${((perfStats.babel.totalTransforms / Math.max(perfStats.babel.totalCalls, 1)) * 100).toFixed(1)}% transform rate)`
+  )
+  console.info(`Babel total time: ${perfStats.babel.totalTime}ms`)
+
+  for (const [env, stats] of Object.entries(perfStats.babel.byEnvironment)) {
+    if (stats.transforms > 0) {
+      console.info(
+        `  ${env}: ${stats.transforms} transforms, ${stats.time}ms (${(stats.time / stats.transforms).toFixed(1)}ms avg)`
+      )
+    }
+  }
+
+  for (const [env, stats] of Object.entries(perfStats.optimizeDeps.byEnvironment)) {
+    const elapsed = Date.now() - stats.startTime
+    console.info(
+      `optimizeDeps ${env}: checked ${stats.filesChecked} files, transformed ${stats.filesTransformed} (${elapsed}ms)`
+    )
+  }
+}
+
 // Shared Babel transform logic
 async function performBabelTransform({
   id,
@@ -37,6 +82,13 @@ async function performBabelTransform({
   reactForRNVersion: '18' | '19'
   optionsIn?: Partial<Options>
 }) {
+  // Track stats
+  perfStats.babel.totalCalls++
+  if (!perfStats.babel.byEnvironment[environment]) {
+    perfStats.babel.byEnvironment[environment] = { calls: 0, transforms: 0, time: 0 }
+  }
+  perfStats.babel.byEnvironment[environment].calls++
+
   const transformProps: GetTransformProps = {
     id,
     code,
@@ -60,11 +112,33 @@ async function performBabelTransform({
     })
 
     if (babelOptions) {
+      // Check cache first
+      const cached = getCachedTransform(id, code, environment)
+      if (cached) {
+        perfStats.babel.byEnvironment[environment].transforms++
+        debug?.(`[babel/cached] ${id}`)
+        return cached
+      }
+
+      // Cache miss - do the transform
+      const startTime = Date.now()
       const babelOut = await transformBabel(id, code, babelOptions)
+      const babelTime = Date.now() - startTime
+
       if (babelOut?.code) {
+        perfStats.babel.totalTransforms++
+        perfStats.babel.totalTime += babelTime
+        perfStats.babel.byEnvironment[environment].transforms++
+        perfStats.babel.byEnvironment[environment].time += babelTime
+
         debug?.(`[babel] ${id}`)
         const outCode = `${babelOut.code}\n// vxrn-did-babel`
-        return { code: outCode, map: babelOut.map }
+        const result = { code: outCode, map: babelOut.map }
+
+        // Cache the result
+        setCachedTransform(id, code, result, environment)
+
+        return result
       }
     }
   }
@@ -121,7 +195,7 @@ async function performFullTransform({
   let code = codeIn
   let out: {
     code: string
-    map: any
+    map?: any
   } | null = null
 
   // avoid double-processing files already handled by optimizeDeps
@@ -289,9 +363,20 @@ ${rootJS.code}
                   {
                     name: `transform-before-optimize-deps-${environment}`,
                     setup(build) {
+                      // Init stats for this environment
+                      if (!perfStats.optimizeDeps.byEnvironment[environment]) {
+                        perfStats.optimizeDeps.byEnvironment[environment] = {
+                          filesChecked: 0,
+                          filesTransformed: 0,
+                          startTime: Date.now(),
+                        }
+                      }
+
                       build.onLoad(
                         { filter: /node_modules\/.*\.(tsx?|jsx?|mjs|cjs)$/ },
                         async (args) => {
+                          perfStats.optimizeDeps.byEnvironment[environment].filesChecked++
+
                           const production = process.env.NODE_ENV === 'production'
                           const code = await readFile(args.path, 'utf-8')
 
@@ -310,6 +395,8 @@ ${rootJS.code}
                             return null
                           }
 
+                          perfStats.optimizeDeps.byEnvironment[environment].filesTransformed++
+
                           // Determine loader based on file extension
                           const ext = extname(args.path)
                           const loader =
@@ -327,6 +414,25 @@ ${rootJS.code}
                           }
                         }
                       )
+
+                      build.onEnd(() => {
+                        // Only log detailed stats when debugging
+                        if (process.env.DEBUG_COMPILER_PERF) {
+                          const stats = perfStats.optimizeDeps.byEnvironment[environment]
+                          const elapsed = Date.now() - stats.startTime
+                          console.info(
+                            `[optimizeDeps ${environment}] Done: ${stats.filesChecked} files checked, ${stats.filesTransformed} transformed (${elapsed}ms)`
+                          )
+                        }
+
+                        // Log cache stats when all environments are done
+                        const allDone =
+                          Object.keys(perfStats.optimizeDeps.byEnvironment).length >= 2
+                        if (allDone) {
+                          logCacheStats()
+                          logPerfSummary()
+                        }
+                      })
                     },
                   },
                 ],

package/src/transformBabel.ts

@@ -243,11 +243,18 @@ const REANIMATED_AUTOWORKLETIZATION_KEYWORDS = [
  */
 const REANIMATED_REGEX = new RegExp(REANIMATED_AUTOWORKLETIZATION_KEYWORDS.join('|'))
 
+// Packages to skip for reanimated babel transform
+// These either have false positives (mention keywords but don't use worklets)
+// or cause issues when transformed
 const REANIMATED_IGNORED_PATHS = [
-  // React and React Native libraries are not likely to use reanimated.
-  // This can also avoid the "[BABEL] Note: The code generator has deoptimised the styling of ... as it exceeds the max of 500KB" warning since the react-native source code also contains `useAnimatedProps`.
+  // Prebuilt/vendored react-native that shouldn't be transformed
   'react-native-prebuilt',
   'node_modules/.vxrn/react-native',
+  // Known false positives - they mention worklet keywords in comments/strings but don't use them
+  'node_modules/react/',
+  'node_modules/react-dom/',
+  'node_modules/react-native/',
+  'node_modules/react-native-web/',
 ]
 
 const REANIMATED_IGNORED_PATHS_REGEX = new RegExp(
@@ -258,10 +265,18 @@ function shouldBabelReanimated({ code, id }: Props) {
   if (!configuration.enableReanimated) {
     return false
   }
-  if (!REANIMATED_IGNORED_PATHS_REGEX.test(id) && REANIMATED_REGEX.test(code)) {
-    debug?.(` 🪄 [reanimated] ${relative(process.cwd(), id)}`)
+
+  // Check if path should be ignored
+  if (REANIMATED_IGNORED_PATHS_REGEX.test(id)) {
+    return false
+  }
+
+  // Check regex for all files (both node_modules and user code)
+  if (REANIMATED_REGEX.test(code)) {
+    const location = id.includes('node_modules') ? 'node_modules' : 'user-code'
+    debug?.(` 🪄 [reanimated/${location}] ${relative(process.cwd(), id)}`)
     return true
   }
-  debug?.(` not using reanimated ${relative(process.cwd(), id)}`)
+
   return false
 }

package/types/cache.d.ts

@@ -0,0 +1,17 @@
+interface CacheStats {
+    hits: 0;
+    misses: 0;
+    writes: 0;
+}
+export declare function getCachedTransform(filePath: string, code: string, environment: string): {
+    code: string;
+    map?: any;
+} | null;
+export declare function setCachedTransform(filePath: string, code: string, result: {
+    code: string;
+    map?: any;
+}, environment: string): void;
+export declare function getCacheStats(): CacheStats;
+export declare function logCacheStats(): void;
+export {};
+//# sourceMappingURL=cache.d.ts.map

package/types/cache.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cache.d.ts","sourceRoot":"","sources":["../src/cache.ts"],"names":[],"mappings":"AAoBA,UAAU,UAAU;IAClB,IAAI,EAAE,CAAC,CAAA;IACP,MAAM,EAAE,CAAC,CAAA;IACT,MAAM,EAAE,CAAC,CAAA;CACV;AAwBD,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,MAAM,EAChB,IAAI,EAAE,MAAM,EACZ,WAAW,EAAE,MAAM,GAClB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,GAAG,CAAA;CAAE,GAAG,IAAI,CAkCpC;AAED,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,MAAM,EAChB,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,GAAG,CAAA;CAAE,EACnC,WAAW,EAAE,MAAM,GAClB,IAAI,CAsBN;AAED,wBAAgB,aAAa,IAAI,UAAU,CAE1C;AAED,wBAAgB,aAAa,IAAI,IAAI,CAapC"}

package/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAQH,OAAO,KAAK,EAAE,YAAY,EAA8B,MAAM,MAAM,CAAA;AAKpE,OAAO,KAAK,EAAkC,OAAO,EAAE,MAAM,SAAS,CAAA;AAEtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AA0J3C,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CA0NzB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAQH,OAAO,KAAK,EAAE,YAAY,EAA8B,MAAM,MAAM,CAAA;AAKpE,OAAO,KAAK,EAAkC,OAAO,EAAE,MAAM,SAAS,CAAA;AAGtE,cAAc,aAAa,CAAA;AAC3B,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAmO3C,wBAAsB,wBAAwB,CAC5C,SAAS,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,GAC3B,OAAO,CAAC,YAAY,EAAE,CAAC,CA0PzB"}