8月10日凌晨,尤雨溪宣布 Vue 3.2 正式发布(代号'Quintessential Quintuplets'),此版本增加了许多重要的新特性和性能改进,且不包含破坏性变更。
单文件组件(SFC,又称作.vue
文件)的两项实验特性已毕业,现已提供稳定版本:
<script setup>
属于编译时 (compile-time) 语法糖,可显著提升在 SFC 中使用 Composition API 时的开发效率
<style> v-bind
用于在 SFC <style>
标签中启用组件状态驱动的动态 CSS 值
使用示例
<script setup>
import { ref } from 'vue'
const color = ref('red')
</script>
<template>
<button @click='color = color === 'red' ? 'green' : 'red''>
Color is: {{ color }}
</button>
</template>
<style scoped>
button {
color: v-bind(color);
}
</style>
<script setup>
<style> v-bind
<script setup>
特性,尤雨溪表示,“<script setup> + TS + Volar = 真香”。defineCustomElement
方法,支持使用 Vue 组件 API 轻松创建原生自定义元素:import { defineCustomElement } from 'vue'
const MyVueElement = defineCustomElement({
// normal Vue component options here
})
// Register the custom element.
// After registration, all `<my-vue-element>` tags
// on the page will be upgraded.
customElements.define('my-vue-element', MyVueElement)
更高效的 ref 实现(读取速度提升约 260%,写入速度提升约 50%)
依赖跟踪速度提升约 40%
内存使用量减少约 17%
创建 VNode 的速度提升约 200%
更激进的 constant hoisting [1] [2]
v-memo
指令提供了针对部分模板树进行 memoize 的能力,并显著提升了性能。@vue/server-renderer
包现已提供 ES module build,并与 Node.js 的内置模块解耦。因此,开发者可在非 Node.js runtime 中(例如 CloudFlare Workers 和 Service Workers)绑定和使用@vue/server-renderer
。@vue/server-renderer
文档。END
联系客服