• vue3.0和vue2.0的区别是什么?


    区别:vue2.0中不管数据多大,都会在一开始就为其创建观察者;当数据很大时,这可能会在页面载入时造成明显的性能压力。而vue3.0只会对“被用于渲染初始可见部分的数据”创建观察者,而且vue3.0的观察者更高效。

    vue3.0和2.0的区别

    Vue-cli3.0于 8月11日正式发布,看了下评论,兼容性不是很好,命令有不少变化,不是特别的乐观

    vue3.0 的发布与 vue2.0 相比,优势主要体现在:更快、更小、更易维护、更易于原生、让开发者更轻松;

    更快
      1、virtual DOM 完全重写,mounting & patching 提速 100%;
      2、更多编译时 (compile-time)提醒以减少 runtime 开销;
      3、基于 Proxy 观察者机制以满足全语言覆盖以及更好的性能;
      4、放弃 Object.defineProperty ,使用更快的原生 Proxy;
      5、组件实例初始化速度提高 100%;
      6、提速一倍/内存使用降低一半;

    更小
      1、Tree-shaking 更友好;
      2、新的 core runtime:~ 10kb gzipped;

    ===============

    3.0 新加入了 TypeScript 以及 PWA 的支持

    部分命令发生了变化:

    • 下载安装 npm install -g vue@cli

    • 删除了vue list

    • 创建项目 vue create

    • 启动项目 npm run serve

    • 默认项目目录结构也发生了变化:

    • 移除了配置文件目录,config 和 build 文件夹

    • 移除了 static 文件夹,新增 public 文件夹,并且 index.html 移动到 public 中

    • 在 src 文件夹中新增了 views 文件夹,用于分类 视图组件 和 公共组件 

    注:php中文网线上班也开始教授最新版本的vue课程了,感兴趣的朋友可以了解学习。

    安装

    1

    npm install -g vue@cli

    创建项目文件:

    1

    vue create project //项目的名称

    ====================

    vue2和vue3的区别

    一、常用命令

    vue -V 查看本地 vue 版本

    二、官方文档

    3.0:https://cli.vuejs.org/zh/

    三、创建文件

    3.0:vue create 进入工程文件夹,创建项目。

    2.0:vue init webpack

    四、启动项目

    3.0启动npm run serve

    2.0启动npm run dev

    build没了、config没了、哦对了还有最重要的一点,3.0的安装项目时自动下载node-model。

    在根目录下创建一个vue.config.js

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    module.exports = {

     baseUrl: process.env.NODE_ENV === 'production' ? '/online/' : '/',

     // outputDir: 在npm run build时 生成文件的目录 type:string, default:'dist'

     // outputDir: 'dist',

     // pages:{ type:Object,Default:undfind }

     devServer: {

     port: 8888, // 端口号

     host: 'localhost',

     https: false, // https:{type:Boolean}

     open: true, //配置自动启动浏览器

     // proxy: 'http://localhost:4000' // 配置跨域处理,只有一个代理

     proxy: {

     '/api': {

     target: '<url>',

     ws: true,

     changeOrigin: true

     },

     '/foo': {

     target: '<other_url>'

     }

     }, // 配置多个代理

     }

     }

    ==================

    Vue3.0和Vue2.0的区别

    一、默认进行懒观察(lazy observation)。

    在 2.x 版本里,不管数据多大,都会在一开始就为其创建观察者。当数据很大时,这可能会在页面载入时造成明显的性能压力。3.x 版本,只会对「被用于渲染初始可见部分的数据」创建观察者,而且 3.x 的观察者更高效。

    二、更精准的变更通知。

    比例来说:2.x 版本中,你使用 Vue.set 来给对象新增一个属性时,这个对象的所有 watcher 都会重新运行;3.x 版本中,只有依赖那个属性的 watcher 才会重新运行。

    三、3.0 新加入了 TypeScript 以及 PWA 的支持

    四、部分命令发生了变化:

    下载安装 npm install -g vue@cli

    删除了vue list

    创建项目 vue create

    启动项目 npm run serve

    五、默认项目目录结构也发生了变化:

    移除了配置文件目录,config 和 build 文件夹

    移除了 static 文件夹,新增 public 文件夹,并且 index.html 移动到 public 中

    在 src 文件夹中新增了 views 文件夹,用于分类 视图组件 和 公共组件

    相关推荐:

    2020年前端vue面试题大汇总(附答案)

    vue教程推荐:2020最新的5个vue.js视频教程精选

    更多编程相关知识,请访问:编程教学!!

    以上就是vue3.0和vue2.0的区别是什么?的详细内容,更多请关注php中文网其它相关文章!

  • 相关阅读:
    [UGUI]事件机制
    [C#]CompareTo
    [Unity算法]交换排序(二):快速排序
    [Unity算法]交换排序(一):冒泡排序
    [Lua]string(二):string.sub处理中文
    [Lua]string(一):string库
    [Unity热更新]LuaFramework14.打包、加载和卸载策略
    [Unity热更新]LuaFramework13.事件派发
    数仓day01
    大数据学习day39----数据仓库02------1. log4j 2. 父子maven工程(子spring项目的创建)3.项目开发(埋点日志预处理-json数据解析、清洗过滤、数据集成实现、uid回补)
  • 原文地址:https://www.cnblogs.com/sexintercourse/p/16515259.html
Copyright © 2020-2023  润新知