Зачем нужны js фреймворки? Основные библиотеки, инструменты и фреймворки JavaScript, которые вы должны знать

17.05.2019

Популярность JavaScript продолжает расти. В 2016 году мы стали свидетелями больших изменений с выходом полного апгрейда AngularJS и анонсом Angular 2, окончательного первенства jQuery, который применяют в 96,5% всех сайтов, эволюции ECMAScript, двух обновлений Node.js в апреле и октябре соответственно, и даже более того. Чего ожидать от 2017 года? Вот то, что мы знаем к этому времени: Angular 4 ожидается в марте 2017, выпуск ES2017 планируется в середине 2017, релиз Bootstrap v4 также ожидается в этом году.

Недавно JavaScript занял место среди лучших языков для изучения по версии IBM в 2017 году. На данном этапе он используется, как для клиентской, так и для серверной части и помогает проектировать привлекательные интерфейсы, обогащать веб-приложения многочисленными функциями и фичами, изменять веб-страницы в реальном времени и много другое.

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

Преимущества использования JavaScript фреймворков:

Эффективность – проекты, которые раньше заняли бы месяцы и сотни строчек кода, сейчас могут быть реализованы намного быстрее с хорошо структурированными готовыми шаблонами и функциями.
Безопасность – лучшие JavaScript фреймворки имеют фирменную систему безопасности и поддерживаются крупным сообществом, члены которого и просто пользователи выступают в роли тестировщиков.
Расходы – большинство фреймворков с открытым кодом и бесплатны. Поскольку они помогают программистам быстрее разрабатывать пользовательские решения, итоговая цена веб приложения будет ниже.

Лучшие JavaScript фреймворки в 2017:

Angular-s

После долгожданного релиза Angular еще в 2016, его популярность достигла новых вершин, но он будет держать планку не отступая и в 2017 году.

Angular.js часто называют MVW (Model-View-Whatever) фреймворк и среди главных выгод для старт-апов и средних компаний называют: быстрое написание кода, быстрое тестирование любой части приложения и двухсторонняя привязка данных (изменения в бэкэнде сразу же отражаются на пользовательском интерфейсе). С момента выхода его экосистема вышла за пределы воображения. Сейчас его заслуженно называют наиболее используемым JS фреймворком для разработки одностраничных приложений (SPA Single-Page-Applications) и он может похвастаться крупнейшим сообществом разработчиков.

Angular2 поставляется с большим списком функций, которые позволят разработать все, начиная от веб до декстопных и мобильных приложений. Фреймворк построен на TypeScript от Microsoft с прицелом на то, чтобы сделать JavaScript более гибким и привлекательным для больших предприятий. Функции ng2 имеют архитектуру на основе компонентов, улучшенный DI (dependency injection – внедрение зависимостей), эффективный сервис логов, межкомпонентное взаимодействие и многое другое. Пример разработки игры на Angular2:

Оба Angular являются лучшим вариантом для корпоративных приложений или для сред программирования с высокими стандартами к читаемости кода.

ReactJS

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

Он по праву считается самым быстрорастущим JS фреймвком: на сегодня насчитывается около 1000 авторов Github. В MVC (Model-View-Controller) моделе React.js действует как “V” и может быть легко интегрирован в любую архитектуру. Благодаря использованию виртуального DOM дерева он обеспечивает больший рост производительности в сравнении с Angular 1.x. В дополнение к этому, компоненты React могут быть созданы и повторно использованы в других приложениях или даже переданы для общественного использования.

Не смотря на тот факт, что React более сложен в изучении, он делает разработку приложений простой и легкой для понимания. Кроме того, он может идеально подойти для сложных, внушительных программных решений с высокой степенью нагрузки.

Пример разработки приложения на React.js.

Vue.js

Vue 2.0 также был представлен в 2016 году и взял лучшее из Ember, React и Angular, положив это все в удобную упаковку. Он доказал, что может быть (он оказался) быстрее и компактнее React и Angular 2.0.

Углубляясь, Vue.js предлагает двухстороннюю привязку данных (как в AngularJS), визуализацию на стороне сервера (как в Angular2 и ReactJS), Vue-cli (scaffolding инструмент для быстрого старта) и опционально поддержку JSX. Его создатель утверждает, что Vue2 один из самых быстрых фрейворков в целом.

