Приближается Vue 3 - чего ожидать и как подготовиться

В связи с предстоящим выпуском Vue 3 нарастает много шума. Поэтому мне захотелось помочь сообществу разработчиков подготовиться к следующей версии этого популярного фреймворка. Надеюсь, этот пост окажется для вас полезным ❤️

В этом посте я затрону следующие темы:

  • Почему Vue 3 такой захватывающий
  • Возможности и изменения Vue 3
  • Дата выпуска объяснена
  • Экспериментируем с Vue 3: доступны важные инструменты
  • Как подготовиться к миграции с Vue 2
  • Изучение Vue 3 - учебные пособия и руководства
  • Часто задаваемые вопросы

Давайте начнем! 🚀

Vue 3 будет потрясающим

Популярность Vue растет, и с каждым обновлением проект становится все быстрее и лучше. Эван Ю объявил о новой версии Vue на конференции в Лондоне 15 ноября 2018 года. Основная цель Vue 3 - сделать его более быстрым, более удобным для таргетинга на нативный и еще более удобным для пользователя.

Среди прочего, появился новый Composition API для создания компонентов. Он не вводит новые концепции в Vue, а скорее раскрывает основные возможности Vue, такие как создание и наблюдение за реактивным состоянием, как отдельные функции. В конечном итоге это полезно для разработчиков Vue всех уровней.

Проще говоря, команда Vue интенсивно работает над улучшением API фреймворка, чтобы сделать Vue 3:

  • Быстрее
  • Меньше
  • Более удобное обслуживание
  • Легче настроить таргетинг на нативный
  • Повысьте удобство работы разработчиков

Не можете дождаться его выпуска? Вы можете начать экспериментировать с альфа-версией Vue 3. Также имеется начальный Справочник по API.

Возможности и изменения Vue 3

Чего ожидать от Vue 3 - Обзор

  • Composition API: этот новый API немного напоминает React Hooks. Это новый синтаксис, который позволяет использовать функции для организации кода по функциям, а не по объектам. Этот API будет жить вместе с хорошо известным API опций Vue 2 - он не заменит его. Это означает, что вы можете продолжать создавать компоненты так, как вы привыкли, без каких-либо проблем. Однако вы также можете начать сборку с Composition API, который обеспечивает более гибкую организацию кода и возможности повторного использования логики, а также другие улучшения.
  • Поддержка TypeScript: одна из самых ожидаемых интеграций в веб-разработке. Vue 3 будет иметь встроенный TypeScript и позволит вам при желании использовать TS в вашем проекте. В любом случае это не коснется разработчиков, работающих с ES.
  • Более быстрая установка и исправление: виртуальная модель DOM была полностью переписана для повышения производительности. Добавлены подсказки во время компиляции, чтобы уменьшить накладные расходы времени выполнения. Это поможет вам пропустить ненужные ветки условий и избежать повторного рендеринга. Вы можете ожидать до 100% более быстрой инициализации экземпляра компонента с удвоенной скоростью и половиной использования памяти. Мило.
  • Просмотр объявления: Vue 3 по-прежнему будет поддерживать шаблоны, а также функции рендеринга. Суть в том, что Vue 3 оптимизировал скорость рендеринга, например, за счет ускорения алгоритмов «различий», которые работают за кулисами, чтобы Vue знал, что нужно повторно рендерить без помех.
  • Он намного меньше: вы сможете быстро избавиться от неиспользуемого кода. В настоящее время минимизированная и сжатая среда выполнения Vue весит около 20 КБ (22,8 КБ для текущей версии 2.6.10). Пакет Vue 3, по оценкам, весит около половины, то есть около 10 КБ!
  • Собственные порталы: теперь называется телепортом.
  • Фрагменты: виртуальные элементы, которые не отображаются в дереве DOM.
  • Hooks API (пока экспериментальный)
  • Поддержка Time Slicing (пока экспериментальная)

Подробнее о предстоящих функциях Vue 3

Мы не хотим перегружать вас описаниями. Существует множество сообщений, и мы выбрали только те, которые являются техническими, профессиональными и содержат практические примеры:

Дата выпуска объяснена

Официальный выпуск в настоящее время запланирован на третий квартал 2020 года (то есть в любое время до 30.9.2020). Эта информация основана на официальной дорожной карте мега-проекта Vue 3.

