Rilis Vue 3.5 "Tengen Toppa Gurren Lagann"

• Rilis minor kali ini mencakup peningkatan internal dan fitur baru yang berguna, tanpa perubahan yang merusak kompatibilitas

Optimasi sistem Reactivity

• Sistem reaktivitas Vue telah direfaktor secara besar-besaran untuk meningkatkan performa dan mengurangi penggunaan memori (-56%), tanpa perubahan perilaku
• Refaktor ini juga menyelesaikan masalah nilai terhitung dan memori selama SSR
• Di 3.5, pelacakan reaktivitas untuk array reaktif yang besar dan dalam dioptimalkan sehingga pada beberapa kasus bisa hingga 10x lebih cepat

Destructuring Props Reaktif

• Destructuring props reaktif telah distabilkan di 3.5 dan kini diaktifkan secara default
• Dalam <script setup>, variabel yang didestructure dari pemanggilan defineProps kini bersifat reaktif
• Fitur ini sangat menyederhanakan deklarasi props dengan nilai default dengan memanfaatkan sintaks nilai default bawaan JavaScript

Peningkatan SSR

Lazy Hydration

• Komponen asinkron kini dapat mengontrol waktu hidrasi dengan menentukan strategi melalui opsi hydrate pada API defineAsyncComponent()

useId()

• useId() adalah API yang dapat digunakan untuk menghasilkan ID unik per aplikasi yang dijamin stabil antara rendering server dan klien
• API ini dapat digunakan untuk membuat ID untuk elemen formulir dan atribut aksesibilitas, serta dapat dipakai di aplikasi SSR tanpa ketidaksesuaian hidrasi

data-allow-mismatch

• Jika nilai di klien memang tidak mungkin sama dengan nilai di server (misalnya tanggal), peringatan ketidaksesuaian hidrasi dapat ditekan dengan atribut data-allow-mismatch
• Anda juga dapat membatasi jenis ketidaksesuaian yang diizinkan dengan memberi nilai pada atribut tersebut (text, children, class, style, attribute)

Peningkatan custom element

• Versi 3.5 memperbaiki banyak masalah lama terkait API defineCustomElement() dan menambahkan beberapa fitur baru untuk menulis custom element dengan Vue
• Mendukung konfigurasi aplikasi untuk custom element melalui opsi configureApp
• Menambahkan API useHost(), useShadowRoot(), dan this.$host untuk mengakses host element dan shadow root dari custom element
• Mendukung pemasangan custom element tanpa Shadow DOM dengan meneruskan shadowRoot: false
• Mendukung penyediaan opsi nonce, yang akan dilampirkan ke tag <style> yang disuntikkan oleh custom element

Fitur penting lainnya

useTemplateRef()

• Versi 3.5 memperkenalkan cara baru untuk mendapatkan referensi template melalui API useTemplateRef()
• Sebelum 3.5, pendekatan yang direkomendasikan adalah menggunakan referensi biasa dengan nama variabel yang cocok dengan atribut ref statis
• Pendekatan sebelumnya terbatas pada atribut ref statis karena compiler harus bisa menganalisis atribut ref tersebut
• Sebagai perbandingan, useTemplateRef() mencocokkan referensi melalui ID string saat runtime, sehingga mendukung binding referensi dinamis untuk ID yang berubah

Teleport tertunda

• Salah satu keterbatasan yang sudah dikenal dari komponen bawaan <Teleport> adalah elemen target harus sudah ada saat komponen teleport dipasang
• Hal ini sebelumnya mencegah pengguna melakukan teleport konten ke elemen lain yang dirender oleh Vue
• Di 3.5, diperkenalkan prop defer untuk <Teleport> yang dipasang setelah siklus render saat ini, sehingga kini hal tersebut dapat dilakukan

onWatcherCleanup()

• Versi 3.5 memperkenalkan onWatcherCleanup() sebagai API impor global untuk mendaftarkan callback pembersihan di dalam watcher

[narusas]

Rilisan kali ini benar-benar sangat meningkatkan kemudahan saat mengembangkan komponen.

[xguru]

Nama versi kali ini adalah "Tengen Toppa Gurren Lagann" ya. (Memang mahakarya! Sepertinya ini yang terakhir dari karya Gainax yang saya tonton)

Vue secara tradisional? menggunakan judul manga/anime untuk penamaan. 1.0 adalah Evangelion, 2.0 adalah Ghost in the Shell, 3.0 adalah One Piece, 3.3 adalah Rurouni Kenshin, 3.4 adalah Slam Dunk
https://en.wikipedia.org/wiki/Vue.js#Versions