GoogleChromeLabs/squoosh

Inspect EXIF data for rotation - Image orientation/rotation is wrong for some images

Open

#299 opened on Nov 15, 2018

View on GitHub
 (36 comments) (3 reactions) (0 assignees)TypeScript (20,335 stars) (1,431 forks)batch import
UIfeature requesthelp wanted

Description

I tried compressing a photo taken with my Samsung Galaxy S8 (in portrait orientation) but the image shows up in wrong orientation (rotated 90 degrees) in https://squoosh.app/ and there also didn't seem to be any option to rotate the image.

The photo shows in correct orientation if I view it e.g. in image preview of macOS Finder. If I save the compressed image from squoosh then it will show up in wrong orientation also in other apps.

I suspect the issue is that squoosh doesn't take into account the EXIF Orientation information in the photo.

Here's the photo I had the issue with: test

(Ps. looks like the image also appears in wrong orientation in this GitHub issue using Chrome at least, but if I click on it so that it opens in a new tab then it is shown in the correct orientation. It should be shown so that the text is oriented horizontally [easily readable].)

If I check the EXIF data of the image (with e.g. exiftool) I can see it has the correct orientation info:

$ exiftool test.jpg | grep Orientation
Orientation                     : Rotate 90 CW

Or checking with identify (from ImageMagick):

$ identify -verbose test.jpg | grep Orientation
  Orientation: RightTop
    exif:Orientation: 6
    exif:thumbnail:Orientation: 6

Contributor guide

Tech stack
typescriptjavascripthtmlcssnodejs
Domain
frontendperformance
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Basic understanding of EXIF dataFamiliarity with image orientationJavaScript/TypeScript
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
60
Research direction
Investigate the EXIF orientation handling in Squoosh's image processing pipeline. Look at how images are loaded and displayed, particularly in the src/lib/ or src/codecs/ directories. Check if there is existing EXIF parsing (e.g., using exif js or similar) and whether orientation is applied during compression or display. The goal is to apply the EXIF rotation before compression so that the output image has correct orientation. Refer to the linked EXIF orientation page for the orientation values.