{"id":13631079,"url":"https://github.com/funbox/optimizt","last_synced_at":"2025-05-15T18:09:51.565Z","repository":{"id":38840193,"uuid":"301748858","full_name":"funbox/optimizt","owner":"funbox","description":"CLI image optimization tool","archived":false,"fork":false,"pushed_at":"2023-10-02T10:19:56.000Z","size":2814,"stargazers_count":943,"open_issues_count":4,"forks_count":24,"subscribers_count":22,"default_branch":"master","last_synced_at":"2025-05-10T19:17:09.803Z","etag":null,"topics":["avif","gif","image-compression","jpeg","png","svg","webp"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/funbox.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2020-10-06T14:10:05.000Z","updated_at":"2025-05-05T17:01:15.000Z","dependencies_parsed_at":"2024-01-31T20:58:21.857Z","dependency_job_id":null,"html_url":"https://github.com/funbox/optimizt","commit_stats":{"total_commits":298,"total_committers":6,"mean_commits":"49.666666666666664","dds":"0.12080536912751683","last_synced_commit":"571ad61fdbb95233ae8ac0c80a03e31319b7be84"},"previous_names":[],"tags_count":27,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/funbox%2Foptimizt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/funbox%2Foptimizt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/funbox%2Foptimizt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/funbox%2Foptimizt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/funbox","download_url":"https://codeload.github.com/funbox/optimizt/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254394722,"owners_count":22063984,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["avif","gif","image-compression","jpeg","png","svg","webp"],"created_at":"2024-08-01T22:02:09.789Z","updated_at":"2025-05-15T18:09:51.527Z","avatar_url":"https://github.com/funbox.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","svg"],"sub_categories":[],"readme":"# ⛔ THIS REPO IS UNMAINTAINED\n\nFuture development moved to \u003chttps://github.com/343dev/optimizt\u003e.\n\n# @funboxteam/optimizt\n\n\u003cimg align=\"right\" width=\"192\" height=\"192\"\n     alt=\"Optimizt avatar: OK sign with Mona Lisa picture between the fingers\"\n     src=\"./images/logo.png\"\u003e\n\n[![npm](https://img.shields.io/npm/v/@funboxteam/optimizt.svg)](https://www.npmjs.com/package/@funboxteam/optimizt)\n\n**Optimizt** is a CLI tool that helps you prepare images during frontend development.\n\nIt can compress PNG, JPEG, GIF and SVG lossy and lossless and create AVIF and WebP versions for raster images.\n\n[По-русски](./README.ru.md)\n\n## Rationale\n\nAs frontend developers we have to care about pictures: compress PNG \u0026 JPEG, remove useless parts of SVG,\ncreate AVIF and WebP for modern browsers, etc. One day we got tired of using a bunch of apps for that,\nand created one tool that does everything we want.\n\n## Usage\n\nInstall the tool:\n\n```sh\nnpm i -g @funboxteam/optimizt\n```\n\nOptimize!\n\n```sh\noptimizt path/to/picture.jpg\n```\n\n## Command line flags\n\n- `--avif` — create AVIF versions for the passed paths instead of compressing them.\n- `--webp` — create WebP versions for the passed paths instead of compressing them.\n- `-f, --force` — force create AVIF and WebP even if output file size increased or file already exists.\n- `-l, --lossless` — optimize losslessly instead of lossily.\n- `-v, --verbose` — show additional info, e.g. skipped files.\n- `-c, --config` — use this configuration, overriding default config options if present.\n- `-o, --output` — write result to provided directory.\n- `-V, --version` — show tool version.\n- `-h, --help` — show help.\n\n## Examples\n\n```bash\n# one image optimization\noptimizt path/to/picture.jpg\n\n# list of images optimization losslessly\noptimizt --lossless path/to/picture.jpg path/to/another/picture.png\n\n# recursive AVIF creation in the passed directory\noptimizt --avif path/to/directory\n\n# recursive WebP creation in the passed directory\noptimizt --webp path/to/directory\n\n# recursive JPEG optimization in the current directory\nfind . -iname \\*.jpg -exec optimizt {} +\n```\n\n## Differences between Lossy and Lossless\n\n### Lossy (by default)\n\nAllows you to obtain the final image with a balance between a high level of compression and a minimum level\nof visual distortion.\n\n### Lossless (--lossless flag)\n\nWhen creating AVIF and WebP versions, optimizations are applied that do not affect the visual quality of the images.\n\nPNG, JPEG, and GIF optimization uses settings that maximize the visual quality of the image at the expense of\nthe final file size.\n\nWhen processing SVG files, the settings for Lossy and Lossless modes are identical.\n\n## Configuration\n\n[JPEG](https://sharp.pixelplumbing.com/api-output#jpeg), [PNG](https://sharp.pixelplumbing.com/api-output#png),\n[WebP](https://sharp.pixelplumbing.com/api-output#webp), and [AVIF](https://sharp.pixelplumbing.com/api-output#avif)\nprocessing is done using [sharp](https://github.com/lovell/sharp) library, while SVG is processed using\n[svgo](https://github.com/svg/svgo) utility.\n\nFor optimizing GIFs, [gifsicle](https://github.com/kohler/gifsicle) is used, and for converting to WebP,\n[gif2webp](https://developers.google.com/speed/webp/docs/gif2webp) is used.\n\n\u003e 💡 Lossless mode uses [Guetzli](https://github.com/google/guetzli) encoder to optimize JPEG, which allows to get\n\u003e a high level of compression and still have a good visual quality. But you should keep in mind that if you optimize\n\u003e the file again, the size may decrease at the expense of degrading the visual quality of the image.\n\nThe default settings are located in [.optimiztrc.js](./.optimiztrc.js), the file contains a list of supported parameters\nand their brief description.\n\nTo disable any of the parameters, you should use `false` for the value.\n\nWhen running with the `--config path/to/.optimiztrc.js` flag, the settings from the specified configuration file will\nbe used for image processing.\n\nWhen running normally, without the `--config` flag, a recursive search for the `.optimiztrc.js` file will be performed\nstarting from the current directory and up to the root of the file system. If the file is not found, the default\nsettings will be applied.\n\n## Integrations\n\n### External Tool in WebStorm, PhpStorm, etc\n\n\u003cdetails\u003e\n\n#### Add an External Tool\n\nOpen _Preferences → Tools → External Tools_ and add a new tool with these options:\n\n- Program: path to the exec file (usually simply `optimizt`)\n- Arguments: desired ones, but use `$FilePath$` to pass Optimizt the path of the selected file or directory\n- Working Directory: `$ContentRoot$`\n- Synchronize files after execution: ✔️\n\nSet other options at your discretion. For example:\n\n![](images/ws_external-tools.png)\n\nAs you see on the screenshot above, you may add several “external tools” with the different options passed.\n\n#### How to use\n\nRun the tool through the context menu on a file or directory:\n\n\u003cimg src=\"images/ws_menu.png\" width=\"55%\"\u003e\n\n#### Shortcuts\n\nTo add shortcuts for the added tool go to _Preferences → Keymap → External Tools_:\n\n![](images/ws_keymap.png)\n\n\u003c/details\u003e\n\n### Tasks in Visual Studio Code\n\n\u003cdetails\u003e\n\n#### Add Task\n\nRun `\u003eTasks: Open User Tasks` from the _Command Palette_.\n\nIn an open file, add new tasks to the `tasks` array, for example:\n\n```javascript\n{\n  // See https://go.microsoft.com/fwlink/?LinkId=733558\n  // for the documentation about the tasks.json format\n  \"version\": \"2.0.0\",\n  \"tasks\": [\n    {\n      \"label\": \"optimizt: Optimize Image\",\n      \"type\": \"shell\",\n      \"command\": \"optimizt\",\n      \"args\": [\n        \"--verbose\",\n        {\n          \"value\": \"${file}\",\n          \"quoting\": \"strong\"\n        }\n      ],\n      \"presentation\": {\n        \"echo\": false,\n        \"showReuseMessage\": false,\n        \"clear\": true\n      }\n    },\n    {\n      \"label\": \"optimizt: Optimize Image (lossless)\",\n      \"type\": \"shell\",\n      \"command\": \"optimizt\",\n      \"args\": [\n        \"--lossless\",\n        \"--verbose\",\n        {\n          \"value\": \"${file}\",\n          \"quoting\": \"strong\"\n        }\n      ],\n      \"presentation\": {\n        \"echo\": false,\n        \"showReuseMessage\": false,\n        \"clear\": true\n      }\n    },\n    {\n      \"label\": \"optimizt: Create WebP\",\n      \"type\": \"shell\",\n      \"command\": \"optimizt\",\n      \"args\": [\n        \"--webp\",\n        \"--verbose\",\n        {\n          \"value\": \"${file}\",\n          \"quoting\": \"strong\"\n        }\n      ],\n      \"presentation\": {\n        \"echo\": false,\n        \"showReuseMessage\": false,\n        \"clear\": true\n      }\n    },\n    {\n      \"label\": \"optimizt: Create WebP (lossless)\",\n      \"type\": \"shell\",\n      \"command\": \"optimizt\",\n      \"args\": [\n        \"--webp\",\n        \"--lossless\",\n        \"--verbose\",\n        {\n          \"value\": \"${file}\",\n          \"quoting\": \"strong\"\n        }\n      ],\n      \"presentation\": {\n        \"echo\": false,\n        \"showReuseMessage\": false,\n        \"clear\": true\n      }\n    }\n  ]\n}\n```\n\n#### How to use\n\n1. Open the file for processing using Optimizt, it should be in the active tab.\n2. Run `\u003eTasks: Run Task` from the _Command Palette_.\n3. Select the required task.\n\n#### Shortcuts\n\nYou can add shortcuts for a specific task by run `\u003ePreferences: Open Keyboard Shortcuts (JSON)` from the _Command Palette_.\n\nAn example of adding a hotkey to run the \"optimizt: Optimize Image (lossless)\" task:\n\n```javascript\n// Place your key bindings in this file to override the defaults\n[\n  {\n    \"key\": \"ctrl+l\",\n    \"command\": \"workbench.action.tasks.runTask\",\n    \"args\": \"optimizt: Optimize Image (lossless)\"\n  }\n]\n```\n\n\u003c/details\u003e\n\n### Plugin for Sublime Text 3\n\n\u003cdetails\u003e\n\nYou’ll find the user settings directory in one of the following paths:\n\n- macOS: `~/Library/Application Support/Sublime Text 3/Packages/User`\n- Linux: `~/.config/sublime-text-3/Packages/User`\n- Windows: `%APPDATA%\\Sublime Text 3\\Packages\\User`\n\n#### Add plugin\n\nInside the settings directory create a file `optimizt.py` with the following content:\n\n```python\nimport os\nimport sublime\nimport sublime_plugin\n\noptimizt = \"~/.nodenv/shims/optimizt\"\n\nclass OptimiztCommand(sublime_plugin.WindowCommand):\n  def run(self, paths=[], options=\"\"):\n    if len(paths) \u003c 1:\n      return\n\n    safe_paths = [\"\\\"\" + i + \"\\\"\" for i in paths]\n    shell_cmd = optimizt + \" \" + options + \" \" + \" \".join(safe_paths)\n    cwd = os.path.dirname(paths[0])\n\n    self.window.run_command(\"exec\", {\n      \"shell_cmd\": shell_cmd,\n      \"working_dir\": cwd\n    })\n```\n\nSpecify path to executable inside `optimizt` variable, this path can be obtained by running\n`command -v optimizt` (on *nix) or `where optimizt` (on Windows).\n\n#### Integrate the plugin into the sidebar context menu\n\nInside the settings directory create a file `Side Bar.sublime-menu` with the following content:\n\n```json\n[\n    {\n        \"caption\": \"Optimizt\",\n        \"children\": [\n          {\n              \"caption\": \"Optimize Images\",\n              \"command\": \"optimizt\",\n              \"args\": {\n                \"paths\": [],\n                \"options\": \"--verbose\"\n              }\n          },\n          {\n              \"caption\": \"Optimize Images (lossless)\",\n              \"command\": \"optimizt\",\n              \"args\": {\n                \"paths\": [],\n                \"options\": \"--lossless --verbose\"\n              }\n          },\n          {\n              \"caption\": \"Create WebP\",\n              \"command\": \"optimizt\",\n              \"args\": {\n                \"paths\": [],\n                \"options\": \"--webp --verbose\"\n              }\n          },\n          {\n              \"caption\": \"Create WebP (lossless)\",\n              \"command\": \"optimizt\",\n              \"args\": {\n                \"paths\": [],\n                \"options\": \"--webp --lossless --verbose\"\n              }\n          }\n        ]\n    }\n]\n```\n\n#### How to use\n\nRun the tool through the context menu on a file or directory:\n\n\u003cimg src=\"images/st_sidebar_menu.png\" width=\"55%\"\u003e\n\n\u003c/details\u003e\n\n### Workflow for GitHub Actions\n\n\u003cdetails\u003e\n\nCreate `optimizt.yml` file in the `.github/workflows` directory of your repository.\n\nInsert the following code into `optimizt.yml`:\n\n```yml\nname: optimizt\n\non:\n  # Triggers the workflow on push events but only for the “main” branch\n  # and only when there's JPEG/PNG in the commmit\n  push:\n    branches:\n      - main\n    paths:\n      - \"**.jpe?g\"\n      - \"**.png\"\n\n  # Allows you to run this workflow manually from the Actions tab\n  workflow_dispatch:\n\njobs:\n  convert:\n    runs-on: ubuntu-latest\n\n    steps:\n      # Install Node.js to avoid EACCESS errors upon install packages\n      - uses: actions/setup-node@v2\n        with:\n          node-version: 14\n\n      - name: Install Optimizt\n        run: npm install --global @funboxteam/optimizt\n\n      - uses: actions/checkout@v2\n        with:\n          persist-credentials: false # otherwise, the token used is the GITHUB_TOKEN, instead of your personal token\n          fetch-depth: 0 # get all commits (only the last one fetched by default)\n\n      - name: Run Optimizt\n        run: optimizt --verbose --force --avif --webp .\n\n      - name: Commit changes\n        run: |\n          git add -A\n          git config --local user.email \"actions@github.com\"\n          git config --local user.name \"github-actions[bot]\"\n          git diff --quiet \u0026\u0026 git diff --staged --quiet \\\n            || git commit -am \"Create WebP \u0026 AVIF versions\"\n\n      - name: Push changes\n        uses: ad-m/github-push-action@master\n        with:\n          github_token: ${{ secrets.GITHUB_TOKEN }}\n          branch: ${{ github.ref }}\n```\n\nThis workflow will find all JPEG and PNG files in pushed commits and add the AVIF and WebP versions via a new commit.\n\nMore examples you can find in the [workflows](./workflows) directory.\n\n\u003c/details\u003e\n\n## Troubleshooting\n\n### “spawn guetzli ENOENT”, etc\n\nMake sure that the [ignore-scripts](https://docs.npmjs.com/cli/v6/using-npm/config#ignore-scripts) option is not active.\n\nSee [#9](https://github.com/funbox/optimizt/issues/9).\n\n### “pkg-config: command not found”, “fatal error: 'png.h' file not found”, etc\n\nSome operating systems may lack of required libraries and utils, so you need to install them.\n\nExample (on macOS via [Homebrew](https://brew.sh)):\n\n```bash\nbrew install pkg-config libpng\n```\n\n## Docker\n\n### Pull by name\n\n```bash\ndocker pull funbox/optimizt\n```\n\n### Pull by name and version\n\n```bash\ndocker pull funbox/optimizt:5.0.1\n```\n\n### Build the image\n\nIf you want to manually build the Docker image, you need to:\n\n1. Clone this repo and `cd` into it.\n2. Run `docker build -t funbox/optimizt .`.\n\nOR:\n\n- Run `docker build -t funbox/optimizt https://github.com/funbox/optimizt.git`, but keep in mind that the\n[.dockerignore](.dockerignore) file will be [ignored](https://github.com/docker/cli/issues/2827).\n\n### Run the container\n\nInside the container WORKDIR is set to `/src`, so by default all paths will be resolved relative to it.\n\nUsage example:\n\n```bash\ndocker run -v $(pwd):/src funbox/optimizt --webp image.png\n```\n\n## Credits\n\nCute picture for the project was made by [Igor Garybaldi](http://pandabanda.com/).\n\n[![Sponsored by FunBox](https://funbox.ru/badges/sponsored_by_funbox_centered.svg)](https://funbox.ru)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffunbox%2Foptimizt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffunbox%2Foptimizt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffunbox%2Foptimizt/lists"}