v2.6.10 ( released March 20, 2019)
333KB full development, 30.30KB minified+gzipped
1,010,596 npm weekly downloads
146,015 GitHub stars (2nd in JavaScript, 3rd overall)
3,034 commits, 279 contributors
20 active core members in 11 countries, 6 core team emeriti, 31 community partners
* as of Aug 7, 2019
Object property addition/deletion and direct array item mutation can't be observed in v2.x 🔗
Vue 3 using Proxy = no more caveats
A compat build with Object.definiteProperty
will be available for unsupported browsers (IE11)
// 2.x
import Vue from 'vue'
Vue.nextTick(() => {})
const reactiveObject = Vue.observable({})
// 3.0
import { nextTick, observable } from 'vue'
nextTick(() => {})
const reactiveObject = observable({})
Vue.nextTick
, Vue.observable
, Vue.version
, Vue.compile
, Vue.set
, Vue.delete
Allow rendering DOM outside of a component (i.e. anywhere on a page)
Currently supported via a semi-official plugin (portal-vue) 🔗
Great for legacy or cross-framework applications
Allows returning multiple root nodes from a component
Implicit declaration syntax
Useful when dealing with a list of children (
td
,
li
) and/or for better semantic
<template>
<div class="wrapper">
<p>An element</p>
<slot>A slot</slot>
<FooComponent />
</div>
</template>
<script>
export default {
components: {
FooComponent: () => import('@/components/Foo')
}
}
</script>
<template>
<p>An element</p>
<slot>A slot</slot>
<FooComponent />
</template>
<script>
export default {
components: {
FooComponent: () => import('@/components/Foo')
}
}
</script>
Templates are divided into dynamic blocks ( if/else, for, slot)
Each block only needs a single flat array to track dynamic nodes
Update performance is determined by the amount of dynamic content instead of total template size
Watch Evan's keynote @Laracon 2019 for more details
Arguably the biggest, most controversial change ever introduced
Demo 🔗
Again, purely additive!
Code organized by feature instead of options
Encapsulation & component composition
Full TS support
Better compression / minification
Final syntax still TBC
A converter(s) might be available
Implicit attribute fall-through removal 🔗
Optional props declaration (this.$props
)
Render function API change
Functional components now only written as plain functions
Async component creation to be explicit
More on https://github.com/vuejs/rfcs
Subject to change!
Vuejs.org to be moved to VuePress
Weekly meeting & catchup
Collaboration on Notion.so
Upcoming annual sprint being planned