Docker容器中Laravel Mix编译极慢，求优化解决方案

一、优先解决WSL2跨文件系统IO性能瓶颈 #

Windows目录挂载到WSL2容器是性能卡顿的核心诱因之一，WSL2对NTFS文件系统的读写效率远低于自身的ext4文件系统。

• 迁移项目到WSL2内部目录：
  将项目从Windows本地的./src移动到WSL2的用户目录，比如/home/<你的用户名>/laravel-project，再修改docker-compose.yml中的挂载路径：

  volumes:
    - /home/<你的用户名>/laravel-project:/var/www/html
  

  容器直接访问WSL2内部文件系统后，IO性能会大幅提升，编译和站点加载速度都会明显改善。

• 启用WSL2文件系统缓存（妥协方案）：
  若不想迁移项目，可在.wslconfig中添加元数据缓存配置：

  [wsl2]
  memory=8GB
  processors=2
  filesystemCache=metadata  # 启用元数据缓存，提升文件访问效率
  

  修改后执行wsl --shutdown重启WSL生效。

二、优化npm容器配置 #

• 挂载npm缓存目录：
  每次执行npm run若没有缓存会重复下载依赖，挂载缓存卷可避免重复操作，加快编译速度。修改docker-compose.yml的npm服务：

  volumes:
    - ./src:/var/www/html
    - npm_cache:/root/.npm  # 添加npm缓存卷
  

  并在docker-compose.yml底部添加卷定义：

  volumes:
    npm_cache:
  

• 升级Node.js版本：
  当前使用的node:14.5.0-alpine版本较旧，新版本Node.js和npm在性能上有不少优化，建议升级到LTS版本，比如修改node.dockerfile：

  FROM node:20-alpine
  

三、优化Laravel Mix编译速度 #

• 启用多线程压缩：
  在webpack.mix.js中开启多线程压缩，利用多核CPU加快编译：

  mix.js('resources/js/app.js', 'public/js')
     .sass('resources/sass/app.scss', 'public/css')
     .options({
         terser: {
             parallel: true,  // 启用多线程JS压缩
         }
     })
     .version();
  

• 精简编译任务：
  检查webpack.mix.js，移除多余的重复打包任务，减少不必要的编译开销。

四、优化NGINX站点加载速度 #

• 启用静态资源缓存：
  在NGINX配置文件中添加静态资源缓存规则，减少重复请求：

  location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
      expires 1y;
      add_header Cache-Control "public, immutable";
      access_log off;
  }
  

• 开启Gzip压缩：
  启用Gzip压缩减少传输文件体积，提升加载速度：

  gzip on;
  gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
  

五、其他WSL2优化 #

• 配置交换内存：
  在.wslconfig中添加交换内存设置，避免内存不足导致的性能下降：

  [wsl2]
  swap=4GB
  swapFile=C:\\temp\\wsl-swap.vhdx
  

内容的提问来源于stack exchange，提问作者Abhishek Sharma