Если это звучит как вы, я уверен, что многие из ваших коллег говорили вам попробовать
jQuery Mobile или Sencha Touch, Иногда есть много разногласий по поводу того, какую платформу следует использовать разработчику, но я недавно получил полное изложение плюсов и минусов от встречи группы пользователей, которую я посетил (группа пользователей .NET, но это не оказало большого влияния на широкая актуальность сравнения). Чип Баррис был судьей и судьей этого грандиозного матча в клетке, и он, вместе с другими посетителями, поделился своими взглядами на эти две основы из своего опыта в окопах.
Итак, достаточно разговоров. Давайте перейдем к бою!
Ох, но еще одна вещь …
Хотя я рассматриваю это как «борьбу до смерти», вы должны просто знать, что это руководство по сравнению больше ориентировано на то, чтобы помочь вам выбрать правильное решение для вашей команды и вашего конкретного проекта. Для некоторых из вас Sencha Touch станет победителем в вашем сознании, но для других jQuery Mobile может быть очевидным выбором. Если вы действительно спешите (TL; DR), тогда вы можете перейти к последнему разделу. Но я рекомендую вам просмотреть всю статью и понять, почему Чип и банда пришли к таким выводам. Теперь приступим к реальной борьбе!
Раунд 1
Зрелость, история и лицензия
JQuery Mobile
- Первая Альфа выпущена в октябре 2010
- jQuery Mobile 1.2.1 был выпущен в этом месяце
- Основана на jQuery, поэтому она популярна, широко распространена и легка в освоении при активной поддержке сообщества
- Лицензия GPL или MIT
Сенча Touch
- Первая бета выпущена в июле 2010
- Версия 2.0 вышла 6 марта 2012 года и намного проще в использовании.
- Основано на ext.js 4, у которого были некоторые серьезные разногласия среди сообщества относительно направления и состояния платформы
- ext.js и Sencha Touch оба с открытым исходным кодом, но у них также есть Sencha в качестве коммерческого драйвера
- Имеет GPL или бесплатную коммерческую лицензию.
- Есть платная лицензия SDK
Так что это та часть, где мы выбираем победителя раунда. Я согласился с Чипом, который постановил, что ни у одной платформы нет явного преимущества в целом. «Галстук» был правилом, но, возможно, у вас разные потребности, и вы думали иначе, поэтому следите за своими собственными решениями.
Правила судейства :
TIE
Раунд 2
Особенности интерфейса / возможности
jQuery Mobile
- Главным образом Form-Driven (работает с элементами, а не с графикой)
- Оборачивает большинство элементов HTML
- Выглядит как поле, кнопка, панель с ползунком в приложении
- DEMO
- ГАЛЕРЕЯ
Сенча Touch
- Управляемый графикой (отлично подходит для игр, диаграмм)
- Поддерживает Raphael, потрясающую библиотеку SVG
- Использует JavaScript вместо HTML для разметки, поэтому он может быть немного более гибким
- СОЛИТЭЙР ДЕМО
- ПРИМЕРЫ
Сразу во втором раунде мы начинаем видеть фундаментальные различия между этими двумя системами. Значит ли это, что это сравнение яблок с апельсинами? Конечно, вы можете сказать это, но по сути они оба являются инструментами, используемыми для одной общей цели — для создания мобильных веб-приложений с веб-языками.
Sencha Touch — очевидный выбор, если вы создаете приложение, которое является более сложным, чем приложение на основе форм. Итак, Чип и судьи выбрали Sencha, основываясь на том факте, что он может делать больше, но если вы создаете приложение на основе форм, jQuery станет вашим победителем, поскольку он создаст этот пользовательский интерфейс с гораздо более простым и понятным кодом.
Судья Правила:
Сенча Touch побеждает
Говоря о коде …
Раунд 3
Код
jQuery Mobile
<!DOCTYPE html>
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<meta charset="UTF-8"></meta>
<link type="text/css" rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css">
</link>
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js">
</script>
<title></title>
</head>
<body>
<div data-role="page">
<div data-role="header" data-position="inline">
<h1>Hello World</h1>
</div>
<div data-role="content">It's works!</div>
</div>
</body>
</html>
- Это очень простая форма в HTML (почти нет JavaScript)
- Лучше, если вы не очень хорошо знаете JavaScript
Сенча Touch
Ext.define('MyApp.view.user.List', {
extend: 'Ext.Panel',
alias: 'widget.userlist',
config: {
layout: 'fit',
items: [
{
xtype: 'toolbar',
docked: 'top',
title: 'My User App'
},
{
xtype: 'list',
itemId: 'lstUser',
allowDeselect: false,
store: 'Users',
itemTpl: [
'<div class="user-item">',
'<h2>{FirstName} {LastName}</h2>',
'<small>{Bio}</small>',
'</div>'
]
},
{
xtype: 'toolbar',
docked: 'bottom',
layout: {
pack: 'center'
},
items: [
{
text: 'Settings',
itemId: 'btnSettings'
}
]
}
]
}
});
- Это все JavaScript, который в некоторых случаях может быть более сложным, чем необходимо.
У Чипа были лучшие примеры в презентации, сравнивающие код Sencha Touch и jQuery Mobile, которые бок о бок использовались в форме входа в систему, но они похожи на его примеры. Как вы можете видеть, если это что-то простое, Sencha Touch заставляет его выглядеть немного сложнее, чем должно быть. Это потому, что Сенча собирается попробовать и сделать больше в JavaScript. Таким образом, судьи решили в аналогичном случае использования, jQuery Mobile имеет более простой код.
Правила судейства :
jQuery Mobile выигрывает
Раунд 4
Документация
jQuery Mobile
- Исправлены некоторые вещи, так что вам не нужно «просматривать исходный код» в документации, чтобы выяснить код для создания элементов
- Довольно приличные форумы
- Большая общественная информация и помощь доступны с различных сайтов и книг.
Сенча Touch
- Документация гораздо более организована, чем jQuery, с множеством видео и примеров (и функцией поиска!)
- Активные форумы, но вопросов гораздо больше, чем ответов
- Некоторые сторонние варианты поддержки там
- Варианты коммерческой поддержки
Чип оценил новые и улучшенные документы jQuery Mobile как «чуть выше отстой», но, по крайней мере, поддержка сообщества jQuery Mobile так же сильна, как и основное сообщество jQuery. Документы Sencha Touch, для сравнения, безупречны. Это, вероятно, результат наличия коммерческого покровителя.
Правила судейства :
победа Сенча Touch
Раунд 5
Скорость!
jQuery Mobile
- Быстрее с каждой итерацией, но некоторые анимации по-прежнему заикаются.
- Браузер Android все еще может вызывать заикания при изменении страницы. Вероятно, это больше связано с самим браузером, поскольку есть другие известные проблемы
- Меньше проблем в Chrome для Android
- Требуется время, чтобы внести в библиотеку jQuery
Сенча Touch
- Загрузка приложения может быть немного медленной
- После загрузки это быстро, время загрузки может увеличиться
- Иногда это даже кажется быстрее, чем родные приложения
- Такие вещи, как слайдеры и другие анимации, во многих случаях гораздо более плавные, чем jQuery.
Я слышал пару жалоб по сети о том, как jQuery обрабатывает прокрутку и ползунки, но я также слышал сообщения о том, что он прекрасно справляется с длинными прокрутками, так что, возможно, это зависит от навыков программиста. Во всяком случае …
Правила судьи:
Сенча Touch Touch выигрывает
Раунд 6
Поддержка устройства
jQuery Mobile
- Большой профиль совместимости браузера, который включает в себя win phone, bada и другие, которые нам откровенно не важны
- Это даже работает в Windows 8 UI
Сенча Touch
- Работает только с WebKit (без Windows Phone)
- Планирование поддержки Windows Phone в будущем, но это может означать капитальный ремонт
Sencha Touch в некотором роде привязан к WebKit, но, честно говоря, пока они работают на iPhone, Blackberry и Android, это основная часть потребительского рынка. Тем не менее…
Правила судейства : jQuery Mobile выигрывает
Раунд 7
Расширяемость, Плагины, Общественные библиотеки
jQuery Mobile
- Множество сторонних расширений — как и следовало ожидать от сообщества jQuery
- Расширения легко сделать
- Может использоваться с адаптивной сеточной системой, такой как 960.gs или даже с загрузчиком Twitter
Сенча Touch
- Довольно закрытый прямо сейчас, замышленный для интеграции (Рафаэль — одна исключительная интеграция)
Снова, казалось, что победитель здесь был ясен …
Правила Судьи: jQuery Mobile Wins
Раунд 8
Архитектура
jQuery Mobile
- Нет установленной архитектуры (если вы не считаете страницы архитектурой)
- Как мы уже видели, в отличие от Sencha, jQuery Mobile основан на макете. Это дает вам свободу делать все, что вы хотите.
Сенча Touch
- Версия 2 имеет сильный паттерн MVC.
- Код находится в нескольких файлах .js с загрузкой HTML-страницы.
Это было не очень хорошее сравнение, поэтому Чип просто решил, что Сенча был здесь победителем, потому что у jQuery действительно нет архитектуры. Но свобода jQuery Mobile хороша, поэтому, если вы не согласны, это понятно.
Правила судейства : победа Сенча Touch
Раунд 9
Инструменты и родные обертки
jQuery Mobile
- Больше генераторов для jQuery Mobile и тематический ролик
- PhoneGap дружественный, но пока не чувствует себя нативным
Сенча Touch
- Sencha делает продукт под названием Sencha Architect
- PhoneGap Friendly
- 2.0 имеет родные обертки для iOS и Android
- Темы могут быть построены с SASS или Compass
Победитель здесь действительно зависит от того, ищете ли вы более дружественное решение PhoneGap или вы ищете больше генераторов.
Правила судейства : TIE
Раунд 10
Интеграция в стек MS MVC (пропустите этот раздел, если вы не являетесь разработчиком .NET)
jQuery Mobile
- Это просто HTML с некоторыми атрибутами данных
- Microsoft, похоже, очень нравится
Сенча Touch
- Может встраивать код Sencha Touch в CSHTML-страницу, но быстро становится ужасно
- Хорошо работает с веб-API
- Вы могли бы написать код Razor для генерации JavaScript (хрен)
Помните, что это была группа пользователей .NET? Что ж, это было довольно важное сравнение с ними, поэтому, если вы также являетесь пользователем .NET, мы надеемся, что это ответит на некоторые вопросы о том, как эти платформы работают с ASP.NET и так далее.
Правила судейства : jQuery Mobile выигрывает
Раунд 11
Различение jQuery Mobile и Sencha Touch
Обе рамки
- Сильная поддержка AJAX / JSON
- Зрелые и хорошо поддерживаемые
- PhoneGap совместимый
jQuery Mobile
- В основном на основе тегов HTML. Может использоваться с очень небольшим знанием JavaScript.
- Не много свободы во взгляде и ощущениях
- Размах и жесты не запекаются. Могут быть добавлены, но чувствуют себя неловко.
Сенча Touch
- Heavy JS, не использует теги HTML
- может сойти с ума с пользовательским интерфейсом
- Размах и жесты работают
Окончательное решение (раздел о выплатах)
jQuery Mobile
Добро
- Любит Knockout.js
- Хорошая поддержка плагинов
- Легко отлаживать
- Если вы знаете HTML, вы можете сделать это
Плохо
- Может быть медленным
- Поддержка жестов может быть сложной для реализации
- Документы могут быть нечеткими и неправильными
- Довольно заперт в форме / кнопке
Твердая победа, если вы …
- Создание нормального бизнес-приложения
- Нужна тесная интеграция с MVC / Razor, WebForms или эквивалентом, отличным от .NET
- Использование его для интранета или экстранета
- Не очень опытный в JavaScript
Сенча Touch
Добро
- Дайте гораздо лучший родной опыт
- Быстро
- Хорошая поддержка касаний и жестов
- Очень гибкий
- Удивительно хорошая документация
- Хороший пакет графиков (так что он отлично подходит для графиков)
Плохо
- Сложный код, если вы плохо разбираетесь в JavaScript
- Коммерческое юридическое лицо контролирует это (но это потенциально комфорт для некоторых)
- Трудно интегрировать в стек MS (может не быть проблемой для разработчиков, не относящихся к .NET)
Твердая победа, если вы …
- Планирование написания нестандартного UX
- Используя это гибридное приложение, вызывая удаленные сервисы, используя JSON
- Отличный разработчик JavaScript
Уф! Надеюсь, что вы переварили всю эту информацию и у вас есть лучшее представление о том, какую из них вам следует использовать, если возникнет такая необходимость. Если вам интересно, jQuery Mobile был победителем по мнению Чипа и консенсуса Triangle .NET User Group, но они также признали, что может быть много сценариев, в которых Sencha Touch — это путь.
Большое спасибо Чипу Баррису за его потрясающую работу по оценке этих двух инструментов и организации встречи, чтобы проинформировать нас. Вы можете увидеть его слайды для презентации, которые были сделаны с помощью jQuery Mobile.