Vue - очень впечатляющий проект. Это очень популярный фреймворк JavaScript, который быстро растет. Он простой, миниатюрный и очень производительный. Узнать больше об этом
- Во-первых, что такое интерфейсная среда JavaScript?
- Популярность Vue
- Почему разработчики любят Vue
- Где Vue.js позиционирует себя в среде фреймворков
Vue - очень популярный интерфейсный фреймворк JavaScript, который быстро растет.
Он простой, крошечный (~ 24 КБ) и очень производительный. Он отличается от всех других интерфейсных фреймворков JavaScript и библиотек представлений. Давайте выясним почему.
Во-первых, что такое интерфейсная среда JavaScript?
Если вы не знаете, что такое JavaScript-фреймворк, Vue - идеальный вариант для первого знакомства с ним.
Фреймворк JavaScript помогает нам создавать современные приложения. Современные приложения JavaScript в основном используются в Интернете, но также используются во многих настольных и мобильных приложениях.
До начала 2000-х годов браузеры не обладали теми возможностями, которыми они обладают сейчас. Они были намного менее мощными, и создание сложных приложений внутри них было невыполнимо с точки зрения производительности, а инструменты даже не были тем, о чем люди думали.
Все изменилось, когда Google представил Google Maps и GMail, два приложения, работающие внутри браузера. Ajax сделал возможными асинхронные сетевые запросы, и со временем разработчики начали строить поверх веб-платформы, в то время как инженеры работали над самой платформой: браузеры, веб-стандарты, API-интерфейсы браузеров и язык JavaScript.
Такие библиотеки, как jQuery и Mootools, были первыми крупными проектами, построенными на JavaScript, и какое-то время пользовались огромной популярностью. Они в основном предоставили более приятный API для взаимодействия с браузером и предоставили обходные пути для ошибок и несоответствий между различными браузерами.
Такие фреймворки, как Backbone, Ember, Knockout, AngularJS, были первой волной современных фреймворков JavaScript. Вторая волна, которая является текущей, включает React, Angular и Vue в качестве основных участников.
Обратите внимание, что jQuery, Ember и другие проекты, о которых я упоминал, все еще активно используются, активно поддерживаются, и миллионы веб-сайтов полагаются на них. Тем не менее, методы и инструменты развиваются, и, как разработчику JavaScript, вам теперь, вероятно, потребуется знать React, Angular или Vue, а не старые фреймворки.
Фреймворки абстрагируют взаимодействие с браузером и DOM. Вместо того, чтобы манипулировать элементами, ссылаясь на них в DOM, мыдекларативноопределять их и взаимодействовать с ними на более высоком уровне.
Использование фреймворка похоже на использование языка программирования C вместо использования языка ассемблера для написания системных программ. Это похоже на использование компьютера для написания документа вместо пишущей машинки. Это как иметь беспилотный автомобиль, а не самому водить машину.
Ну, не так уж и далеко, но идею вы поняли. Вместо использования низкоуровневых API, предлагаемых браузером, для управления элементами и построения чрезвычайно сложных систем для написания приложения,вы используете инструменты, созданные очень умными людьми, которые облегчают нашу жизнь.
Популярность Vue
Насколько популярен Vue.js?
Vue имел:
- 7600 stars on GitHub in 2016
- 36700 stars on GitHub in 2017
и по состоянию на июнь 2018 года у него более 100000 звезд на GitHub.
Количество загрузок npm растет с каждым днем, и сейчас оно составляет ~ 350 000 загрузок в неделю.
Я бы сказал, что Vueочень популярный, учитывая эти числа.
В относительном выражении он имеет примерно такое же количество звезд GitHub, как React, который родился за несколько лет до этого.
Конечно, числа - это еще не все. У меня сложилось впечатление о Vue, что разработчикилюблюЭто.
Ключевым моментом во время подъема Vue стало внедрение в экосистему Laravel, чрезвычайно популярной среды веб-приложений PHP, но с тех пор она широко распространилась среди многих других сообществ разработчиков.
Почему разработчики любят Vue
Во-первых, Vue называетсяпрогрессивная структура.
Это означает, что он адаптируется к потребностям разработчика. В то время как другие фреймворки требуют полной поддержки со стороны разработчика или команды и часто хотят, чтобы вы переписали существующее приложение, потому что они требуют определенного набора соглашений, Vue с радостью попадает в ваше приложение с помощью простогоscript
для начала, и он может расти вместе с вашими потребностями, распространяясь от 3 строк до управления всем слоем представления.
Вам не нужно знать о webpack, Babel, npm или чем-то еще, чтобы начать работу с Vue, но когда вы будете готовы, Vue упрощает для вас возможность полагаться на них.
Это отличный аргумент, особенно в нынешней экосистеме интерфейсных фреймворков и библиотек JavaScript, которая отталкивает новичков, а также опытных разработчиков, которые чувствуют себя потерянными в океане возможностей и выбора.
Vue.js, вероятно, является более доступным фреймворком для внешнего интерфейса. Некоторые называют Vueновый jQuery, потому что он легко попадает в приложение через тег скрипта и постепенно занимает оттуда место. Считайте это комплиментом, поскольку jQuery доминировал в Интернете в последние несколько лет и по-прежнему выполняет свою работу на огромном количестве сайтов.
Vue выбирает из лучших идей. Он был построен путем отбора лучших идей таких фреймворков, как Angular, React и Knockout, и путем отбора лучших решений, которые сделали эти фреймворки, и за исключением некоторых менее блестящих, он начинался как «лучший из» набор и рос. оттуда.
Где Vue.js позиционирует себя в среде фреймворков
Когда речь заходит о веб-разработке, два слона в комнатеРеагироватьиУгловой. Как Vue позиционирует себя относительно этих двух больших и популярных фреймворков?
Vue был создан Эваном Ю, когда он работал в Google над приложениями AngularJS (Angular 1.0), и родился из-за необходимости создавать более производительные приложения. Vue выбрал часть синтаксиса шаблонов Angular, но удалил упрямый и сложный стек, который требовался для Angular, и сделал его очень производительным.
Новый Angular (Angular 2.0) также решил многие проблемы AngularJS, но совсем другими способами и требует участияМашинописькоторые не всем разработчикам нравится использовать (или которые хотят изучить).
А как насчет React? Vue позаимствовал у React много хороших идей, в первую очередь - Virtual DOM. Но Vue реализует это с помощью своего рода автоматического управления зависимостями, которое отслеживает, какие компоненты затронуты изменением состояния, так что только эти компоненты повторно визуализируются при изменении этого свойства состояния. В React, с другой стороны, когда часть состояния, которая влияет на компонент, изменяется, компонент будет повторно отрисован, и по умолчанию все его дочерние элементы также будут повторно отрисованы. Чтобы избежать этого, вам нужно использовать метод shouldComponentUpdate для каждого компонента и определить, следует ли повторно отрендерить этот компонент. Это дает Vue небольшое преимущество с точки зрения простоты использования и увеличения производительности.
Одно большое отличие от React - это JSX. Хотя технически вы можете использовать JSX во Vue, это не популярный подход, и вместо него используется система шаблонов. Любой HTML-файл является допустимым шаблоном Vue, тогда как JSX сильно отличается от HTML и требует обучения людям в команде, которым, например, дизайнерам может потребоваться только работа с HTML-частью вашего приложения. Шаблоны Vue во многом похожи на Mustache и Handlebars (хотя они различаются по гибкости) и поэтому более знакомы разработчикам, которые уже использовали такие фреймворки, как Angular и Ember.
Официальная библиотека управления состоянием Vuex следует архитектуре Flux и чем-то похожа наReduxв своих концепциях. Опять же, это часть положительных моментов в Vue, который увидел этот хороший шаблон в React и позаимствовал его в своей экосистеме. И хотя вы можете использовать Redux с Vue, Vuex специально адаптирован для Vue и его внутренней работы.
Vue является гибким, но тот факт, что основная команда поддерживает два пакета, очень важных для любого веб-приложения, таких как маршрутизация и управление состоянием, делает его намного менее фрагментированным, чем, например, React:vue-router
иvuex
являются ключом к успеху Vue. Вам не нужно выбирать или беспокоиться, будет ли выбранная вами библиотека поддерживаться в будущем и будет идти в ногу с обновлениями фреймворка, и, будучи официальными, они являются каноническими библиотеками для своей ниши (но вы можете выбрать используйте, конечно, то, что вам нравится).
Одна вещь, которая ставит Vue в другое ведро по сравнению с React и Angular, заключается в том, что Vue - этоиндипроект: он не поддерживается такой огромной корпорацией, как Facebook или Google. Вместо этого он полностью поддерживается сообществом, которое способствует развитию за счет пожертвований и спонсоров. Это гарантирует, что дорожная карта Vue не зависит от повестки дня одной компании.
Скачать мою бесплатнуюСправочник по Vue
Больше руководств по vue:
- Обзор Vue.js
- Интерфейс командной строки Vue.js: узнайте, как его использовать
- Инструменты разработчика Vue.js
- Настройка VS Code для разработки Vue
- Создайте свое первое приложение с Vue.js
- Однофайловые компоненты Vue.js
- Шаблоны и интерполяции Vue.js
- Директивы Vue.js
- Методы Vue.js
- Вычисляемые свойства Vue.js
- Стилизация компонентов Vue.js с помощью CSS
- Наблюдатели Vue.js
- Методы Vue против наблюдателей против вычисляемых свойств
- Фильтры Vue.js
- Компоненты Vue.js
- Слоты Vue.js
- Свойства компонента Vue.js
- События Vue.js
- Связь компонентов Vue.js
- Vuex, государственный менеджер Vue.js
- Vue, используйте компонент внутри другого компонента
- Vue, как использовать опору в качестве имени класса
- Как использовать SCSS с однофайловыми компонентами Vue.js
- Использование Tailwind с Vue.js
- Маршрутизатор Vue
- Динамически отображать компонент Vue
- Шпаргалка по Vue.js
- Храните данные Vue в localStorage с помощью Vuex
- Как динамически применять класс с помощью Vue
- Vue, как использовать v-модель
- Vue, почему данные должны быть функцией
- Roadmap to become a Vue.js developer in 2020