开源项目 `compressed-size-action` 使用教程

开源项目 compressed-size-action 使用教程

compressed-size-actionGitHub Action that adds compressed size changes to your PRs.项目地址:https://gitcode.com/gh_mirrors/co/compressed-size-action

1. 项目介绍

compressed-size-action 是一个 GitHub Action，用于在 Pull Request (PR) 中报告压缩后的文件大小变化。它可以帮助开发者监控和优化前端资源的大小，从而提升应用的性能。默认情况下，该项目会对比 gzip 压缩后的文件大小，但也可以配置使用其他压缩算法（如 brotli）或禁用压缩。

2. 项目快速启动

安装步骤

1. 创建 GitHub Actions 工作流文件：在你的项目根目录下创建一个 .github/workflows 目录，并在其中创建一个新的 YAML 文件，例如 compressed-size.yml。

2. 配置工作流：将以下内容复制到 compressed-size.yml 文件中：

name: Compressed Size

on: [pull_request]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: preactjs/compressed-size-action@v2

3. 提交并推送：将修改后的文件提交到你的 GitHub 仓库，并推送到远程仓库。

4. 查看结果：当有新的 Pull Request 提交时，GitHub Actions 会自动运行，并在 PR 中报告压缩后的文件大小变化。

3. 应用案例和最佳实践

应用案例

假设你正在开发一个前端项目，并且希望在每次提交代码时自动检查 JavaScript 文件的压缩大小变化。通过使用 compressed-size-action，你可以在每次 Pull Request 中看到这些文件的大小变化，从而及时发现和优化潜在的性能问题。

最佳实践

• 自定义文件匹配模式：默认情况下，compressed-size-action 会跟踪 dist/ 目录下的所有 JavaScript 文件。你可以通过 pattern 和 exclude 选项自定义要跟踪的文件列表。

- uses: preactjs/compressed-size-action@v2
  with:
    pattern: "build-output/**/*.{js,css,html,json}"
    exclude: "build-output/manifest.json,**/*.map"

• 清理脚本：在两次构建之间，你可能需要清理某些文件或目录。可以通过 clean-script 选项指定一个清理脚本。

- uses: preactjs/compressed-size-action@v2
  with:
    clean-script: "rm -rf build-output/node_modules"

4. 典型生态项目

compressed-size-action 通常与其他前端构建工具和 CI/CD 工具结合使用，例如：

• Webpack：用于打包和优化前端资源。
• ESLint：用于代码质量检查。
• Jest：用于单元测试。

这些工具可以与 compressed-size-action 一起使用，形成一个完整的前端开发和部署流程，帮助开发者提高代码质量和应用性能。

compressed-size-actionGitHub Action that adds compressed size changes to your PRs.项目地址:https://gitcode.com/gh_mirrors/co/compressed-size-action