Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

perf(gatsby-plugin-image): downsize image before extracting dominant color #35814

Merged
merged 2 commits into from
Jun 2, 2022

Conversation

ascorbic
Copy link
Contributor

@ascorbic ascorbic commented Jun 1, 2022

Description

Downsize the input image before calculating the dominant color

Documentation

When calculating the dominant color for the default image placeholder, we use sharp's stats() function. sharp uses the input image for its calculations, which gives the most accurate result, but can be very slow to calculate for large images. This PR instead resizes the image to the default blurred placeholder size, and uses that to calculate the dominant color. This may be a less accurate respresentation, but it is Good Enough for a placeholder that is only seen for a second or so at most.

In my tests running on an M1 mac mini, on a selection of source images around 10MP in size, this took around 40% of the time as the status quo.

Related Issues

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Jun 1, 2022
@LekoArts LekoArts added topic: media Related to gatsby-plugin-image, or general image/media processing topics topic: performance Related to runtime & build performance and removed status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer labels Jun 1, 2022
Copy link
Contributor

@wardpeet wardpeet left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks LGTM!

@LekoArts LekoArts merged commit 5e6c808 into gatsbyjs:master Jun 2, 2022
@ascorbic ascorbic deleted the mk/resize-dominant branch June 2, 2022 08:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
topic: media Related to gatsby-plugin-image, or general image/media processing topics topic: performance Related to runtime & build performance
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants