2 March 2018

Создатель Vue.js отвечает Хабру

Website developmentJavaScriptProgrammingInterfacesVueJS


Всех с пятницей!

Как и обещали, публикуем ответы Эвана Ю (Evan You) на вопросы, которые мы долго и мучительно собирали в предыдущем посте, а также русскоязычном Vue чате в Telegram.

В общем о Vue


В: Какова самая уникальная киллер-фича Vue.js?
O: Прогрессивная адаптивность: ты можешь использовать его как замену jQuery или создавать приложения любой сложности, используя CLI, роутер и Vuex.

В: Каковы самые слабые места Vue?
O: На данный момент, наверное, недружественность к типизации. Наш API разрабатывался без планирования поддержки типизированных языков (типа TypeScript), но мы сделали большие улучшения в 2.5.

В: React называет себя библиотекой, Angular — фреймфорком. Почему Vue позиционирует себя как фреймфорк?
O: «Прогрессивный фреймворк» означает, что его можно использовать как библиотеку ИЛИ как фреймворк, по твоему желанию. У нас есть части фреймворка (CLI, роутер, паттерны управления состоянием), но никто не заставляет их использовать, если они не требуются. (см. более подробное видео (eng) — прим. пер.)

В: Является ли Vue полноценной заменой React/Angular или это нишевый фреймворк?
O: Да, он может быть полной заменой. Это не нишевый фреймворк.

В: Какой ожидаемый жизненный цикл Vue.js? Смогут ли Веб Компоненты (Web Components) / VanillaJS заменить JS фреймворки в ближайшем будущем?
O: Мы растем довольно быстро, и сейчас находимся в относительно стабильном / зрелом состоянии. Нет, я не думаю, что Веб-компоненты когда-либо заменят фреймворки. Они являются лишь низкоуровнивыми строительными блоками. Даже если ты используешь их уже сегодня, ты, скорее всего, вынужден использовать Polymer, который *является* фреймворком над Веб-компонентами. У него есть собственные дополнительные API, паттерны, библиотеки и инструменты. Преимущества Веб-компонентов, в основном, в совместимости между фреймворками или сторонних пакетах (3rd party distribution). Внутри же приложения, они не дают ничего нового в сравнении с существующими моделями компонентов (на самом деле, они могут меньше). VanillaJS имеет смысл, только если ты можешь позволить себе потратить вечность на разработку проекта.

В: Какова политика Vue относительно deprecation, несовместимых изменений и обратной совместимости?
O: Мы следуем semver. Мы можем объявить фичи устаревшими в минорных релизах, но на самом деле они не будут удалены, так что ваше приложение не сломается. Мы достаточно осторожно относимся к мажорным версиям / несовместимым изменениям и не планируем их в ближайшем будущем.

В: Какова рекомендуемая структура кода для Vue: ООП или ФП/Декларативный подход?
O: Ни первое, ни второе. Я думаю, бессмысленно натягивать высокоуровневые парадигмы на код UI. Выбирайте удачные идеи обоих. Но если ты действительно хочешь выбрать сторону Vue, то, думаю, там будет чуть больше ООП.

В: Формы — сильная черта у Angular и слабая у React. Как хорошо работает Vue со сложными формами?
O: У Vue есть встроенная двусторонняя привязка (binding) в виде v-model, который очень похож на ngModel у Angular. Также возможно строить Angular-подобные библиотеки валидации поверх, и несколько уже есть в экосистеме.

В: Какие самые большие конкуренты Vue в Китае?
O: React and Angular весьма популярны в Китае. Кроме них, на самом деле, других нет.

В: Ходят слухи, что Vue определяет, что запущен бенчмарк, и специально завышает результаты тестов (привет, VolksWagen!) Твои комментарии?
O: Слухи без доказательств остаются лишь слухами ;) Код Vue.js в открытом доступе, поэтому, если такой код есть, его легко можно найти.

Сторонние инструменты


