От автора: что такое VueJS? Это прогрессивный JavaScript фреймворк с открытым исходным кодом, предназначенный для разработки пользовательского интерфейса. Он является одним из самых популярных фреймворков для упрощения веб-разработки. VueJS работает в основном с уровнем представления. Его с лёгкостью можно интегрировать в большие проекты для фронт-енд разработки.
Устанавливается VueJS очень просто. Для разработчика разобраться в нем и начать создавать пользовательские веб-интерфейсы – это всего лишь вопрос небольшого времени. Создателем VueJS является Эван Ю (Evan You), бывший сотрудник Google. Релиз первой версии VueJS состоялся в феврале 2014. Недавно количество его звёзд на GitHub достигло 64828, что говорит о чрезвычайной популярности VueJS.
Ниже представлены функции VueJS.
VueJS использует Virtual DOM, как и такие известные фреймворки, как React, Ember и т.д. Изменения не вносятся в DOM, а создаётся копия DOM, выступающая в форме JavaScript структуры данных. Если нужно внести изменения, то они вносятся в JavaScript структуры данных, и последние сравниваются с исходной структурой данных. Потом окончательные изменения вносятся в реальный DOM, и их пользователь уже сможет наблюдать. Такой подход хорош в плане оптимизации, он не требует задействования большого количества ресурсов и изменения будут происходить гораздо быстрее.
Функция привязки данных помогает управлять значениями или присваивать их HTML-атрибутам, изменять стили, присваивать классы с помощью привязывающей директивы VueJS v-bind.
Компоненты – это очень важная функция VueJS, помогающая создать пользовательскме элементы, которые можно повторно использовать в HTML.
v-on – это атрибут, который добавляется к элементам DOM, чтобы прослушивать события в VueJS.
VueJS обеспечивает множество способов применять переходы к HTML-элементам, когда их добавляют /обновляют или убирают из DOM. VueJS имеет встроенный компонент переходов, который нужно обернуть вокруг элемента для создания эффекта перехода. Можно также легко добавить сторонние библиотеки анимации.
Это следующая важная функция VueJS. Она помогает прослушивать изменения, внесённые в элементы UI, и выполняет необходимые вычисления. Для этого нам не нужно писать дополнительный код.
VueJS представляет шаблоны, основанные на HTML, которые связывают DOM с данными экземпляра Vue. Vue компилирует шаблоны в функции Render виртуального DOM. Вы можете использовать шаблон функций Render, для этого нужно заменить шаблон render-функцией.
VueJS имеет такие встроенные директивы как v-if, v-else, v-show, v-on, v-bind и v-model, которые используются для выполнения различных действий во фронт-енд.
Наблюдатели применяются к изменяемым данным. Например, для вводимых элементов. В данном случае нам не нужно добавлять дополнительные события. Наблюдатель следит за изменениями данных, этим самым делая код проще и быстрее.
Навигация между страницами выполняется с помощью vue-router.
VueJS скрипт очень компактный, что обеспечивает высокую производительность.
VueJS может быть установлен из командной строки с помощью интерфейса командной строки vue-cli. Он помогает быстро создавать и компилировать проект с помощью vue-cli.
Давайте теперь сравним VueJS с такими фрейморками как React, Angular, Ember, Knockout и Polymer.
Virtual DOM – это виртуальное представление дерева DOM. Благодаря виртуальному DOM создаётся тот же самый объект JavaScript, что и в настоящем DOM. Каждый раз, когда нам нужно внести изменения в DOM, создаётся новый JavaScript объект и выполняются изменения. Позже оба JavaScript объекта сравниваются и финальные изменения вносятся в реальный DOM.
И VueJS, и React используют виртуальный DOM, что ускоряет их работу.
VueJS использует html, js и css по отдельности. Начинающему разработчику не составит труда разобраться и освоить стиль VueJS. Подход VueJS, основанный на шаблонах – это очень просто. React использует jsx-подход. Для ReactJS абсолютно всё – это JavaScript. HTML и CSS являются частью JavaScript.
React использует create react app, а VueJS – vue-cli /CDN/npm. Оба фреймворка просты в использовании, а проект отвечает всем базовым требованиям. В отличие от VueJS, React для создания нуждается в webpack. В случае VueJS мы можем начать кодировать в jsfiddle или codepen, используя библиотеку cdn.
React более популярен, чем VueJS. Освоив React, вы будете иметь больше возможностей трудоустройства, чем в случае с VueJS. Причина большей популярности React заключается в имени, стоящем за ним — то есть Facebook. Так как React использует основные понятия JavaScript, он применяет также его наилучшие практики. Разработчик, работающий с React точно будет хорошо разбираться в JavaScript.
VueJS – это развивающийся фреймворк. На данный момент возможность трудоустройства со знанием VueJS ниже, чем с React. Согласно данным опросов, много людей уже постепенно адаптируются к VueJS, то есть в будущем он действительно может стать более широко используемым, чем React и Angular. Над различными функциями VueJS работают члены очень активного сообщества. Это сообщество поддерживает vue-router и регулярно выпускает обновления к нему.
VueJS перенял различные преимущества Angular и React и построил эффективную библиотеку. VueJS намного быстрее по сравнению с React/Angular благодаря его легкой библиотеке.
VueJS во многом схож с Angular. Такие директивы как v-if, v-for почти идентичны ngIf, ngFor в Angular. Они оба имеют интерфейс командной строки для установки и создания проекта. VueJS использует Vue-cli, а Angular – angular-cli. Оба предлагают двухстороннюю привязку данных, рендеринг на стороне сервера и т.д.
Начать работу с Vuejs очень просто. Как было сказано раннее, начинающий разработчик может взять CDN библиотеку в VueJS и начать работать в codepen и jsfiddle.
Что касается Angular, то нам придётся пройти несколько этапов установки; начать работу с Angular новичкам будет немного сложнее. Для написания кода он использует TypeScript, что сложно для людей, которые имеют только опыт работы с JavaScript. А вот пользователям с опытом работы с Java и C# будет однозначно проще.
Именно пользователи принимают решения по поводу производительности. Размер файла VueJS гораздо легче, чем размер файла Angular. Со сравнением производительности фреймворков можно ознакомиться по следующей ссылке http://stefankrause.net/js-frameworks-benchmark4/webdriver-ts/table.html
На сегодняшний день Angular более популярен, чем VueJS. Многие организации используют Angular, и возможностей трудоустройства с Angular гораздо больше. Однако, VueJS продолжает занимать стойкую позицию на рынке и может считаться хорошим конкурентом Angular и React.
Angular предоставляет много встроенных функций. Чтобы начать, нам нужно импортировать необходимые модули, например, @angular/animations, @angular/form. VueJS не имеет всех встроенных функций Angular и для работы с ним понадобятся сторонние библиотеки.
VueJS можно спокойно объединять с любым другим большим проектом. В отличие от Angular, который не так просто интегрировать с другим существующим проектом.
Раньше были выпущены AngularJS, Angular2, а теперь мы имеем Angular4. AngularJS и Angular2 очень сильно отличаются друг от друга. Приложение проекта, разработанное в AngularJS не может быть конвертировано в Angular2 из-за базовых отличий.
Крайняя версия VueJS – это 2.0, она совместима с предыдущей версией. Также предоставляется доступная для понимания документация.
Angular использует TypeScript для написания кода. Для начала работы с Angular пользователи должны хорошо знать Typescript. Между тем, с VueJS мы можем прописывать код в jsfiddle или codepen, используя библиотеку cdn. Здесь мы можем работать со стандартным JavaScript, что обеспечивает нам неплохой старт.
Ember предоставляет инструмент командной строки Ember, то есть ember-cli, для простой установки и компиляции проектов Ember. VueJS также имеет инструмент командной строки vue-cli для запуска и создания проектов. Оба они содержат такие функции как роутер, шаблон и компоненты, которые делают их очень эффективными UI фреймворками.
По сравнению с Ember, VueJS может похвастаться лучшей производительностью. Ember добавил механизм визуализации мерцания с целью улучшить производительность повторной визуализации, что напоминает virtual DOM, используемый VueJS и React. Однако, VueJS имеет лучшую производительность, чем Ember.
Knockout имеет хорошую поддержку браузерами. Он поддерживается минимальной версией IE, в то время как VueJS не поддерживается в IE8 и ниже. Поддержка Knockout в последнее время немного сбавила темпы, поэтому с недавних пор он уже не так популярен. VueJS, в свою очередь, набрал популярность благодаря команде Vue, которая регулярно выпускает обновления.
Библиотека Polymer была разработана в Google. Она используется во многих проектах Google, например, Google I/O, Google Earth, Google Play Music и других. Как и VueJS, она представляет привязку данных и вычисляемые свойства.
Определение пользовательского элемента в Polymer включает в себя простой JavaScript/CSS, свойства элемента, жизненные циклы и методы JavaScript. А VueJS позволяет легко и просто использовать JavaScript/html и CSS.
Polymer использует функции веб-компонентов и для него требуются полифиллы для обеспечения поддержки браузерами этих функций. VueJS не имеет таких зависимостей и прекрасно работает со всеми браузерами от IE9 и выше.
Источник: https://www.tutorialspoint.com/
Редакция: Команда webformyself.
В Unity используется производительный язык программирования C#. Благодаря C# и Mono – кроссплатформенной реализации .NET,…