Vue.js лучший выбор для быстрой разработки кросс-платформенных приложений. Он может стать прочной основой для высокопроизводительных приложений в одну страницу (SPAs) и выгодным решением для тех случаев, когда производительность важнее, чем хорошая организация кода или структура приложения.

Лекция с разбором особенностей Vue.js.

Ember.js

Еще в 2015 году Ember был назван лучшим JS фреймворком, оставляя позади React и AngularJS. Сегодня он может похвастаться огромным он-лайн комьюнити, регулярными обновлениями и широко применяемыми лучшими практиками на Java Script, которые гарантируют окончательный опыт прямо из коробки.

Ember имеет двухстороннюю привязку данных, как в AngularJS, держит и вид и модель в синхронизации на протяжении всего времени. Применение модуля Fastboot.js обеспечивает быстрый рендеринг (отрисовку, перерасчет) DOM дерева на стороне сервера, улучшая представление сложных пользовательских интерфейсов.

Emberjs обычно используется для сложных многофункциональных веб-приложений и веб-сайтов. Среди топ пользователей Chipotle, Blue Apron, Nordstrom, Kickstarter, LinkedIn, Netflix и многие другие. Более того он наиболее прост в изучении и есть море доступных онлайн учебных пособий и гайдов.

Meteor.js

Meteor один из самых популярных JS фрейворков, но который устойчиво шагает с тонной функций для бэкэнд разработки и отрисовки фронт-энда, управления базами данных и бизнес логикой. С выпуска в 2012 году его экосистема выросла кардинально быстрыми темпами. Эта фул-стэк платформа позволяет быстро разрабатывать веб и мобильные приложения. С точки зрения производительности, все изменения в базе данных тут же передаются на пользовательский интерфейс и обратно без каких-либо видимых потерь времени, вызванных разницей в языках или во времени реакции сервера.

Пример разработки MMO на Meteor.js:

Meteor.js охватывает все этапы цикла разработки программного обеспечения и заботится о таких процессах, как линкинг, конкатенация файлов и прочее. Фрейморк сейчас используется для разработке приложений реального времени в таких компаниях, как Mazda, IKEA, Honeywell и многих других.

Вывод

Выбор фреймворка не основан на функционале, который каждый из них может предложить. Он зависит от первоначальных целей компании, требований к проекту, общей функциональности фреймворка и как ее можно применить в каждом конкретном случае.

Когда дело доходит до быстрой веб-разработки или создания прототипов, JS фреймворки являются наиболее популярными для использования и 2017 год не станет исключением. Эти фрейворки и библиотеки уже изменили способ того, как JS взаимодействует с HTML и СSS, чтобы объединить представления в браузерах и на родных платформах.

Теги: Добавить метки

JavaScript - один из самых популярных ЯП во всем мире. Веб-разработчики активно используют JS для проектирования, анимации и создания веб-страниц. Наряду с HTML и CSS, JavaScript может сворачивать горы, а именно делать веб-страницу интерактивной и максимально интересной для пользователей.

JavaScript не ограничивает себя. Вместо этого он продолжает развиваться. Это наиболее универсальный язык программирования, что подкреплено его способностью разрабатывать приложения для широкого спектра платформ, таких как Android, Windows и iOS.

Основные преимущества JS:

Гибкость – приветствуются изменения.
Надежность – работает и изменяется в соответствии с определенными приоритетами.
Масштабируемость.

Давайте же рассмотрим несколько JavaScript фреймворков и библиотек, которые все так же актуальны в 2018 году.

Vue.js

Open Source фреймворк для работы с UI, который продолжает развиваться. Заслуженно наиболее популярный JS-фреймворк по статистике GitHub. Vue.js перерисовывает минимальное количество компонентов и поддерживает интеграцию сторонних библиотек. Как и React.js, Vue.js очень быстрый, использует Virtual DOM, а также предоставляет реактивность и компонентную структуру.

Плюсы:

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

Минусы:

