6 पॉइंट द्वारा xguru 2024-09-06 | 3 टिप्पणियां | WhatsApp पर शेयर करें
  • इस माइनर रिलीज़ में आंतरिक सुधार और उपयोगी नए फीचर्स शामिल हैं, और compatibility तोड़ने वाले कोई बदलाव नहीं हैं

Reactivity सिस्टम ऑप्टिमाइज़ेशन

  • Vue के reactive सिस्टम को बड़े पैमाने पर refactor किया गया है, जिससे performance बेहतर हुई है और memory usage (-56%) कम हुआ है, जबकि व्यवहार में कोई बदलाव नहीं है
  • इस refactor से SSR के दौरान computed values और memory से जुड़ी समस्याएँ हल हुई हैं
  • 3.5 में बड़े और गहरे reactive arrays के लिए reactivity tracking को optimize किया गया है, जिससे कुछ मामलों में यह 10 गुना तक तेज़ हो गया है

Reactive Props Destructure

  • reactive Props destructure को 3.5 में stable कर दिया गया है और यह अब डिफ़ॉल्ट रूप से enabled है
  • <script setup> में defineProps कॉल से destructure किए गए variables अब reactive हैं
  • यह फीचर JavaScript के native default value syntax का उपयोग करके default values वाले props घोषित करना काफी सरल बना देता है

SSR सुधार

Lazy Hydration

  • async components अब defineAsyncComponent() API के hydrate विकल्प के ज़रिए strategy तय करके hydration का समय नियंत्रित कर सकते हैं

useId()

  • useId() एक API है जिसका उपयोग server और client rendering में स्थिर रूप से गारंटी किए गए, application-स्तर के unique ID बनाने के लिए किया जा सकता है
  • इसका उपयोग form elements और accessibility attributes के लिए ID बनाने में किया जा सकता है, और इसे SSR applications में hydration mismatch के बिना इस्तेमाल किया जा सकता है

data-allow-mismatch

  • जब client value का server value से अलग होना अनिवार्य हो (जैसे: तारीख), तब data-allow-mismatch attribute से hydration mismatch warning को दबाया जा सकता है
  • attribute को value देकर अनुमत mismatch के प्रकार को सीमित भी किया जा सकता है (text, children, class, style, attribute)

Custom Element सुधार

  • 3.5 defineCustomElement() API से जुड़ी कई लंबे समय से चली आ रही समस्याओं को ठीक करता है और Vue के साथ custom elements लिखने के लिए कई नए फीचर्स जोड़ता है
  • configureApp विकल्प के माध्यम से custom elements के लिए app configuration का समर्थन
  • useHost(), useShadowRoot() और this.$host API जोड़कर custom elements के host element और shadow root तक पहुँच
  • shadowRoot: false पास करके Shadow DOM के बिना custom elements को mount करने का समर्थन
  • nonce विकल्प देने का समर्थन, जिसे custom elements द्वारा inject किए गए <style> टैग से जोड़ा जाता है

अन्य उल्लेखनीय फीचर्स

useTemplateRef()

  • 3.5 useTemplateRef() API के माध्यम से template refs प्राप्त करने का एक नया तरीका पेश करता है
  • 3.5 से पहले variable name को static ref attribute से मिलाने वाले सामान्य refs का उपयोग करने की सिफारिश की जाती थी
  • पिछला तरीका static ref attribute तक सीमित था क्योंकि compiler को ref attribute का विश्लेषण करने में सक्षम होना पड़ता था
  • इसके विपरीत, useTemplateRef() runtime string ID के माध्यम से refs को match करता है, इसलिए यह बदलने वाले ID के लिए dynamic ref binding का समर्थन करता है

Deferred Teleport

  • built-in <Teleport> component की एक ज्ञात सीमा यह थी कि teleport component के mount होने के समय target element का मौजूद होना ज़रूरी था
  • इसकी वजह से users, Vue द्वारा render किए गए किसी दूसरे element में content को teleport नहीं कर पाते थे
  • 3.5 में <Teleport> के लिए defer prop जोड़ा गया है, जो current render cycle के बाद mount होता है, इसलिए अब यह काम करता है

onWatcherCleanup()

  • 3.5 watchers में cleanup callback register करने के लिए globally imported API onWatcherCleanup() पेश करता है

3 टिप्पणियां

 
[यह टिप्पणी छिपाई गई है.]
 
narusas 2024-09-06

इस रिलीज़ में असल में component development करते समय सुविधा काफ़ी बढ़ गई है।

 
xguru 2024-09-06

लगता है इस वर्ज़न का नाम "Tengen Toppa Gurren Lagann" है। (कमाल की कृति है! मुझे लगता है मैंने जो Gainax का काम देखा है, उसमें यह आख़िरी था)

Vue ने परंपरागत रूप से? anime शीर्षकों का इस्तेमाल किया है। 1.0 था Evangelion, 2.0 था Ghost in the Shell, 3.0 था One Piece, 3.3 था Rurouni Kenshin, 3.4 था Slam Dunk
https://en.wikipedia.org/wiki/Vue.js#Versions