feat: add avif support #28
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,10 +1,12 @@ | ||
| import { Converter } from './converter-abstract' | ||
| import { encode as encodeAvif } from '@jsquash/avif' | ||
|
|
||
| // Supported output formats | ||
| const supportedFormats = [ | ||
| { value: 'webp', mimeType: 'image/webp' }, | ||
| { value: 'jpg', mimeType: 'image/jpeg' }, | ||
| { value: 'png', mimeType: 'image/png' }, | ||
| { value: 'avif', mimeType: 'image/avif' }, | ||
| ] | ||
|
|
||
| /** | ||
|
|
@@ -19,6 +21,7 @@ class ImageConverter extends Converter { | |
| 'image/png', | ||
| 'image/webp', | ||
| 'image/jpg', | ||
| 'image/avif', | ||
| ] | ||
| } | ||
|
|
||
|
|
@@ -171,24 +174,36 @@ class ImageConverter extends Converter { | |
|
|
||
| const format = supportedFormats.find( f => f.value === outputFormat ) | ||
| // Only use quality for lossy formats | ||
| const q = ( outputFormat === 'webp' || outputFormat === 'jpg' || outputFormat === 'avif' ) ? quality : undefined | ||
|
|
||
| if ( outputFormat === 'avif' ) { | ||
| try { | ||
| const imageData = ctx.getImageData( 0, 0, width, height ) | ||
| const avifQuality = Math.max( 1, Math.min( 100, Math.round( ( ( q ?? 0.5 ) * 100 ) ) ) ) | ||
| const avifBuffer = await encodeAvif( imageData, { quality: avifQuality } ) | ||
|
There was a problem hiding this comment. 🧩 Analysis chain🌐 Web query:
💡 Result:
Practical mapping (if you have a 0–100 “quality” and want a // quality: 0..100 where 100 ~= best
const cqLevel = Math.round((100 - quality) * 63 / 100);(This mapping is approximate; different encoders/settings can shift results.) Sources: [1] Fix AVIF quality parameter: replace
Map quality (0–1) to 🤖 Prompt for AI Agents
Contributor
Author
There was a problem hiding this comment. https://github.com/jamsinclair/jSquash/blob/main/packages/avif/codec/enc/avif_enc.d.ts#L7 @jsquash/avif's encode has a quality parameter There was a problem hiding this comment.
|
||
| const avifBlob = new Blob( [ avifBuffer ], { type: 'image/avif' } ) | ||
| resolve( avifBlob ) | ||
| } catch ( e ) { | ||
| reject( new Error( `Failed to encode AVIF: ${ e instanceof Error ? e.message : 'Unknown error' }` ) ) | ||
| } | ||
|
There was a problem hiding this comment. Resource leak: AVIF path skips The non-AVIF branch (lines 192-199) revokes the object URL and zeros the canvas to free memory, but the AVIF branch resolves/rejects without doing either. This leaks the blob URL and keeps the canvas buffer alive. Proposed fix if ( outputFormat === 'avif' ) {
try {
const imageData = ctx.getImageData( 0, 0, width, height )
const avifQuality = Math.max( 1, Math.min( 100, Math.round( ( ( q ?? 0.5 ) * 100 ) ) ) )
const avifBuffer = await encodeAvif( imageData, { quality: avifQuality } )
const avifBlob = new Blob( [ avifBuffer ], { type: 'image/avif' } )
+ // Clean up resources
+ URL.revokeObjectURL( objectUrl )
+ objectUrl = null
+ ctx.clearRect( 0, 0, canvas.width, canvas.height )
+ canvas.width = 0
+ canvas.height = 0
resolve( avifBlob )
} catch ( e ) {
+ URL.revokeObjectURL( objectUrl )
+ objectUrl = null
reject( new Error( `Failed to encode AVIF: ${ e instanceof Error ? e.message : 'Unknown error' }` ) )
}🤖 Prompt for AI Agents |
||
| } else { | ||
| canvas.toBlob( function( blob ) { | ||
| // Clean up resources | ||
| URL.revokeObjectURL( objectUrl ) | ||
| objectUrl = null | ||
|
|
||
| // Clear canvas to free memory | ||
| ctx.clearRect( 0, 0, canvas.width, canvas.height ) | ||
| canvas.width = 0 | ||
| canvas.height = 0 | ||
|
|
||
| if ( blob ) { | ||
| resolve( blob ) | ||
| } else { | ||
| reject( new Error( 'Failed to convert image' ) ) | ||
| } | ||
| }, format.mimeType, q ) | ||
| } | ||
| } | ||
|
|
||
| img.onerror = () => { | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Restrict
image_output_formatto an allowlist of valid values.Currently the schema has no
enumconstraint and the sanitizer only callssanitize_text_field, meaning any arbitrary string (including malicious input) can be persisted. Since only'webp'and'avif'are valid, add validation at both layers:Proposed fix
In the REST schema (around line 59):
'image_output_format' => [ 'type' => 'string', + 'enum' => [ 'webp', 'avif' ], ],In
sanitize_options(around line 225):if ( isset( $options['image_output_format'] ) ) { - $sanitized['image_output_format'] = sanitize_text_field( $options['image_output_format'] ); + $format = sanitize_text_field( $options['image_output_format'] ); + $sanitized['image_output_format'] = in_array( $format, [ 'webp', 'avif' ], true ) ? $format : 'webp'; }Also applies to: 224-227
🤖 Prompt for AI Agents