Система рендеринга предоставляет меньше возможностей для отладки, чем аналогичная система React.
Компонентный подход в React более гибок и очевиден.

Angular

Эта разработанная Google платформа JS установила новую планку. Незаменимый фреймворк предназначен не только для разработчиков ПО, но и для дизайнеров. AngularJS, Angular 2 и Angular 4 прочно обосновались среди востребованных фреймворков. Это открытая платформа, которая поможет создавать SPA-приложения (Single Pages Applications), осуществлять двустороннее связывание для динамического изменения данных, etc.

Плюсы:

Разработчики сталкиваются с меньшим количеством ошибок, поскольку привязка данных строится на базе Angular-элементов.
Поддерживаются различные элементы MVC.
Хорошо работает в среде Agile.

Минусы:

Vue проще в плане архитектуры.
API Angular огромное, и нужно разобраться со многими концепциями.

jQuery

jQuery и JavaScript давно и прочно связаны. С лицензией MIT эта библиотека предоставляет разработчикам приложений возможность писать более короткий код, сокращая тем самым рабочую нагрузку. Поддерживает DOM-манипуляции и в тандеме с CSS может пригодиться для решения любой задачи.

Плюсы:

Широко используется благодаря быстрой обработке.
Во всех браузерах ведет себя одинаково.

Минусы:

Множество функций, облегчающих работу с DOM, уже реализованы нативно.

React.js

Следующей для вступления в лигу является библиотека для работы с UI React.js. Это сердце и душа IT-компаний и различных бизнес-сайтов. Данная JS-библиотека вступает в игру, когда нужно решить проблему частичного обновления содержимого веб-страницы. Идеальный инструмент для масштабных веб-проектов. Функционал React.js способствует улучшению работы UI.

Плюсы:

Free and Open Source.
Может использовать уже написанный код.
Поддерживает виртуальную функциональность DOM.

Минусы:

Алгоритм Virtual DOM неточный и медленный.
Требуется сложное асинхронное программирование при общении с сервером.

Node.js

Эта серверная JS-платформа будет следующей. Отзывчивый, неблокирующий и быстрый инструмент. GoDaddy и Paypal – лишь некоторые из именитых компаний, которые используют Node.js. Он лучше всего подходит для приложений, связанных с I/O и приложений для потоковой передачи данных.

Плюсы:

Такие ПО могут работать на нескольких хостах.
Включение быстрых серверов.

Минусы:

Не для «не сквозных» операций.
Без тестов в Node.js делать нечего.

Titanium Framework

Titanium – это и SDK, и облачная платформа для сборки/распространения ПО. Качественный, доступный и простой в освоении инструмент. Titanium предназначен для кроссплатформенной разработки, что идеально подходит для создания функционально насыщенных приложений.

Плюсы:

Простота обучения и реализации.
Высокопроизводительная структура.
Для десктопных и мобильных кроссплатформенных ПО.

Минусы:

Не самый эффективный и оригинальный подход к созданию UI, в отличие от того же React.

Ember.js

Еще один представитель JavaScript фреймворков с открытым исходным кодом. Основное преимущество заключается в массивном репозитории, который может служить в качестве словаря для разработки приложений. Упрощает создание масштабируемых одностраничников и обеспечивает двустороннюю привязку данных.

Плюсы:

Легко настраивается в системе.
Разворачивает большие пользовательские интерфейсы.

Минусы:

Жесткая структура проектов.
Нет стандартного набора UI-элементов.

Данный материал является переводом статьи . Переведено и дополнено сайтом

JavaScript фреймворки подобны смерти и налогам - неминуемы и неизбежны. Я уверен, что если бы мог подслушать всех, кто начинает веб-проект, каждый раз первый вопрос был бы о том, какой JavaScript фреймворк в нем будет использоваться. Вот насколько укоренилась роль фреймворков в нашей отрасли. Это не так, как должно быть, пора остановиться.

Давайте оглянемся назад и постараемся понять, как мы к этому пришли.

Angular и Backbone и Ember, о боже

HTML Imports, HTML шаблоны, настраиваемые элементы и Shadow DOM - все эти технологии расширяют наши возможности. Они должны позволить нам разорвать связь с фреймворками, позволяя создавать пригодные для повторного использования элементы и функционал. Для наглядного представления смотрите эти статьи и библиотеки:

