Шпаргалка по популярным JavaScript-фреймворкам

!_header

JavaScript – объектно-ориентированный скриптовый язык, который уже долговое время является признанным стандартом для программирования на стороне клиентского Web-браузера. В настоящее время сложно представить себе современные интерактивные сайты без этого скриптового языка, поэтому давайте сегодня рассмотрим основные фреймворки, на базе которых разрабатываются сайты.

Оцените:

 создание сайтов


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


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


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



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

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

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

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

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


    JS-рис1


    JS-рис2-qualityOfDocs


    JS-рис3-heavyDuty


    JS-рис4-easeOfImplement


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


    Обзор лучших




    jQuery



    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



    js-Prototype


    Размер: 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



    js-MooTools


    Размер: 101Kb (миним.версия – 60Kb), лицензия: MIT,
    последняя версия: 1.3 (11 октября 2011)

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


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




    YUI



    js-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



    js-ExtJs


    Размер: 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



    js-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-фреймворков поможет вам при создании сайтов, независимо от того, на каком движке вы их разрабатываете.


     


    Оцените:

    Комментарии Facebook

    Комментарии ВКонтакте