小程序: 体积优化与分析

项目中的一次体积优化记录
更新于: 2023-09-06 18:07:45

场景

小程序 ci 上传，包体积过大，导致无法上传

项目中 ci 报错截图

问题抽象

分析: 核心代码

可以抽象成一个工具，下面的 analysis.json 可继续统计  files.subPackage === null 的体积大小

主包: analysis.files.subPackage === null  即为主包

const ci = require('miniprogram-ci');
const fs = require('fs');

const project = new ci.Project({
  appid: 'wx19bd7e588d12ff27',
  type: 'miniProgram',
  projectPath: './dist/build/mp-weixin',
  privateKeyPath: process.env['WEIXIN_PRIVATE_KEY']
});

ci.analyseCode(project).then((res) => {
  // console.log('res: ', res);
  // write file
  fs.writeFileSync('./dist/build/analysis.json', JSON.stringify(res));
});

优化版

添加了更多的信息，方便多次分析

const ci = require('miniprogram-ci');
const fs = require('fs');

const project = new ci.Project({
  appid: 'wx19bd7e588d12ff27',
  type: 'miniProgram',
  projectPath: './dist/build/mp-weixin',
  privateKeyPath: process.env['WEIXIN_PRIVATE_KEY']
});

ci.analyseCode(project).then((res) => {
  const files = res.files;
  const mainFiles = files.filter((item) => !item.subPackage);
  const top20Files = mainFiles
    .map((item) => {
      return {
        path: item.path,
        size: item.size / 1024,
        subPackage: item.subPackage
      };
    })
    .sort((a, b) => b.size - a.size)
    .slice(0, 20);
  // stat mainFiles size
  const mainFilesSize = mainFiles.reduce((total, item) => {
    return total + item.size;
  }, 0);
  const natureFilesSize = mainFilesSize / 1024 / 1024;
  console.log('natureFilesSize: ', natureFilesSize + 'MB');
  console.table(top20Files);
});

后续

已经添加到 mina-deploy 工具中去了，使用参数 hasAnalyse: true，即可开启包大小分析，效果图如下。

小程序主/次包大小分析

参考