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

Image optimisation #29

Open
ollynevard opened this issue May 13, 2020 · 0 comments
Open

Image optimisation #29

ollynevard opened this issue May 13, 2020 · 0 comments
Assignees
Labels
enhancement New feature or request performance Improvements to web site performance

Comments

@ollynevard
Copy link
Owner

  • Resize large images to the size needed by the design.
  • Generate multiple smaller images so smartphones and tablets don’t download desktop-sized images.
  • Strip all unnecessary metadata and optimize JPEG and PNG compression.
  • Efficiently lazy load images to speed initial page load and save bandwidth.
  • Use the “blur-up” technique or a ”traced placeholder” SVG to show a preview of the image while it loads.
  • Hold the image position so your page doesn’t jump while images load.

https://www.gatsbyjs.org/packages/gatsby-image/

@ollynevard ollynevard added the enhancement New feature or request label May 13, 2020
@ollynevard ollynevard added this to the Initial Release milestone May 13, 2020
@ollynevard ollynevard self-assigned this May 13, 2020
@ollynevard ollynevard added the performance Improvements to web site performance label May 13, 2020
@ollynevard ollynevard added this to To do in Initial Release May 13, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request performance Improvements to web site performance
Projects
Development

No branches or pull requests

1 participant