Image Optimization using NextJs

1. Using local images

Picture of the author

2. Remote Images (without onload blur)

Picture of the author

3. Remote Images (with onload bluring)

Picture of the authorPicture of the authorPicture of the authorPicture of the authorPicture of the author

4. Remote Images (Responsive layout type)

Picture of the author

5. Local Images (Quality of the images [1-100])

Image with the quality set to its lowest (1)

Picture of the author

Image with the quality set to its maximum (100)

Picture of the author

6. Remote Images (onLoadComplete)

Picture of the author