How does Rspack's caching mechanism work?

Rspack's caching mechanism is one of the key factors in its high performance. Through intelligent caching strategies, build speed can be significantly improved. Here's a detailed explanation of Rspack's caching mechanism:

Cache Types

Rspack provides multiple cache types suitable for different scenarios:

1. Memory Cache

Stores build results in memory, fastest speed but lost after restart:

javascript
module.exports = {
  cache: {
    type: 'memory'
  }
}

Characteristics:

• Fastest cache speed
• Cache lost after restart
• Suitable for development environment
• Uses memory resources

2. Filesystem Cache

Stores build results in filesystem, persisted:

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.rspack-cache'),
    cacheLocation: path.resolve(__dirname, '.rspack-cache'),
    name: 'rspack-cache',
    buildDependencies: {
      config: [__filename]
    }
  }
}

Characteristics:

• Persistent cache
• Maintained across builds
• Suitable for all environments
• Requires disk space

Cache Configuration Options

Basic Configuration

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.cache'),
    cacheLocation: path.resolve(__dirname, '.cache/rspack'),
    name: 'my-cache',
    version: '1.0.0'
  }
}

Cache Dependencies

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    buildDependencies: {
      config: [__filename],
      tsconfig: ['./tsconfig.json']
    }
  }
}

Cache Compression

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    compression: 'gzip',
    maxAge: 1000 * 60 * 60 * 24 * 7 // 7 days
  }
}

Caching Strategies

1. Module Caching

Cache module compilation results:

javascript
module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            cacheDirectory: true,
            cacheCompression: false
          }
        }
      }
    ]
  }
}

2. Resolution Caching

Cache module resolution results:

javascript
module.exports = {
  cache: {
    type: 'filesystem'
  },
  resolve: {
    cacheWithContext: true,
    cachePredicate: (module) => {
      return !/[\\/]node_modules[\\/]/.test(module.resource);
    }
  }
}

3. Build Caching

Cache entire build process:

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.rspack-cache'),
    managedPaths: [path.resolve(__dirname, 'node_modules')],
    immutablePaths: []
  }
}

Cache Invalidation Strategies

1. Content-based Invalidation

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    hashAlgorithm: 'md4'
  }
}

2. Time-based Invalidation

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    maxAge: 1000 * 60 * 60 * 24 * 7 // 7 days
  }
}

3. Manual Cache Clearing

javascript
const { rmSync } = require('fs');

// Clear cache directory
rmSync(path.resolve(__dirname, '.rspack-cache'), {
  recursive: true,
  force: true
});

Cache Optimization

1. Cache Size Limit

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    maxMemoryGenerations: 1,
    maxAge: 1000 * 60 * 60 * 24 * 7,
    size: 500 * 1024 * 1024 // 500MB
  }
}

2. Cache Compression

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    compression: 'gzip',
    compressionLevel: 9
  }
}

3. Parallel Caching

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    parallelism: 4
  }
}

Cache Monitoring

1. Cache Statistics

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    profile: true
  }
}

2. Cache Logging

javascript
module.exports = {
  stats: {
    cached: true,
    cachedAssets: true
  }
}

Environment-specific Configuration

Development Environment

javascript
module.exports = {
  mode: 'development',
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.cache/dev')
  }
}

Production Environment

javascript
module.exports = {
  mode: 'production',
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.cache/prod'),
    maxAge: 1000 * 60 * 60 * 24 * 30 // 30 days
  }
}

CI/CD Caching

1. Persistent Caching

javascript
module.exports = {
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.cache/ci'),
    buildDependencies: {
      config: [__filename]
    }
  }
}

2. Cache Restoration

yaml
# GitHub Actions example
- name: Restore cache
  uses: actions/cache@v3
  with:
    path: .cache
    key: ${{ runner.os }}-rspack-${{ hashFiles('**/package-lock.json') }}

Best Practices

1. Cache Strategy Selection:

   • Development environment: Use filesystem cache
   • Production environment: Use persistent cache
   • CI/CD: Configure cache restoration

2. Cache Management:

   • Regularly clean expired cache
   • Monitor cache size
   • Optimize cache configuration

3. Performance Optimization:

   • Enable cache compression
   • Reasonably set cache size
   • Use parallel caching

4. Cache Validation:

   • Validate cache effectiveness
   • Handle cache invalidation
   • Provide cache clearing mechanism

5. Team Collaboration:

   • Unify cache configuration
   • Document caching strategies
   • Share cache best practices

Rspack's caching mechanism through intelligent caching strategies can significantly improve build speed, especially in large projects and CI/CD environments, the role of caching is more obvious.