Хорошо, если бы у нас была одна огромная библиотека полифиллов HTML5, но ещё лучше было бы то, что я назвал бы «html-5-polyfill-o-matic», набор инструментов, который позволил бы мне использовать Веб-компоненты минуя трясину HTML+JS, а затем анализировал мой код, или статическим анализом, или через Object.observe при работе, и выдал бы мне из всего полифилла HTML5 только то, что нужно для моего проекта.

Этот вид функциональности ещё более важен, потому что я начал пытаться совместить веб-компоненты и библиотеки из нескольких источников, т.е. от X-Tag и от Polymer, значит ли это, что мне придётся подключать обе эти библиотеки полифиллов? (Оказывается, что ответ нет.) И как именно я должен получать эти специфические элементы? И X-Tag, и Brick имеют собственные пакеты генераторов:

Если я начну создавать собственные элементы, мне нужно будет создавать и свой собственный пакет? Я не думаю, что это масштабируемая идея, я считаю, что нам нужны идиомы и инструменты, которые справлялись бы с этим гораздо лучше. Это на самом деле может означать изменение того, как пишется открытый код. «Виджет» не проект, поэтому наша работа с этими вещами должна изменится. Конечно, продолжайте хранить код в Git, но нужны ли вам накладные расходы в виде GitHub? Что-то более легковесное, ближе к Gist, чем к проекту, подошло бы лучше. А как минимизировать/вулканизировать весь этот код в подходящий для использования в моем проекте вид? Что-то вроде Asset Graph может стать хорошим началом.

И так, что нам теперь нужно?

Идиомы и принципы построения повторно используемых компонентов.
Инструменты, которые работают в рамках этих идиом, для компиляции, сжатия, и т.п. HTML, CSS, и JS.
Масштабируемый полифилл HTML5, полностью или частично построенный на основе тех, которые сейчас реально используются.

Это то, что нам требуется для того, что бы построить будущее, в котором нам не придётся знать последнюю модель новейшего фреймворка, вместо этого мы просто будем работать напрямую с платформой, загружая элементы и библиотеки для своих нужд, и тратя своё время на написание приложений, а не на картографирование айсбергов.

Вопросы и ответы

О: Я не ненавижу их. Некоторые из моих лучших друзей - авторы фрейворков. Признаюсь, я немного вдохновлялся ироничной статьёй «ты погубил JavaScript », но я ни в коем случае не высмеиваю авторов фреймворков.

В: Вы не можете сделать ____ на HTML5, для этого вам нужен фреймворк.

О: Во-первых, это не вопрос. Во-вторых, спасибо что указали на это. А теперь давайте работать вместе, чтобы добавить в HTML5 возможность делать ____ без фреймворка.

В: Но ____ не фреймворк, это библиотека!

О: Да, как я уже сказал, есть градиент от gist до фреймворка, и вы можете видеть всё немного иначе, чем я. Это нормально, я не про классификацию какой-либо конкретной части программного обеспечения, речь идет об отдалению от фреймворков.

В: Я делал это годами с помощью ____ и ____ и ____.

О: Опять же, это не вопрос, но всё равно, это хорошо, вы должны быть в хорошей форме, чтобы помочь всем остальным.

В: Таким образом, каждый должен переписать выпадающие меню, вкладки, ползунки и переключатели сам?

О: Абсолютно нет, дело в том, что должен быть способ, чтобы создать те элементы таким образом, чтобы не требовалось установки фреймворка.

В: Чувак, все эти HTML Imports скажутся на производительности сайтов

О: Если вы используете все это бездумно, то да. Вот, почему я указывал на необходимость инструментов, компилирующих и сжимающих HTML, CSS, и JS.

В: Так что я не должен использовать никакие библиотеки?

О: Нет, это не то, что я сказал. Я был очень осторожен с разграничением библиотек и фреймворков. Библиотека обеспечивает ортогональный кусок функциональности, которая может быть использована с другими библиотеками. Библиотеки - это хорошо. А вот фреймворки требуют 100% того, от чего, по моему мнению, стоит отказаться.

