prezly / theme-nextjs-bea

News site built with NextJS, Typescript and Prezly SDK
https://theme-nextjs-bea-the-good-newsroom.vercel.app
MIT License
43 stars 11 forks source link

[CARE-3415] Feature - Use Uploadcare's image loader to optimize images #1135

Closed kudlajz closed 3 months ago

kudlajz commented 3 months ago

I've replaced usages of UploadcareImage from our custom library with Uploadcare's own Nextjs image loader which generates all the required srcset URLs for us automatically.

There has been a significant image size reductions in most areas, mainly the logo and homepage (story cards) but of course depends on how big the original images were. Places like contact cards should see a big benefit as those were previously rendered in an unnecessary large dimensions.

Since Uploadcare's image loader is using next/image under the hood, it also comes with automatic lazy loading so places like homepage load even faster on smaller screens since the browser doesn't have to fetch all of them at once.

vercel[bot] commented 3 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
theme-nextjs-bea-preview ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 7, 2024 10:05am
3 Ignored Deployments | Name | Status | Preview | Comments | Updated (UTC) | | :--- | :----- | :------ | :------- | :------ | | **theme-nextjs-bea-cookbook** | ⬜️ Ignored ([Inspect](https://vercel.com/prezly/theme-nextjs-bea-cookbook/7yBt3tdGxrvGSs6LDg6rN1S5sUPX)) | [Visit Preview](https://theme-nextjs-bea-cookbook-git-feature-care-3415-3ace46-prezly1.vercel.app) | | May 7, 2024 10:05am | | **theme-nextjs-bea-photography** | ⬜️ Ignored ([Inspect](https://vercel.com/prezly/theme-nextjs-bea-photography/EXnxxfTfZTRT6uitKVVD3sGj3Zh3)) | [Visit Preview](https://theme-nextjs-bea-photography-git-feature-care-34-c6d0fc-prezly1.vercel.app) | | May 7, 2024 10:05am | | **theme-nextjs-bea-the-good-newsroom** | ⬜️ Ignored ([Inspect](https://vercel.com/prezly/theme-nextjs-bea-the-good-newsroom/3PzGjcYTWmnf9TUpHaUvXK5bj2KV)) | [Visit Preview](https://theme-nextjs-bea-the-good-newsroom-git-feature-c-61f4ae-prezly1.vercel.app) | | May 7, 2024 10:05am |