Yenilikler

Faster Builds
Middleware
React 18, Server Component
URL Imports
Bot Aware ISR Fallback, AVIF Format

Faster Builds

Yeni javascript compiler (SWC)
Daha hızlı refresh, local development ortamında 3 kat daha hızlı çalışacak.
5 kat daha fazla build süresi, bu sayede büyük codebase a sahip projeler daha hızlı yayınlanabilecek.

module.exports = {
  swcMinify: true
}

Middleware

Next 12 ile birlikte kolay bir şekilde middleware kullanabileceğiz.

// pages/_middleware.js

export function middleware(req, ev) {
  return new Response('Hello, world!')
}

React 18, Server Component

React.lazy
startTransition
Server Component
And More..

Next 12 ile birlikte, react 18 ile gelen yeni özellikleri deneyimleyebileceğiz.

// npm install react@alpha react-dom@alpha


// next.config.js
module.exports = {
  experimental: {
    concurrentFeatures: true
  }
}

// next.config.js
module.exports = {
  experimental: {
    concurrentFeatures: true,
    serverComponents: true
  }
}

URL Imports

Url imports sayesinde cdn üzerinden paketler import ederek esnek ve farklı senaryolar için kurgulayabiliriz

module.exports = {
  experimental: {
    urlImports: ['https://cdn.skypack.dev']
  }
}

import confetti from 'https://cdn.skypack.dev/canvas-confetti'

Bot Aware ISR Fallback, AVIF Format

ISR Fallback sayesinde web crawlerlar için veriler otomatik oluşturularak crawlerları loading state sokmamış oluyoruz, AVIF formatı sayesinde webp ye kıyasla %20 daha küçük görseller kullabileceğiz

module.exports = {
  images: {
    formats: ['image/avif', 'image/webp']
  }
}

nextjs_12

By Koray Güler