В: Но мне нравится связывание данных!

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

Оригинальная статья: No more JS frameworks Статью вычитывали:

В поисках полезных JavaScript фреймворков и библиотек? Ознакомьтесь с нашим обзором и выясните, что именно подойдет для вашего проекта.

JavaScript (JS) – один из самых популярных ЯП во всем мире. Веб-разработчики активно используют JS для проектирования, анимации и создания веб-страниц. Наряду с HTML и CSS, JavaScript может сворачивать горы, а именно делать веб-страницу интерактивной и максимально интересной для пользователей.

JavaScript не ограничивает себя. Вместо этого он продолжает развиваться. Это наиболее универсальный язык программирования, что подкреплено его способностью разрабатывать приложения для широкого спектра платформ, таких как Android, Windows и iOS.

Основные преимущества JS:

Гибкость – приветствуются изменения.
Надежность – работает и изменяется в соответствии с определенными приоритетами.
Масштабируемость.

Давайте же рассмотрим несколько JavaScript фреймворков и библиотек, которые все так же актуальны в 2018 году.

Vue.js

Плюсы:

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

Минусы:

Система рендеринга предоставляет меньше возможностей для отладки, чем аналогичная система React.
Компонентный подход в React более гибок и очевиден.

Angular

Плюсы:

Разработчики сталкиваются с меньшим количеством ошибок, поскольку привязка данных строится на базе Angular-элементов.
Поддерживаются различные элементы MVC.
Хорошо работает в среде Agile.

Минусы:

Vue проще в плане архитектуры.
API Angular огромное, и нужно разобраться со многими концепциями.

jQuery

Плюсы:

Широко используется благодаря быстрой обработке.
Во всех браузерах ведет себя одинаково.

Минусы:

Множество функций, облегчающих работу с DOM, уже реализованы нативно.

React.js

Плюсы:

Free and Open Source.
Может использовать уже написанный код.
Поддерживает виртуальную функциональность DOM.

Минусы:

Алгоритм Virtual DOM неточный и медленный.
Требуется сложное асинхронное программирование при общении с сервером.

Node.js

Плюсы:

Такие ПО могут работать на нескольких хостах.
Включение быстрых серверов.

Минусы:

Не для «не сквозных» операций.
Без тестов в Node.js делать нечего.

Titanium

Плюсы:

Простота обучения и реализации.
Высокопроизводительная структура.
Для десктопных и мобильных кроссплатформенных ПО.

Минусы:

Не самый эффективный и оригинальный подход к созданию UI, в отличие от того же React.

Ember.js

Плюсы:

Легко настраивается в системе.
Разворачивает большие пользовательские интерфейсы.

Минусы:

Жесткая структура проектов.
Нет стандартного набора UI-элементов.

Назначение
Когда JavaScript только появился, он использовался преимущественно для создания довольно простых эффектов. В последние годы ситуация вокруг JavaScript существенно изменилась: с приходом эры Web 2.0 и AJAX этот скриптовый язык стал тем техническим базисом, на котором строится динамическая и интерактивная часть большинства мировых сайтов. Для упрощения и ускорения разработки подобных больших сайтов стали массово появляться целые платформы на JavaScript, которые представляли собой уже готовые библиотеки с набором стандартных возможностей.

Популярность
Для обзора основных из них попробуем выделить самые известные и распространенные JS-фреймворки. Поскольку вопрос выбора “лучшего” в этой сфере - предмет множественных и ожесточенных споров, мы будем опираться лишь только на цифры и факты.

Итак, выберем 6 ведущих фреймворков по сумме 4 критериев:

наиболее широкой распространенности и популярности;

качественности сопутствующей документации;

показателям производительности;

легкости освоения, логичности и простоты интеграции в сайт.

Все результаты тестирования и опросов по этим критериям приведены ниже в виде диаграмм.

Просто в качестве ремарки к этим результатам добавим, что самые последние и подробные статистические данные по JS-фреймворкам можно найти на этой страничке , а производительность последних версий ведущих фреймворков в режиме реального времени всегда можно измерить и наглядно сравнить или .

Обзор лучших

jQuery

