Introduction: Next Js is React Js framework with lots of amazing features. Here is an update on the latest release of Next Js 10.
If you are an active React JS developer then you must have heard about Next Js. It is React Js framework for building SEO friendly modern web applications.
Next Js was a very popular framework for server-side rendering but now it is one of the most popular static site generators with great SEO benefits.
It is under active development and supported by a large community. Thanks to this now we have a major release of Next Js version 10.
Next Js version 10 Features
Prior to version 10, we have a head, amp, dynamic and few more components provided by Next Js for use.
Next Js version 10 contains Image component which has amazing features which will automatically help you to improve your lighthouse (google speed insights) score.
Google announced that it is going to add core web vitals as ranking signal. So image optimization will now be important part of SEO optimization.
Here are a few features of Images component which makes it unique and better than other static generators plugins.
- Automatic WebP conversion for better quality images in a smaller size.
- Automatic image resizing
- Reduce the quality of images implicitly.
- Width and height support
- Lazy loading images
Next Js Analytics
You cannot fix what you don't know.
The above line is the foundation of web development. Data is a very important part of the decision making for development.
Next Js 10 allows you to track real-world performance metrics of your application.
Now you can work on internationalization in Next Js without any external dependency.
Next Js is now supporting both translation and routing features which you can use to create localized web pages. Researches show that peoples tend to spend more time on their native languages. It can help to increase sales and revenue of websites.
Few more Notable updates for Next Js version 10.
- Font optimizations for webpack 5.
- Feature to return 404 from getStaticProps
- Support for Cloudinary and Akami image optimizations if you don't want to use default optimizations.
- React Js 17 Support