loading...

Next 10 Released

shadowtime2000 profile image shadowtime2000 ・1 min read

Next.js 10 Has Been Released

Around 2 hours ago on the Next.js blog Next.js 10 was announced.

Features

  • A next/image component for image optimization
  • Internationalized routing
  • Next.js Analytics
  • Next.js Commerce (A starter kit for ecommerce sites)
  • React 17 Support
  • Importing CSS From Third Party Components
  • Automatic href resolution (next/link)
  • @next/codemod CLI improvements
  • Blocking Fallback for getStaticPaths

Image Optimization


import Image from "next/image";

<Image src="myImage.png" height="400" width="300" />
// instead of <img src="myImage.png" height="400" width="300" />
Enter fullscreen mode Exit fullscreen mode

This lazy loads the image and makes width and height work with responsive layouts.

Next.js Analytics

Go to nextjs.org/analytics to learn how to enable it.

React 17 Support

The new JSX compiler is automatically used, you just have to run this command:

$ npm install next@latest react@latest react-dom@latest
Enter fullscreen mode Exit fullscreen mode

Importing CSS From Third Party Components

You no longer have to import the CSS for third party components like this:

import DatePicker from 'react-datepicker'
import 'react-datepicker/dist/react-datepicker.css'
Enter fullscreen mode Exit fullscreen mode

You can just import the component.

Discussion

pic
Editor guide
Collapse
rajeshroyal profile image
Rajesh Royal

I'm loving its new Image component