madebywild / wild-next

Our next.js boilerplate with sane base configuration.
MIT License
119 stars 16 forks source link

Should we include next/image by default? #38

Closed r0skar closed 1 year ago

r0skar commented 3 years ago

https://nextjs.org/docs/api-reference/next/image

If so, does it make sense to also create a tiny styled-component wrapper around it?

edoardolunardi commented 3 years ago

What would be the benefit of using that? Does it add something more that we don't achieve use with react-imgix + a lazy lib?

r0skar commented 3 years ago

Yeah it basically is a lazy image component, but it enables all kind of image optimizations (even for remote images!). Its very similar to gatsby-image; you can read the docs for all features.

Its not so much a question if we want to use it (we do!), but if we also want to include it in the boilerplate? I guess it kinda makes sense, because I don't see us ever developing a website that doesn't need at least one image :thinking:

edoardolunardi commented 3 years ago

Yeah let's try it, I'm a bit curious. Tbh, I still have to find a very complete solution that combines really well image opt + lazy loading (in a reactish way) to the point that I was thinking of writing a npm package by myself. Let's see how much flexible this will be

bs1180 commented 3 years ago

At the moment the new next/image component doesn't work if you export a static site - I had hoped it could help replace gatsby-image, but that's not possible, you still need the correct server side support. But if we're using next, using the image component seems worthwhile.

r0skar commented 3 years ago

We will not include it by default for now, but it is highly recommended we use it whenever it makes sense (iE if we dont need to create a static export or if we are using an external loader: https://github.com/vercel/next.js/blob/master/errors/export-image-api.md).

r0skar commented 3 years ago

Lets re-open this and see if things have changed in regards to static builds. Also check if the issue can be resolved by using an external loader (imgIX), but note that ideally we want to use external images as well as internal ones (iE in the public folder).

r0skar commented 1 year ago

Still not ready for primetime.