Размер: 155Kb (миним.версия - 72Kb), лицензия: MIT и GNU GPL,
последняя версия: 1.6 (3 мая 2011)
jQuery - самая популярная и распространенная библиотека на JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML. Также jQuery предоставляет удобный API по работе с AJAX. Данный фреймворк один из первых удачно реализовал принцип ненавязчивого JavaScript . Другой секрет популярности этой библиотеки - это реализация очень выдержанного баланса между хорошей функциональностью и при этом удачной попыткой создания достаточно компактного универсального ядра. Если дополнить сюда компромиссную возможность очень просто расширять функциональность базовой библиотеки за счет включения дополнительных плагинов (количество которых сейчас перешло уже за 1000), то на выходе мы получаем по-настоящему очень универсальный, гибкий и быстрый продукт.

Для желающих получить более продвинутые UI-эффекты такие, как масштабирование, сортировка, поддержка drag and drop, и стандартные виджеты, такие как закладки, слайдер, прогрессбар и т.д., рекомендуется использовать родственную библиотеку jQuery UI , которая специализируется именно на графических эффектах и созданию сложного пользовательского интерфейса.

В целом jQuery очень выгоден для малых и средних проектов, но при разработке крупных проектов может быть проблематичен, так как приводит к дефициту проектирования, хотя весьма производителен благодаря простому содержанию и коду.

Digg , BBC , Dell , IsoHunt , Break.com , TinyPic , eMusic , Box.net

Prototype JS

Размер: 278Kb (миним.версия - 56Kb), лицензия: MIT, последняя версия: 1.7 (22 ноября 2010)
Второй по популярности JS-фреймворк, который существенно упрощает работу с AJAX и некоторыми другими продвинутыми JS-возможностями. Несмотря на его доступность в виде отдельной библиотеки, он чаще всего используется программистами вместе с Ruby on Rails, Tapestry, script.aculo.us и Rico. Часто его популярность пытаются объяснить именно близкой интеграцией с распространенным Ruby on Rails (хотя уже рассмотренный jQuery на уровне плагинов также может взаимодействовать со многими популярными платформами, например, с тем же Ruby on Rails или PHP).

С точки зрения проектирования фреймворк очень удобен для средних проектов, так как предоставляет элементарный способ эмулирования классического ООП в добавление к своим простым функциям. Производительность у него несколько нестабильна, т.е. на некоторых операциях он может быть быстрым, на других - производительность заметно падает. Prototype один из немногих фреймворков, который не включает в себя UI-компоненты или UX-улучшения: для использования подобных эффектов рекомендуется использовать его дочернюю библиотеку - script.aculo.us (или Scripty2), которая добавляет огромное количество графических эффектов, поддержку drag-and-drop, слайдеры, AJAX-редакторы и т.д.

Примеры известных сайтов на базе этого фреймворка: CNN , The New York Times , Apple , Fox News Channel , Last.fm , Twitter , Hakia .

Mootools

Размер: 101Kb (миним.версия - 60Kb), лицензия: MIT,
последняя версия: 1.3 (11 октября 2011)
MooTools является модульным, объектно-ориентированным фреймворком. Он очень похож в своем подходе к дизайну ядра на jQuery и Prototype - он не включает в себя UI-контролы и виджеты, ограничиваясь минимальным набором эффектов и возможностей. Но, несмотря на такой здоровый минимализм, этот фреймворк содержит очень интересный плагин MooTools.More.js, который на самом деле несколько больше чем просто плагин: он позволяет очень сильно наращивать возможности сторонними библиотеками, и имеет при этом очень интересные дополнения для манипуляций с массивами, датами, хэшеми, строками и т.д. Нас очень впечатлила возможность локализовать англоязычный синтаксис языка самого mootools на любой национальный язык, что позволяет программировать на нем максимально комфортно, например, на русском языке.

Примеры известных сайтов на базе этого фреймворка: MooTools используется в CMS Joomla, поэтому таких сайтов чрезвычайно много.

YUI

