Seperti yang kita ketahui, Next.JS baru saja mengeluarkan versi terbarunya yakni Next.JS 13 yang tentunya membawa perubahan - perubahan baru pada framework mereka dan tentunya memberikan berita baik kepada seluruh pengguna. .
Next.JS merupakan salah satu framework berbasis javascript yang sangat populer dan kini banyak digunakan untuk membuat sebuah website. Optimasi dan fiturnya yang melimpah membuat framework ini kian digunakan oleh banyak perusahaan besar. .&nbsp;
Next.JS sendiri merupakan framework yang dibuat khusus untuk React.JS, karena Next.JS sendiri bisa dibilang adalah framework penyempurna React.JS yang tentunya juga sudah kita ketahui bahwa memang React.JS masih memiliki kekurangan, terutama pada bagian rendering. .&nbsp;
Kemudahan yang diberikan oleh Next.JS lah yang kemudian menjadi daya tarik dari berbagai perusahaan besar untuk menggunakan framework satu ini. Tentu, reliabilitasnya juga sangat tinggi dan sudah production ready sehingga memudahkan pekerjaan kita ketika menggunakan framework satu ini.
. .&nbsp;
Lalu, apa saja yang baru pada Next.JS 13 ini? Berdasarkan dari Next.JS Conf sepekan lalu, Next.JS 13 memiliki perubahan - perubahan menarik, berikut adalah beberapa perubahannya. . .&nbsp;&nbsp;
.&nbsp;&nbsp;
<h2>app/ Directory (beta)</h2>
.&nbsp;&nbsp;
Sebuah fitur yang akan sangat membantu kamu membuat sebuah file di dalam project kamu dan kemudian Next.JS akan secara otomatis membuat routing-nya berdasarkan dari apa yang kamu buat, merupakan salah satu fitur yang sudah disajikan oleh Next.JS sendiri. .&nbsp;&nbsp;
Namun pada Next.JS 13 ini, mereka memberikan improve terhadap bagaimana routing dan layouting-nya bekerja pada Next.JS dengan kehadiran app/ Directory (beta). Pada routing baru ini, ada beberapa support yang kemudian dimasukkan, yakni:
.&nbsp;&nbsp;
<h2 style="margin-left:36pt;">Layouts</h2>
.&nbsp;&nbsp;
Kita bisa membagikan UI kita antar routes dengan tetap mempertahankan state-nya dan menghindari render ulang yang memperlambat render kita. .&nbsp;&nbsp;
<h2 style="margin-left:36pt;">Server Components</h2>
.&nbsp;&nbsp;
Tentunya Next.JS akan membuat Server-first secara default, maksudnya adalah ketika kita membuat sebuah komponen didalam direktori app pada framework ini, ia akan secara otomatis merupakan React Server Components. Tentunya ini akan mengurangi beban dan akan mempercepat load pada page kita, dan tentunya ini akan sangat membantu. .&nbsp;&nbsp;
.&nbsp;&nbsp;
<h2 style="margin-left:36pt;">Streaming and Data Fetching</h2>
.&nbsp;&nbsp;
Pada Next.JS 13 ini, tentunya kita akan lebih mudah untuk menampilkan beberapa bagian UI pada client kita dengan menggunakan React Suspense. Sebagai contoh, ketika kita sedang menunggu fetching data hingga selesai, kita bisa menampilkan loading state selayaknya loading pada umumnya. Dan ketika fetching data selesai, maka informasi baru akan dilempar dan ditampilkan pada page kita yang sebelumnya masih menampilkan loading state. .&nbsp;&nbsp;
<h2>next/image Improvements</h2>
.&nbsp;&nbsp;
next/image juga mendapat pembaharuan pada komponennya, kini komponen image pada Next.JS membutuhkan lebih sedikit resource pada bagian client-nya. Dan pada perubahan ini, tag alt secara default diperlukan, sehingga ketika kamu tidak menggunakannya akan muncul warning, walaupun kamu bisa mengisinya dengan string kosong. Dan sama hal-nya seperti pada bagian width dan height pada non-static image, kamu sekarang perlu untuk mengaturnya juga. .&nbsp;&nbsp;
<h2>@next/font</h2>
.&nbsp;&nbsp;
Merupakan salah satu package yang memberikan kemudahan pada penggunanya. Bagaimana tidak? Package ini memberikan akses terhadap font yang telah disediakan oleh Google Fonts dan kita tidak perlu mengirimkan request dari browser. CSS dan file font-nya akan diunduh pada waktu build berikut dengan static assets lainnya. Tentu ini akan mempermudah pekerjaan kita ketika sedang dalam kondisi development. .&nbsp;&nbsp;
.&nbsp;&nbsp;
<h2>next/link Improvements</h2>
.&nbsp;&nbsp;
Ketika kita akan menggunakan komponen Link, sekarang kita tidak perlu lagi memasukkan atau menggunakan tag &lt;a&gt; ketika menggunakan next/link. Tentu, ini juga akan mempermudah kita ketika menggunakan komponen tersebut.&nbsp;

Seperti yang kita ketahui, Next.JS baru saja mengeluarkan versi terbarunya yakni Next.JS 13 yang tentunya membawa perubahan - perubahan baru pada framework mereka dan tentunya memberikan berita baik kepada seluruh pengguna

Apa Yang Baru Pada Next.JS 13?