Вчера, 16 апреля, vue 3 официально вышла на стадию бета-тестирования. В тот же день Ю Да принял участие в онлайн-мероприятии State of Vue.Следующие слайды он загрузил в документы Google:

State of Vue Apr 16 2020

Те, у кого есть доступ к Интернету с научной точки зрения, могут напрямую открыть указанную выше ссылку для просмотра. Если не удобно, можно продолжить читать ниже:

Прогресс ядра vue 3

Что значит войти в стадию бета-тестирования?

• All planned RFCs merged & implemented
• Focus is now on stability and library integrations

В настоящее время все запланированные RFC реализованы, и следующая задача команды Vue — сделать Vue 3 более стабильной и сделать так, чтобы сторонние библиотеки, связанные с vue, поддерживали vue 3.

Каковы важные изменения в 3.0 по сравнению с 2.x?

• Performance
• Tree-shaking support
• Composition API
• Fragment, Teleport, Suspense
• Better TypeScript support
• Custom Renderer API

в основном отражается в性能,Tree-shaking support,Composition API,Fragment,TypeScript支持度а также自定义 Renderначальство.

представление

• Rewritten virtual dom implementation
• Compiler-informed fast paths
• More efficient component initialization
• 1.3~2x better update performance*
• 2~3x faster SSR*

С точки зрения производительности, он в основном переписывает Vdom, основанные на компиляторе быстрые пути (оптимизация скомпилированных шаблонов?) и реализует более эффективную инициализацию компонентов.

Tree-shaking support

• Most optional features (e.g. v-model, <transition>) are now tree-shakable
• Bare-bone HelloWorld size: 13.5kb
• 11.75kb with only Composition API support
• All runtime features included: 22.5kb
• More features but still lighter than Vue 2

Оптимизация этой части в основном направлена ​​на уменьшение объема упаковки vue. Во многих случаях нашим приложениям не нужны все функции, предоставляемые vue.В vue 2 у нас не было хорошего способа исключить эти нежелательные функции, но в версии 3.0 мы сделали их доступными по запросу. Например, встроенные компоненты, такие как поддержка активности, переход и время выполнения инструкций, таких как v-model, v-for и т. д., могут быть введены по запросу. Это может уменьшить размер чистого vue.

Composition API

• Usable alongside existing Options API
• Flexible logic composition and reuse
• Reactivity module can be used as a standalone library

Composition API похож на React Hooks, их основная функция заключается в улучшении возможности повторного использования логики кода, что обеспечивает независимость от шаблонов. Кроме того, отделение модуля реактивности означает, что адаптивный модуль vue 3 можно комбинировать с другими фреймворками. Хао Шэнь опубликовал статью раньше40 строк кода интегрируют отзывчивость Vue3 в React для управления состоянием.Кому интересно, могут посмотреть.

Fragments

• No longer limited to a single root node in templates
• Manual render functions can simply return Arrays
• «Просто работает»

Больше не ограничивается наличием только одного корневого узла в шаблоне, и функция рендеринга также может возвращать массив, что аналогично реализацииReact.Fragmentsфункция.

<Teleport>

• Previously known as <Portal>
• More details to be shared by @Linusborg

<Suspense>

• Wait on nested async dependencies in a nested tree
• Works with async setup()
• Works with Async Components

Better TypeScript Support

• Codebase written in TS w/ auto-generated type definitions
• API is the same in JS and TS
• In fact, code will also be largely the same
• TSX support
• Class component is still supported (vue-class-component@next is currently in alpha)

Более дружественная поддержка для TS и TSX. Компоненты класса будут по-прежнему поддерживаться, но их необходимо ввестиvue-class-component@next, модуль все еще находится в стадии альфа-тестирования.

Custom Renderer API

• NativeScript Vue integration underway by @rigor789
• Users already experimenting w/ WebGL custom renderer that can be used alongside a normal Vue application (Vugel)

Это замечательная новость, а это значит, что в будущем мы сможем использовать vue для реализации программирования webgl так же, как программирования dom. Заинтересованные могут посмотреть здесь:Getting started vugel

Прогресс экологии vue 3

Руководство по документации и миграции

• New Docs under heavy work by @NataliaTepluhina, @sdras, @bencodezen & @phanan
• @sdras starting to work on Migration Guide
• @sodatea has started working on CodeMods

vue-router

• vue-router@next is currently in alpha, thanks to work by @posva

Vuex

• vuex@next (same API but with Vue 3 compat) currently in alpha, thanks to work by @KiaKing
• Team is experimenting with Vuex API simplification for the next iteration

vue-cli

• Experimental Support via vue-cli-plugin-vue-next by @sodatea
• (wip) CodeMods support for upgrading Vue 2 applications

vue-test-utils

• test-utils@next being worked on by @lmiller1990, @dobromir-hristov, @afontcu & @JessicaSachs

DevTools

• Early prototype already working by @Akryum, full integration will be worked on as we reach beta

IDE Support (Vetur)

• @znck currently experimenting with Type checking for templates
• @octref will be working on Vetur integration for Vue 3 in May

Nuxt

• Nuxt team is working on Vue 3 integration and already has working prototype.

What About 2.x?

• There will be one last minor release (2.7)
• Backporting compatible improvements from 3.0
• Deprecation warnings for features removed in 3.0
• LTS for 18 months

Видно, что vue 2 не устарел, будут небольшие обновления, и он будет поддерживаться 18 месяцев.

Суммировать

Несмотря на то, что vue 3 находится в стадии бета-тестирования, до его применения в производственной среде еще далеко. заключается в том, что экосистема vue 3 еще не идеальна. Точно так же, как python3 отсутствовал так долго, есть много людей, использующих python2, потому что все еще есть много библиотек python, которые несовместимы с python3.