Размер: 31Kb, лицензия: BSD,
последняя версия: 3.3.0 (1 декабря 2010)
Библиотека Yahoo! UI Library (YUI) - это набор утилит и контролов, написанных на JavaScript и CSS, для создания интерактивных web-приложений, использующих техники DOM-скриптинга, DHTML и AJAX. В этом фреймворке доступны два типа компонентов: утилиты и контролы. Утилиты упрощают браузерную разработку, связанную с DOM, DHTML и AJAX. Контролы - это набор уже готовых, высокоинтерактивных визуальных элементов для проектирования веб-страниц. Все эти элементы создаются и работают только на клиентской стороне и не требуют обновление страницы для их изменения. Вся библиотека распространяется под BSD-лицензией и бесплатна для всех пользователей. YUI создана совместными усилиями ведущих инженеров Yahoo, а также разработчиками со всего мира. Сейчас это один из ведущих JS-фреймворков, полностью готовый для промышленного использования, где очень продвинутые UI- и UX-составляющие интегрированы в одно целое в рамках одной поставки, образуя полностью завершенный, независимый и универсальный продукт. Если к этому добавить её очень либеральную лицензию, то понятна та популярность, которую справедливо получила эта библиотека, особенно в коммерческих разработках и многочисленных форках, где она была взята за основу.

Примеры известных сайтов на базе этого фреймворка: Yahoo! Shopping , Bebo , ImageShack , LinkedIn , Walmart.com .

Ext JS

Размер: 502Kb (миним.версия - 84Kb), лицензия: GPLv3 и коммерческая,
последняя версия: 4.0 (26 апреля 2011)
Проект начинался как попытка расширить вышерассмотренный фреймворк Yahoo! User Interface, но на данном этапе - это уже полностью самобытный, практически никак не связанный с YUI проект. Движущей силой, основателем и бессменным лидером проекта остается Джэк Слоцум - известный специалист в среде JavaScript-программистов.

ExtJS - это не самый производительный из существующих фреймворков, а его главная отличительная черта в том, что он предоставляет собой наиболее приближенную среду к классическому программированию, реализуя очень развитые графические средства отображения и взаимодействия с пользователем в среде Web 2.0. Начиная с версии Ext JS 3.0 библиотека логически разбивается на две части: Ext Core (набор JavaScript-функций, позволяющий создавать динамические веб-страницы с унификацией обработки в различных браузерах и распространяемый по MIT-лицензии) и Ext JS (набор виджетов для создания пользовательских интерфейсов с двойным лицензированием по GPL v3 или по коммерческой лицензии).

Более подробно о последней, четвертой версии этого фреймворка мы недавно .

Dojo

Размер: 123Kb (миним.версия - 65Kb), лицензия: BSD и AFL,
последняя версия: 1.6.0 (15 Марта 2011)
Ещё один пример из списка популярных фреймворков, который, кроме того, что во многом повторяет плюсы своих аналогов, имеет и свои особенности. Среди самых важных хотелось бы упомянуть очень серьёзную попытку добиться полной независимости от каждого конкретного JS-интерпретатора, для чего разработчиками проводится просто титаническая работа по тестированию и поиску максимально универсальных и простых решений. Поэтому, как следствие, сфера применения этого фреймворка максимально широка: это не только обычные решения на стороне клиента, но также и на стороне сервера и десктопных компьютеров, - везде, где имеется возможность запуска JavaScript. Вторая важная техническая особенность Dojo - это поддержка дизайна множественности точек входа (Multiple Points Of Entry), что дает ему множество очевидных технических преимуществ. Также хочется упомянуть Dojo Extensions for Adobe AIR , призванный помочь разработчикам применять весь потенциал платформы AIR в приложениях с использованием Dojo Toolkit.

Примеры известных сайтов на базе этого фреймворка: Dogo Toolkit используется в Zend Framework, поэтому таких сайтов чрезвычайно много.

Заключение

JS-фреймворки переживают сегодня очень бурное развитие, например, ещё вчера очень популярный base2 , сегодня уже во многом ушел в тень: буквально каждый месяц появляются все новые перспективные новички и всё более интересные разработки в этой области.

_____

Надеемся, что наша подборка JavaScript-фреймворков поможет вам при создании сайтов , независимо от того, на каком движке вы их разрабатываете.