Flutter资源优化插件asset_opt的使用

Flutter资源优化插件asset_opt的使用

asset_opt 是一个强大的 Flutter/Dart 工具，用于分析和优化项目资源。它提供了详细的资源使用情况洞察，并自动优化图像以提升应用程序性能。

Repo Card

特性 🚀

详细资源分析
  • 📊 大小和类型分布可视化
  • 📁 目录结构分解
  • 🔍 图像尺寸分析
  • ⚠️ 问题检测和建议
智能优化
  • 🗜️ 自动图像压缩
  • 📏 在保持质量的同时减小大小
  • 🔄 格式转换建议
  • 📦 安全备份在优化前
美丽的报告
  • 📈 可视化进度跟踪
  • 🎨 颜色编码终端输出
  • 📋 详细的JSON报告
  • 📊 大小统计和节省

安装 📥

dart pub global activate asset_opt

或者在 pubspec.yaml 中添加以供项目特定使用：

dev_dependencies:
  asset_opt: ^1.0.2

使用 💻

命令行
# 显示帮助和可用命令
asset_opt --help

# 分析项目资源
asset_opt --analyze

# 分析并优化
asset_opt --optimize

# 指定项目路径和质量
asset_opt -p /path/to/project -q 85 --optimize

# 详细输出
asset_opt --verbose
作为库使用
import 'package:asset_opt/asset_opt.dart';

void main() async {
  // 初始化服务
  final fileService = FileService();
  final imageService = ImageService();
  final analysisState = AnalysisState();

  // 创建分析器
  final analyzer = AnalyzeCommand(
    fileService,
    imageService,
    analysisState,
  );

  // 运行分析
  final analysis = await analyzer.execute('./');

  // 检查是否有问题
  if (analysis.hasIssues()) {
    print('发现优化机会：');
    for (final asset in analysis.assets) {
      if (asset.issues.isNotEmpty) {
        print('${asset.info.name}：');
        for (final issue in asset.issues) {
          print('  - ${issue.message}');
        }
      }
    }
  }
}

输出示例 📸

资源分析
📊 资源分析报告
────────────────────────
项目: /Users/username/projects/my_app
────────────────────────
└─ assets (632 文件, 22.4 MB)
   ├─ images (631 文件, 22.4 MB)
   │  ├─ flags (492 文件, 3.7 MB)
   │  └─ bgs (4 文件, 2.5 MB)
   └─ icons (1 文件, 829 B)
类型分布
🗂  资源按类型分布
────────────────────────
类型     大小       文件   分布
PNG      22.4 MB    631    │████████████████████████████  │ 65.2%
JPEG     10.2 MB    492    │████████████████              │ 29.8%
WEBP      1.5 MB      4    │███                           │  4.3%
SVG     829.0 B       1    │                              │  0.7%
优化建议
⚠️  优化机会
────────────────────────
❌ background.png
   当前: 2.5 MB
   推荐: < 500 KB (减少 80%)
   → 使用 pngquant 或 tinypng 进行无损压缩

配置 ⚙️

在项目根目录下创建 asset_opt.yaml 文件：

# 资源优化设置
optimization:
  jpeg_quality: 85
  webp_quality: 80
  strip_metadata: true

# 大小限制
limits:
  max_file_size: 1MB
  max_total_size: 50MB

# 排除模式
exclude:
  - '**/test/assets/*'

更多关于Flutter资源优化插件asset_opt的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter资源优化插件asset_opt的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter开发中，asset_opt 是一个用于资源优化的插件，可以帮助开发者减少应用包的大小并提高加载性能。尽管 asset_opt 插件的具体实现和功能可能会随着版本更新而有所变化，但以下是一个基本的示例，展示了如何使用 asset_opt 来优化 Flutter 项目中的资源。

首先，确保你已经在 pubspec.yaml 文件中添加了 asset_opt 依赖：

dependencies:
  flutter:
    sdk: flutter
  asset_opt: ^x.y.z  # 替换为最新版本号

然后，运行 flutter pub get 来获取依赖。

配置 asset_opt

在 pubspec.yaml 中配置你想要优化的资源，例如图片和字体：

flutter:
  assets:
    - assets/images/icon.png
    - assets/fonts/custom_font.ttf

使用 asset_opt 优化资源

通常，asset_opt 插件会提供一些命令行工具来自动处理资源优化。但在这里，为了演示目的，我们假设 asset_opt 提供了一个 Flutter 构建时的优化步骤。实际上，你可能需要查看插件的文档来了解具体的命令和使用方法。

以下是一个假设性的示例，展示了如何在构建过程中集成 asset_opt（注意，这只是一个概念性的展示，具体实现取决于插件的实际功能）：

import 'package:flutter/material.dart';
import 'package:asset_opt/asset_opt.dart' as assetOpt; // 假设插件提供了这样的导入

void main() {
  // 假设 assetOpt.optimizeAssets() 是一个静态方法，用于优化资源
  // 注意：这只是一个假设性的方法调用，实际使用需参考插件文档
  assetOpt.optimizeAssets(inputDir: 'assets', outputDir: 'build/assets');

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Asset Optimization Demo'),
        ),
        body: Center(
          child: Image.asset('build/assets/images/icon.png'), // 使用优化后的资源路径
        ),
      ),
    );
  }
}

重要提示：上面的代码是一个概念性的示例，实际上 asset_opt 插件可能并不提供 optimizeAssets 这样的静态方法，也不要求你在 Dart 代码中直接调用优化逻辑。通常，资源优化是在构建过程中自动完成的，你可能需要在命令行中运行特定的命令，或者在构建配置文件中添加一些设置。

命令行工具使用示例（假设）

假设 asset_opt 提供了一个命令行工具，你可以这样使用它：

flutter pub run asset_opt:optimize --input-dir=assets --output-dir=build/assets

这条命令会读取 assets 目录下的资源，并将优化后的资源输出到 build/assets 目录。然后，你可以在 Flutter 应用中使用这些优化后的资源。

结论

由于 asset_opt 插件的具体实现和使用方法可能会随着版本更新而变化，因此强烈建议查阅插件的官方文档和示例代码来了解最新的使用方法和最佳实践。上面的示例仅用于演示如何在 Flutter 项目中集成和使用资源优化插件的概念。

回到顶部