В: Какие перспективы у Weex? Стоит ли начинать работать с Weex уже сейчас? Или лучше сконцентрироваться на работе с NativeScript-Vue?
O: Weex — надежная технология, т.к. она широко используется внутри Alibaba. Просто, в отличие от других, они не выделяют много ресурсов на документацию / поддержку разработчиков. NativeScript-Vue имеет лучшую документацию и обратную связь с разработчиками. Я не стану давать однозначные рекомендации, потому что ваш выбор должен определяться командой/продуктом/окружением. Чтобы узнать полный потенциал этих технологий, нужно попробовать обе.

В: Что ты думаешь о Nuxt?
O: Nuxt — отличная штука. Если нужен SSR под Vue — используй его, если не хочешь настраивать все самостоятельно (есть еще фреймворк-независимые альтернативы типа Razzleприм. пер.)

В: Что ты думаешь о Quasar Framework для Vue.js как об аналоге ReactNative для React.js?
O: Нет. Quasar больше похож на Ionic для Vue, так как основан на Cordova / WebView.

В: Что думаешь об интеграции с Logux и распределенных типах данных в целом? Намечается ли ли здесь следующая революция?
O: К сожалению, я не знаком с Logux.

В: Будет ли поддержка языка программирования Kotlin во Vue (SFC, плагины и т.д.)?
O: Мне не известно ни о чем подобном.

Документация


В: Примеры в официальной документации Vue.js не всегда понятны из-за того, что их невозможно запустить прямо на странице. Если планы по интеграции CodePen или JSFiddle в официальную документацию Vue.js?
O: Хорошее предложение. Возможно, мы рассмотрим его, когда у нас будет больше времени.

В: Как делить макет страницы на компоненты перед началом разработки? Есть ли что-то вроде «Списка критериев Компонента» от Эвана Ю?
O: Это невозможно, все приложения — разные.

В: Есть ли единое официальное руководство по программному стилю вроде руководства Angular от Джона Папы (John Papa)?
O: ru.vuejs.org/v2/style-guide

В: Существуют ли официальные инструкции по миграции на Vue с других фреймворков?
O: На этот вопрос трудно ответить, не зная, с каких именно технологий идет миграция.

В: Как превратить приложение на Vue в Web Component?
O: При помощи консольной утилиты vue-cli версии 3

В: В официальной документации Vue.js рекомендуемой опцией компилятора TypeScript является «module»: «es2015». Насколько допустимо использование «module»: «amd», «module»: «system».
O: Эта рекомендация основана на предположении, что используется упаковщик совместимый с ES module, такой как webpack или rollup. Лично я больше не использую AMD или System, поэтому не могу ответить на этот вопрос. Мое общее предложение — не используй их, если не знаешь, что делаешь. Поскольку ты все же задаешь этот вопрос — используй мейнстрим (т.e. настройки по умолчанию — прим. пер.).

В: Когда будут выпущены спецификации для построений AST для шаблонов?
O: Не думаю, что у нас есть такие планы. Нам понадобится очень убедительный сценарий использования, чтобы рассмотреть такое решение.

Запросы фич


В: Будет ли возможно использовать компилятор однофайловых компонентов без модульных бандлеров?
O: Да, у нас есть компилятор SFC (Однофайловых компонентов), мы надеемся что его можно будет использовать для создания внешних или внутрибраузерных компиляторов.

В: Будет ли шаблон для генерации библиотек добавлен в vue-cli?
O: vue-cli 3 можно использовать и для создания библиотек.

В: Фрагменты из React версии 16.2 хорошо себя зарекомендовали. Будет ли что-то похожее у Vue.js?
O: Да, хоть и не в ближайшем будущем, т.к. потребуется много изменений в текущем алгоритме нахождения различий (diffing algorithm). React'у для этого потребовалось полностью переписать все в течение почти 2х лет.

В: Будет ли во Vuex поддержка обработки middleware между actions и mutation?
O: Маловероятно. Скорее всего, мы будем избавляться от различий между действиями (actions) и мутациями (mutations).

В: Когда запуск команды `npm run lint` будет поддерживать autofix?
O: vue-cli 3 уже это поддерживает. Ты также можешь самостоятельно изменить команду, добавив флаг `--fix`.

В: React недавно выпустил асинхронный рендеринг aka Fiber. Какой будет ответ Vue? Является ли Vue по-прежнему самым быстрым из всех троих фреймворков?

