Automattic / Automattic/jetpack

Photon: Images larger than 6000px set to full-width+full size appear blurry with Photon enabled

Open
#24,867 7 comments 0 reactions 0 assignees View on GitHub
[Feature] Photon [Pri] Normal Bug Customer Report [LEGACY] Triaged
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

### Quick summary

A very large image is added 6000px width+

![SITE-CRH-Banniere-paysage-2-1 (1)](https://user-images.githubusercontent.com/13706336/162740190-96cb6ed8-a940-4484-9330-fb265ae9620e.png)

It's then added as an image block to a page.

The block is then set to full width and the image becomes blurred and loses all it's cripness
![Markup on 2022-04-11 at 13:34:49](https://user-images.githubusercontent.com/13706336/162740341-83597138-eacc-44ba-b3c5-36533f463cf9.png)

### Steps to reproduce

A very large image is added 6000px width+

![SITE-CRH-Banniere-paysage-2-1 (1)](https://user-images.githubusercontent.com/13706336/162740190-96cb6ed8-a940-4484-9330-fb265ae9620e.png)

It's then added as an image block to a page.

The block is then set to full width and the image becomes blurred and loses all it's cripness
![Markup on 2022-04-11 at 13:34:49](https://user-images.githubusercontent.com/13706336/162740341-83597138-eacc-44ba-b3c5-36533f463cf9.png)

### What you expected to happen

The image to remain sharp

### What actually happened

It's blurred

### Context

* Tried to compress the image and reupload it at 2000 width. It still blurred.
* Theme: Shoreditch.
* Tried on a test site with Shoreditch and it does the same.
* Changed theme to a blockbase one. Also blurred
* Tried turning off jetpack image settings. No change
* 4935720-zd

### Simple, Atomic or both?

Atomic

### Theme-specific issue?

_No response_

### Browser, operating system and other notes

_No response_

### Reproducibility

Consistent

### Severity

Some (< 50%)

### Available workarounds?

No but the platform is still usable

### Workaround details

_No response_

Contributor guide

Open the contributing guide

Research direction

The issue names no file, test, or entry point. First reproduce the problem with a 6000px-plus image in a WordPress image block using Photon and full-width/full-size settings, then trace the generated image and rendering path; done means the image remains sharp without breaking the documented reproduction case.

Written by the indexing model from the issue text.

Assessment

Tech stack
php, wordpress
Domain
frontend, performance
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.