Какой HTML-фреймворк 5 для моего приложения
?Сравнение фреймворков, использующих только HTML, JavaScript и CSS для создания приложений.
Они позволяют избавиться от платных услуг, таких как AppStore, и производить приложения и игры для всех компьютеров и мобильных устройств.
Эти фреймворки совместимы с мобильными и работают с Android, iOS, Firefox OS, Windows Phone и прочими... Затем их можно дополнить Кордовой для бэкенда, чтобы получить доступ к таким сенсорам, как акселерометр. Или PhoneGap, или XDK от Intel.
Бенчмарк из 5 фреймворков, предлагающих привязку данных, дает следующий результат: Angular - самый быстрый, за ним следуют Knockout, React, Mithril, Vue.js. Эмбер медленнее всех. Но порядок сложности реализации другой .
Angular.js (от Google/Желе)
В то время как другие решили описать интерфейс в JavaScript и генерировать HTML-код, этот фреймворк, наоборот, описывает приложение целиком в HTML.
Она расширяет HTML-язык для веб-приложений с более полным языком тегов, новыми атрибутами. Это система шаблона, по сути, она черпает вдохновение из Web Components для этого.
Это альтернатива Ember, Backbone или Spine, поэтому способ связать данные с UI и, как Ember, CanJS, позволяет делать это двусторонним путем.
Преимущества Angular на Ember - поддержка модулей на уровне HTML или JavaScript, помощь в отладке. Еще одно преимущество заключается в том, что 70% приложений Google используют Angular, поэтому мы ожидаем, что он будет надежным .
К числу недостатков относятся недостаточная документация, функции, добавленные днем, как в PHP без общего видения, а иногда и несовместимые, но, вероятно, исправленные с версией 2.
Angular 2.0 использует либо язык программирования TypeScript, либо Dart, которые компилируются в JavaScript.
Фреймворк видит, что его поддержка завершена 31 декабря 2021 года. Он продолжит работу, но без новых версий в будущем.
- AngularJS. Он используется несколькими сайтами Google, включая DoubleClick .
- Egghead.io. Учебники для Angular в виде видео, полезные для новичков.
- Ангулар УИ. Виджеты для Angular, такие как Календарь, Географическая карта...
- Изображение справа сделано с помощью Dangle, графического инструмента, основанного на Angular и D3.
React.js (Facebook)
Еще одна альтернатива Angular (но их можно использовать вместе) React была разработана компанией Facebook для создания графического интерфейса больших веб-приложений, которые часто повторно используют одни и те же компоненты. Она использует JSX, производное XML для описания элементов интерфейса. Фреймворк строит внутреннее представление DOM, Virtual DOM, которое позволяет быстрее обновлять и даже избегать использования данных binding. Он может использоваться в сочетании с другими фреймворками, такими как Backbone.
В отличие от других фреймворков этого списка, он основан на принципе «реактивное программирование», в котором последовательное назначение заменяется определениями математического типа, где a = b + c, делает значение «a» зависит от «b» и «c» даже после определения и после последующего изменения значения для b и c. Это позволяет более интуитивно описывать взаимодействия. Но реактивное программирование здесь рудиментарно и сводится к использованию событий JavaScript.
Так что интерес React.js в основном к виртуальному DOM, потому что, чтобы сделать то же самое, что и в чистом JS, у нас более длинный и сложный код.
Начиная с версии 16.8 фреймворк вводит Hook - декларацию состояния, облегчающую взаимодействие с данными сервера.
Среди пользователей React: Netflix, Uber, AirBnB и т. Д.
Vue.js
Еще одна инфраструктура, альтернатива JQuery, React, Angular, обладающая преимуществом простоты. Его уже можно использовать на производстве после нескольких часов обучения. Он имеет шаблон системы, но также может использовать JSX как React. Поддерживает Flux и предоставляет виртуальный DOM как React. Быстрее React, проще Angular или Ember.
Мы выберем фреймворк, если мы хотим начать быстрее и проще, а приложение быстрее, в то время как Angular и React предлагают больше возможностей. Он описывается самими авторами как инструмент решения общих и простых проблем, но сам по себе не достаточно для других.
- Vue.js. Загрузка и презентация.
Backbone.js
Фреймворк Backbone.UI добавляет в Backbone графические компоненты для описания пользовательского интерфейса приложения. Внешний вид такой же простой, как и код, но его можно приукрасить с помощью CSS. На самом деле эти компоненты для многих избыточны с HTML тегами, как кнопки, например, может быть, чтобы облегчить ассоциацию с данными.
Требуется jQuery, Underscore и Laconic.
- Backbone.js. Требуется либо jQuery, либо Zepto.
Ember.js
Ember - фреймворк JavaScript MVC (Model View Control) для HTML-приложений. На сайте не хватает документации, но вы можете найти ее в другом месте. Есть куча подобных фреймворков, включая CanJS и Backbone, которые лучше задокументированы и имеют больше расширений, но имеют несколько интересных функций меньше.
Все они могут работать с Node.js, но Backbone более актуален в этом отношении.
- Emberjs.com. Требуется jQuery и набор виджетов для интерфейса пользователя, например Bootstrap.
Polymer.js (заменен на Lit)
Фреймворк, предложенный Google, для решения проблемы сложности веб-приложений. Эта расплывчатая цель приводит к улучшению модульности и инкапсуляции компонентов приложения. Проверяемая ориентация объекта на уровне приложения. Мы также должны иметь возможность написать минимум кода для выполнения приложения.
То, что здесь называют компонентами, - это новые теги с взаимодействием, предустановленное привязывание данных. Это идет дальше, чем Angular, еще один проект от Google, который добавляет новые атрибуты HTML с автоматическим датированием, так как Polymer опирается на новый бэкенд.
Это практическое применение принципа Web Components, классической ассоциации JavaScript с HTML-тегами для создания элементов приложения, заменяется набором предустановленных компонентов. Например, вместо того, чтобы добавлять JavaScript в текстовую область для создания редактора, в него включается предварительно определенный компонент редактора на основе бэкенда, предоставленного компанией Polymer.
- Кровать. Заменяет полимер .
- X-tags. Аналогичный проект Mozilla, у которой уже есть хранилище готовых к использованию компонентов.
FOAM (от Google)
«Features Oriented Active Modeller» - ответ Google на React от Facebook. Это реактивный JavaScript-фреймворк с моделью, видом, контроллером. Он может генерировать код на любом языке программирования. Модель данных является основой приложения, выполненного с помощью Foam.
- ФОАМ.
- Презентация. (Английский).
WinJS от Microsoft
Фреймворк, который можно использовать с Cordova, Angular и т. Д. Обеспечивает привязку данных и множество функций. Работает с клавиатурой, мышкой, сенсорным экраном. Приложение может работать локально в Windows 10 или онлайн.
- WinJS. Код на GitHub.
Overture.js от Fastmail
Фреймворк JS, который используется мессенджером Fastmail, является фирменным проектом, ставшим открытым в декабре 2014 года. Он позволяет выполнять любое веб-приложение. Плавность Fastmail демонстрирует скорость фреймворка. Он потомок Спруткора, как Эмбер.
- Передышка. Лицензия MIT .
Popcorn.js
API функций видео в JavaScript для добавления плюс к тегу <video>. Разработанный Mozilla, этот API управляет синхронизацией между ходом видео и действием пользователя. В частности, он позволяет перемещаться по содержимому.
Реакт Канвас
Используя Canvas в качестве экранной поверхности, как для текста, так и для виджетов, этот фреймворк удаляет использование DOM и ускоряет работу приложений. Это лучше подходит для графических приложений.
Pdf.js
Документ PDF может отображаться в формате HTML 5 и, в частности, с использованием Canvas для графики. Его можно использовать в качестве плагина на Firefox, но конечной целью было бы сделать его PDF-плеером, встроенным в браузер .
Processing.js
Работает с одноименным визуальным графическим языком на Canvas для создания анимации и онлайн-графики.
Код на языке обработки преобразуется в JavaScript и использует время выполнения для включения в страницу. Особого преимущества в синтаксисе обработки нет, только графические функции.
Two.js
Библиотека 2D-элементов с анимацией. Это может служить заменой анимированным gif, пока они являются простыми изображениями, с преимуществом вектора, включая уменьшенный размер файла. А еще альтернатива Flash - такое впечатление, что ты видишь демо !
Paper.js - еще один фреймворк векторного рисования, он позволяет делать анимацию для офисной работы в Canvas. В его основе лежит инструмент для создания сценариев, изначально созданный для Illustrator.
Другие книжные магазины
- Всадник. Подобно React, приносит привязку данных к интерфейсам и преимущество легкости.
- Брик. Mozilla создает новые HTML-теги 5 (например, Angular, Polymer и совместимые с ним), чтобы получить новые компоненты интерфейса, такие как slider, flip и т. Д.
- HTML 5 Media. Добавляет поддержку видео- и звуковых тегов во все браузеры.
- Если ты хочешь представить в реальном времени график для отображения эволюции чего-то вроде использования процессора, например, библиотека Smoothie готова включить в страницу. Код очень простой и быстрый. Процент использования ЦП на самом деле не является хорошим примером, потому что сам инструмент использует количество мощности! Он делает Explorer Canvas для IE .
- Кендо УИ. Полная библиотека для построения графики с профессиональным видом, на основе jQuery, HTML 5 и CSS 3.
- Майлар. Если вы ищете безопасность и конфиденциальность, MIT предлагает вам этот набор клиент-сервер на основе Meteor, в котором хранятся все зашифрованные данные.
- Фреймворки просмотра. Список функций просмотра, таких как график, временная шкала, сети и т. Д.