O: Асинхронность не делает React быстрее. Она лишь используется в определенных сценариях, чтобы задать приоритет обновлений для лучшей видимой производительности. В механизме обновлений Vue уже есть возможность симулировать некоторые из этих сценариев, но нам нужно открыть соответствующий API, чтобы сделать их использование простым.

Вкратце: мы не планируем создавать полный эквивалент Fiber, но мы предоставим API для некоторых новшеств, появившихся в нем.

В: Будет ли во Vue.js добавлена возможность рендера одного и того же слота в компоненте дважды как это позволяет делать React?

// [Предупреждение Vue]: Duplicate presence of slot "default" found in the same render tree - this will likely cause render errors.

<div>
 ...content
 <slot>
 ...content
 <slot>
 ...content
</div>

// в React работает без пробем
<div>
 ...content
 {this.props.children}
 ...conent
 {this.props.children}
 ...content
</div>

O: Хотя React это позволяет, я не думаю, что это хорошая идея.

В: Поддерживает ли Vue единый репозиторий для приложений масштаба энтерпрайз вроде Nrwl Extention в Angular?
O: Это проблема организации проекта, она пока вне наших интересов.

Пожалуйста, порекомендуй


В: Сейчас Vue.js можно выполнять валидацию форм двумя различными способами:
— декларативный, когда все правила описываются как директивы в разметке;
— императивный, когда все правила описываются в коде соответствующего Vue-экземпляра

Планируется ли сделать какой-либо из этих способом реализацией по-умолчанию в Vue.js? Или оба способа сразу?


O: Нет, потому что лучше иметь несколько конкурирующих решений неоднозначной проблемы.

В: Чем и как лучше всего тестировать Vue? Avoriaz рекомендует перейти на vue-test-tools, но последний все еще бета.
O: @vue/test-utils заменит Avoriaz. Используйте @vue/test-utils.

В: Cостояние (state) Vuex reactive/observable, как и любые данные компоненты Vue. Если бы не наследие Flux, возможно было бы манипулировать им напрямую (даже если это плохая идея)?
O: Если требуется реактивное состояние хранилища, которым можно будет манипулировать напрямую, — просто используй непримонтированный экземпляр Vue.

В: Существуют ли планы или рекомендации для компонент по возврату нескольких корневых нод (root nodes)? Возможен ли такой списочный («list-based») подход хотя бы в теории?
O: Да, мы планируем это, но потребуется некоторое время.

В: Твои идеи по поводу повторного использования, наследования и тюнинга компонент во время запуска? Есть ли какие-нибудь проверенные подходы и решения?
O: Извини, но это слишком большая тема, чтобы ответить здесь :)

Коммьюнити


В: Vue впитал в себя много фишек Angular и React. Какие отношения у Vue с сообществами Angular и React?
O: На самом деле я довольно часто общаюсь с сообществом React. Мне нравятся все их хорошие идеи. Однако я не знаком с таким количеством людей из сообщества Angular.

В: Я хочу внести свою лепту в развитие Vue. В каких областях нужна моя помощь?

O: Начни отвечать на вопросы других! Это могут быть обсуждения на GitHub, чат в Discord или StackOverflow (или Тостер — прим. пер.). Нужно помнить, что отвечать нужно максимально понятно. Обычно, чтобы лучше разобраться в проблеме, может потребоваться перечитать документацию или даже исходники. Занимаясь этим какое-то время, ты начнешь понимать Vue гораздо лучше и сможешь решить больше проблем на Github, помогая с примерами кода, поиском источников багов и даже созданием фиксов и новых фич.

В: Какие самые крупные конференции, митапы и мероприятия по Vue, которые стоит посетить?
O: Мы только что провели Vue.js конференцию в Амстердаме в феврале этого года. И планируем провести ее там же в следующем году. Также в марте этого года состоится конференция VueConf в US. По всему миру проводятся достаточно много конференций — стоит только поискать рядом с тем местом, где ты живешь (Vue в Москвеприм. пер.).

Планы на будущее