Причины для оптимизма в отношении даты выхода 🤩

  • Он уже находится на стадии релиз-кандидата (RC), и он был публично объявлен! Это означает, что API и реализация стабильны, и в него больше не будет никаких изменений. На этом этапе они работают над совместимой сборкой: сборкой 3.0, которая включает уровни совместимости для 2.x API. Эта сборка также будет поставляться с флагом, который вы можете включить, чтобы выдавать предупреждения об устаревании для использования API 2.x в вашем приложении. Несмотря на то, что первые оценки Эвана Ю были на 2019 год, они достигли такой продвинутой стадии, что дает основание полагать, что они очень заинтересованы в запуске в 2020 году.
  • Многие из наиболее важных инструментов для Vue 3 уже находятся в стадии экспериментов или публичной альфа-фазы (я подробно расскажу о них ниже).
  • Документация для Vue 3 и Руководство по миграции уже опубликованы, в которых вам объясняется, что нового. Оба все еще находятся в стадии бета-тестирования, но уже довольно полны (и очень читабельны и хорошо структурированы, как всегда были документы Vue).

Причины сомневаться в дате выхода 😒

  • На данном этапе я думаю, что к этой дате (3 квартал 2020 года) лучше относиться с недоверием. Грядущий Vue 3 был анонсирован давно в 2018 году, а дата выхода уже много раз откладывалась.
  • Кроме того, последнее обновление дорожной карты было сделано 29 июня. С тех пор могло произойти многое, что могло повлиять на дату релиза.

Если вы хотите вникнуть в подробности того, что было официально опубликовано, ознакомьтесь с полной презентацией Состояние Vue с апреля 2020 года, а также следите за последними изменениями.

Экспериментируйте с Vue 3: доступны важные инструменты

Как подготовиться к миграции с Vue 2

Если ваш проект относительно невелик, и вы следовали RFC и избегали устаревших функций, этот процесс должен быть довольно быстрым !. В любом случае, лучше всего будет начать с ознакомления с руководством по миграции. Просто обратите внимание, что руководство по миграции все еще находится в стадии бета-тестирования, и вы должны ожидать изменений в ближайшее время, когда Vue 3 будет официально выпущен.

Изучение Vue 3 - учебные пособия и руководства

Часто задаваемые вопросы

Я хочу изучить Vue. Что мне следует начать с Vue 2 или Vue 3?

Если вы только начинаете изучать фреймворк, рекомендуется начать с Vue 2. Основная причина в том, что Vue 3 не требует значительных изменений дизайна, и подавляющее большинство ваших знаний о Vue 2 по-прежнему применимо к Vue 3. Следовательно, нет смысла ждать официальной даты выпуска Vue 3. Начните изучать Vue 2, и как только Vue 3 будет выпущен, вы будете в правильном положении, чтобы наверстать упущенное.

Что будет с Vue 2.x после выпуска Vue 3?

Будет еще один второстепенный выпуск (2.7), который будет переносить обратно совместимые функции 3.x в 2.x.
И предоставлять предупреждения об устаревании для изменений 3.x. Это будет последний второстепенный выпуск для 2.x, который будет предлагаться как LTS (долгосрочная поддержка) в течение 18 месяцев. Он будет продолжать получать критические обновления безопасности даже после периода LTS.

Я видел некоторых критиков Vue 3. Есть ли что-то, что меня должно волновать?

Действительно, в сети (в основном на Reddit) шла активная дискуссия, которая вызвала серьезные опасения, которые оказались неверными. Среди опасений разработчики заявили, что новый Composition API Vue 3 не может быть чисто аддитивным и что текущий API Vue 2 будет устаревшим. Эти слухи заставляют людей опасаться, что все время, потраченное на изучение Vue, было пустой тратой времени. Но опять же, все это больше не актуально. Вы можете быть уверены, что Composition API будет чисто аддитивным, а текущий API будет и дальше поддерживаться.

Заворачивать

На этом пока все. Я надеюсь, что вы сможете найти ценные ресурсы в этом посте и получить четкое представление о том, чего ожидать от Vue 3. Разумно предположить, что мы все должны ожидать новых новостей в ближайшее время, поэтому убедитесь, что вы следите за Официальными новостями Vue. сайт для обновлений.

Этот гостевой пост представлен сообществу gitconnected с помощью ❤️ в сотрудничестве с daily.dev ». daily.dev доставляет лучшие новости программирования на каждой новой вкладке. Он оценит для вас сотни квалифицированных источников, чтобы вы смогли взломать будущее.