https://github.com/msaaddev/nextjs-conf-demo

A demo website I created for Next.js Conf 2021
https://github.com/msaaddev/nextjs-conf-demo

Last synced: 30 days ago
JSON representation

A demo website I created for Next.js Conf 2021

• Host: GitHub
• URL: https://github.com/msaaddev/nextjs-conf-demo
• Owner: msaaddev
• Created: 2021-10-13T11:15:56.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2021-10-26T19:11:50.000Z (over 4 years ago)
• Last Synced: 2025-05-22T22:44:00.090Z (about 1 year ago)
• Language: JavaScript
• Homepage: https://nextjs-conf-demo.vercel.app
• Size: 191 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: changelog.md
  • Contributing: contributing.md
  • License: LICENSE
  • Code of conduct: CODE-OF-CONDUCT.md

Awesome Lists containing this project

README

          
![cover](assets/cover.jpeg)



 
⚡️ Let's Talk about Image Optimization with Next.js



 
Next.js Conf 2021



### 🎩 Talk Overview

Because of their size, images are the largest assets of your website. As the size increases, the speed of your web app decreases along with it. According to the HTTP Archive, images make up on average 21% of a total webpage weight. Different image formats also affect your site’s overall performance. In this talk, I am going to speak about how Next.js natively helps you optimize your images. How it provides a built-in solution with its Image component that uses various techniques to make sure your site is fast, consumes less bandwidth, and at the same time has a great user experience.

![separator](assets/separate.jpg)

### 🚀 Purpose

Following are the reasons why I created this demo:

- Explain the issues associated with `` tag and show it live

- Explain the working of `` component of Next.js

- Showcase some of the pros of `` component over `` tag

## ⚡️ Other Projects

I have curated a [detailed list](https://github.com/msaaddev/open-source) of all the open-source projects I have authored. Do take out a moment and take a look.

## 🔑 License & Conduct

- MIT © [Saad Irfan](https://github.com/msaaddev)

- [Code of Conduct](https://github.com/msaaddev/nextjs-conf-demo/blob/main/CODE-OF-CONDUCT.md)