Позвоночник.js и jQuery

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

во-первых, эти две библиотеки вообще не конкурируют-они бесплатны.

в качестве примера, вот некоторые вещи, которые я бы сделал с jQuery:

• анимированные слайд-шоу
• улучшения управления формой, такие как номер iOS-стиля "spinner"
• переключение видимости элементы, основанные на имени класса

и некоторые вещи, которые я мог бы сделать в позвоночника.js:

• создать фотоальбом, где пользователь нажимает на миниатюру и может просматривать большую версию фотографии, а также некоторые данные, такие как камера, которая была использована, местоположение и имя фотографа
• создайте тип страницы master / details, который представляет собой сетку данных и позволяет пользователю нажимать на отдельные элементы и обновлять их в a форма.

jQuery выделяется на микроуровне -- выбор элементов страницы, сглаживание различий в том, как браузеры обрабатывают события.

костяк.js-это более масштабная картина. Это поможет вам управлять данными и логикой приложений. В Примере с фотоальбомом выше Backbone предоставляет несколько полезных структур: у вас будет что-то, чтобы содержать все данные, связанные с фотографиями (модель), список всех фотографий в альбоме (коллекция) и где-то поместить логику, которая определяет, что происходит, когда пользователь нажимает на миниатюру (вид). Это основные части в магистральном управлении или приложении.

костяк.однако JS извлекает выгоду из jQuery или что-то в этом роде, чтобы помочь отобразить результаты данных и логики вашего приложения в DOM. Обычно, например, jQuery используется для выбора элемента на странице, который будет служить контейнером для вашего основного приложения. Это также часто используется в jQuery $(function () {}); чтобы запустить куски вашего Контроль позвоночника. Вероятно, вы также будете отображать сообщения об ошибках проверки поля формы с помощью jQuery.

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

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

в jQuery, я беспокоюсь о:

• Я использую правый селектор, чтобы захватить группу li элементы, которые я хочу?
• нужно ли повторно заполнять этот список значений, когда этот вызов Ajax завершается?
• как я могу поместить эти значения массива обратно в input элементы на странице?

в позвоночнике, я больше сосредоточен на:

• какова правильная логика для проверки этого набора свойств на моем элементе модели?
• когда пользователь нажимает кнопку Добавить, я должен добавить новый элемент в коллекцию немедленно, или я должен ждать, пока они заполнили все данные и это "действительное"?
• как должен реагировать элемент в моей коллекции, когда элемент непосредственно перед или после его удаления?

jQuery обрабатывает мелкие детали, а позвоночник более высокоуровневый.

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

обновление: что касается вопроса о нескольких страницах, да, Backbone предоставляет мощный механизм для сохранения ваших данных. Каждая модель имеет save метод, который выполнит вызов AJAX для хранения изменений на сервере. Так что пока вы сохраняете свои данные, как вы идете, вы можете иметь многостраничное приложение. Это очень гибкая модель, и именно так мы, вероятно, будем использовать Backbone на работе. Хотя я хотел бы создать одностраничное приложение, у нас есть 10 лет работы в нашем существующем многостраничном приложении. Мы хотим перестроить некоторые из наших более интенсивных компонентов пользовательского интерфейса в Backbone, а затем синхронизировать изменения на сервере, прежде чем пользователь перейдет на другую страницу.

Я никогда не слышал о людях, использующих позвоночник.js на нескольких страницах. Это почти всегда какое-то одностраничное приложение.

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

Если у вас уже есть серверный шаблон/представление рендеринга в java, то магистраль.js не для вас. Чтобы получить максимальную отдачу от позвоночника.js вы должны переместить или дублировать часть этого кода в интерфейсе Яваскрипт.

Если вы не хотите делать одностраничное приложение (это просто означает, что приложение без обновления страницы или изменений, но url-адрес все еще может измениться и может выглядеть как многостраничный для пользователя), то вы можете сохранить все свои MVC на сервере, и вам не нужна магистраль.

Edit:

то, что делает магистраль, - это переместить некоторые из материалов MVC, обычно обрабатываемых на сервере, и переместить их на клиент. Для многих людей это означает забыть о сервере и просто написание приложения в виде одностраничного javascript-приложения. Сервер становится просто источником данных JSON/REST. Если вы не готовы сделать это, то костяк.js не так уж и полезен.

Backbone-это MV * framework, а jQuery-инструментарий DOM.

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

jQuery-это надежный API для запроса DOM с обширной поддержкой браузера и ярким сообществом. Он поставляется с обработкой событий, отложенных объектов и анимации.

простая привязка событий с помощью jQuery

// When any <p> tag is clicked, we expect to see '<p> was clicked' in the   console.
$( "p" ).on( "click", function() {
console.log( "<p> was clicked" );
});