Penjelasan Addy Osmani tentang Next.js App Router dan React Server Component

• Addy Osmani adalah bagian dari tim Google Chrome dan sangat memahami framework serta library, sampai terlibat dalam promosi proyek seperti TodoMVC dan HNPWA
• RSC?
  • Mengintegrasikan pengambilan data sebagai elemen penting dalam penyusunan pohon komponen, sehingga memungkinkan penantian di level teratas dan serialisasi data di sisi server
  • RSC adalah React Component stateless yang berjalan di server, dan memberikan pengalaman (knitting) yang memudahkan penggunaan ulang kode yang mudah dipelihara antara komponen server dan klien
  • Memungkinkan routing mirip SPA di atas arsitektur yang menyerupai MPA
  • Implementasi nyata (penyediaannya) akan berbeda menurut framework
  • Tim React menilai ini akan diadopsi luas dan memengaruhi ekosistem. Dan dari tim React mengibaratkan Server Component sebagai tulang punggung alur data aplikasi, sementara Client Component seperti daging yang membungkus tulang tersebut
• Bagaimana Next.js App Router dan Server Component saling terhubung?
  • Dukungan RSC tersedia sejak Next.js 13+
  • Komponen di dalam jalur app otomatis mendukung RSC
  • RSC memanfaatkan infrastruktur sisi server dan dependency untuk mendukung performa yang lebih baik serta ukuran bundle yang lebih kecil
  • Next.js App Router meningkatkan aplikasi secara bertahap dengan memadukan server-rendering dan client-rendering, sehingga pengalaman pengguna terasa alami. Client Component bisa digunakan dengan menandainya secara eksplisit (use client) dan dapat ditempatkan berselang-seling dalam pohon komponen yang sama
  • Sudah mulai muncul pengalaman positif dalam penggunaan Next.js App Router
• Ada juga berbagai topik terkait lainnya, jadi silakan dibaca.