feat: allow per-format quality settings
Hey!
I added a feature that lets you pass an object to the quality prop instead of just a single number.
Why?
Different formats handle compression differently. For example, AVIF usually looks great at quality 50, while WebP might need 80 to achieve the same visual fidelity. This update lets us micro-optimize those settings to save bandwidth without hurting the visuals on legacy formats.
Usage
You can now do this:
export default defineNuxtConfig({
image: {
format: ["avif", "webp"],
quality: {
avif: 50,
default: 80
}
}
It is fully backward compatible. Passing a single number still works exactly like before.
Let me know if you need any changes!
Codecov Report
:x: Patch coverage is 0% with 13 lines in your changes missing coverage. Please review.
:white_check_mark: Project coverage is 6.97%. Comparing base (ab652ab) to head (a63a4bf).
| Files with missing lines | Patch % | Lines |
|---|---|---|
| src/runtime/image.ts | 0.00% | 12 Missing :warning: |
| src/runtime/utils/props.ts | 0.00% | 1 Missing :warning: |
Additional details and impacted files
@@ Coverage Diff @@
## main #2037 +/- ##
========================================
- Coverage 6.99% 6.97% -0.03%
========================================
Files 78 78
Lines 3629 3641 +12
Branches 140 140
========================================
Hits 254 254
- Misses 3326 3338 +12
Partials 49 49
:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.
:rocket: New features to boost your workflow:
- :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
- :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.