В: Ведется ли работа над Vue 3.0? Если да, то каковы ключевые изменения?
O: У нас есть планы на 3.0, но пока что ничего определенного. Ближайший большой релиз — это ветка 2.x-next, которая полностью совместима по возможностям с 2.x, но в ней внутренняя система реактивности переписана на ES2015 Прокси. Это улучшит производительность и позволит избавиться от некоторых ограничений существующей реализации (например, отслеживание изменений в объектах и массивах — прим. пер.). Мы прекратим поддержку IE11 и ниже, но позволим использовать последние возможности ES2015 для более эффективного кода.

В: Доступ к родительским компонентам (через $parent) позволяет неопытным разработчикам делать ужасные ошибки. Что ты думаешь на этот счет? Планируется ли когда-либо убрать такой доступ (например, в версии 3.0)?
O: Маловероятно, что мы уберём его, поскольку он бывает полезен в определённых ситуациях. Всегда можно запретить доступ к родителю с помощью статического анализа, например с помощью пользовательского правила (custom rule) для ESLint.

О себе


В: Давай уйдем в сторону от IT-тематики. Суммируя свой опыт, какими знаниями ты можешь поделиться? Какие у тебя интересы и как они сочетаются с программированием? Какой совет ты бы дал людям в целом и разработчикам в частности?
O: У меня художественное образование, я учился программированию, по большей части, самостоятельно. Наверное, из-за этого я склонен ценить практичные и легко изучаемые решения. Со временем я также понял, что чаще всего программирование — это выбор правильных компромиссов. Думаю, мой совет не должен быть слишком категоричным — будьте практичны и будьте готовы к компромиссам.

В: Сколько часов в день ты посвящаешь работе над Vue.js?
O: С тех пор, как это стало моей основной работой, я провожу обычный средний рабочий день с 9 до 5 (ну ладно, может чуть дольше)

В: Расскажи о своем прошлом опыте работы в Google, Meteor и т.д. Как родилась идея Vue?
O: Я только что закончил эпизод подкаста, который скоро появится на devchat.tv. Там я рассказываю об этом в подробностях.

В: Какой, по твоему, самый важный момент в стеке веб технологий на сегодня? В каких областях назрела необходимость изменений? Что в порядке, а что — нет?
O: Я могу рассуждать только о фронтенде. Думаю, основная проблема в том, что стандартные API, которые предоставляет веб платформа, слишком низкоуровневые. В результате, очень многие библиотеки решают почти каждую проблему, которую не решает платформа. Это и хорошо, и плохо. Хорошо тем, что эти инновации (вызванные конкуренцией) порождают отличные идеи. Негативная же сторона в том, что почти каждый стек, который вы видите, состоит из огромного числа быстро развивающихся зависимостей. Это, вероятно, продолжится еще несколько лет.

Лично я надеюсь на то, что однажды браузеры станут достаточно эффективны, и мы сможем перестать беспокоиться о бандлинге или микрооптимизации доставки ресурсов (assets). Это уберет все проблемы с временным (stop-gap) инструментарием, которые обычно есть в архитектурах сегодняшнего фронтенда. Однако, я не знаю когда это произойдет.

В: Каким техническим решением во Вью ты гордишься больше всего?
O: Я сделал его легким в изучении и одновременно довольно мощным.

В: Тони Хор (Tony Hoare) назвал null ошибкой на миллиард долларов. Какое было самое неудачное техническое решение в твоей карьере?
O: Было бы неплохо использовать TypeScript изначально, еще когда я начал переписывать код для Vue 2.x.

В: Какая самая сложная фича Vue, над которой ты работал?
O: Наверное, оптимизация серверного рендеринга в 2.4, которая позволила рендереру обрабатывать смесь нод VDOM и строковых нод (string representation nodes), созданных во время компиляции.

P.S.


Спасибо всем, кто помогал с организацией и переводом (Alex Sokolov, ai_boy, hiperteksto, irsick, z6Dabrata, gbezyuk) и, конечно самому Эвану.

P.P.S.


См. видео(eng) нашей предыдущей Q&A сессии с Эваном
Tags:Evan YouЭван ЮvuejsVue 3.0progressive frameworkvue-clivuexWebComponentsreactjsangularjsjs frameworktypescriptvirtual domES6SSReslint
Hubs: Website development JavaScript Programming Interfaces VueJS
+85
53.1k 158
Comments 69