vue3带来的新特性/亮点

1. Performance

vue3在性能方面比vue2快了2倍。

• 重写了虚拟DOM的实现
• 运行时编译
• update性能提高
• SSR速度提高

2. Tree-shaking support

vue3中的核心api都支持了tree-shaking，这些api都是通过包引入的方式而不是直接在实例化时就注入，只会对使用到的功能或特性进行打包（按需打包），这意味着更多的功能和更小的体积。

3. Composition API

vue2中，我们一般会采用mixin来复用逻辑代码，用倒是挺好用的，不过也存在一些问题：例如代码来源不清晰、方法属性等冲突。基于此在vue3中引入了Composition API（组合API），使用纯函数分隔复用代码。和React中的hooks的概念很相似。

1. 更好的逻辑复用和代码组织
2. 更好的类型推导

一个简单的例子

<template>
    <div>X: {
   {
    x }}</div>
    <div>Y: {
   {
    y }}</div>
</template>

<script>
import {
    defineComponent, onMounted, onUnmounted, ref } from "vue";

const useMouseMove = () => {
   
    const x = ref(0);
    const y = ref(0);

    function move(e) {
   
        x.value = e.clientX;
        y.value = e.clientY;
    }

    onMounted(() => {
   
        window.addEventListener("mousemove", move);
    });

    onUnmounted(() => {
   
        window.removeEventListener("mousemove", move);
    });

    return {
    x, y };
};

export default defineComponent({
   
    setup(