Ваше вступительное предложение на самом деле было очень хорошим описанием различий между Backbone.js и jQuery, так что давайте немного распакуем его.
Во-первых, две библиотеки вовсе не конкурируют - они дополняют друг друга.
В качестве примера вот что я бы сделал с jQuery:
- Анимированные слайд-шоу
- Улучшения управления формой, такие как числовой "счетчик" в стиле iOS.
- Переключение видимости элементов на основе имени класса
И кое-что, что я мог бы сделать в Backbone.js:
- Создайте фотоальбом, где пользователь нажимает на миниатюру и может просматривать увеличенную версию фотографии вместе с некоторыми данными, такими как использованная камера, местоположение и имя фотографа.
- Создайте страницу типа master / details, которая представляет собой сетку данных и позволяет пользователю нажимать на отдельные элементы и обновлять их в форме.
jQuery выделяется на микроуровне - выбор элементов страницы, сглаживание различий в том, как браузеры обрабатывают события.
Backbone.js - более масштабная картина. Это помогает вам управлять данными и логикой приложения. В приведенном выше примере фотоальбома Backbone предоставляет несколько полезных структур: у вас будет что-то, что будет содержать все данные, связанные с фотографиями (модель), список всех фотографий в альбоме (коллекция) и место для размещения логика, которая определяет, что происходит, когда пользователь щелкает миниатюру (представление). Это основные части элемента управления или приложения Backbone.
Backbone.js использует jQuery или что-то в этом роде, чтобы помочь отображать результаты данных и логики вашего приложения в DOM. Например, часто используется jQuery для выбора элемента на странице, который будет служить контейнером для вашего приложения Backbone. Также часто используется jQuery $(function () {});
для запуска частей вашего элемента управления Backbone. Вы, вероятно, также отобразите сообщения об ошибках проверки полей формы с помощью jQuery.
Вы, безусловно, можете создавать большие и сложные пользовательские интерфейсы в jQuery. У нас есть несколько в приложении, которое я поддерживаю на работе. Но с ними сложно работать, потому что jQuery не предназначен для обеспечения структуры приложения. В частности, API jQuery, основанный на выборе групп элементов и последующей передаче функций обратного вызова, которые манипулируют этими элементами, не является хорошим шаблоном для использования в большом и сложном элементе управления или приложении. В итоге получается много вложенных функций, и очень трудно понять, что происходит.
В настоящее время я переделываю один из этих элементов управления в Backbone.js. В качестве последнего примера приведу краткое изложение того, чем отличается мой мыслительный процесс при работе с одним и тем же элементом управления в обеих разных библиотеках.
В jQuery меня беспокоят:
- Правильно ли я использую селектор, чтобы выбрать нужную группу
li
элементов?
- Нужно ли мне заново заполнять этот список значений после завершения этого вызова Ajax?
- Как я могу вернуть эти значения массива в
input
элементы на странице?
В Backbone я больше сосредоточен на:
- Какова правильная логика для проверки этого набора свойств на моем элементе модели?
- Когда пользователь нажимает кнопку «Добавить», следует ли мне немедленно добавить новый элемент в коллекцию или подождать, пока они заполнят все данные и станут «действительными»?
- Как должен реагировать элемент в моей коллекции, если он был удален непосредственно перед или после его удаления?
jQuery обрабатывает мельчайшие детали, а Backbone - более высокий уровень.
В заключение обратите внимание, что я использовал слова «элемент управления» и «приложение» при обсуждении примеров Backbone.js. Неправда, что Backbone.js предназначен только для одностраничных приложений. Однако верно, что Backbone.js хорош для создания сложных приложений, которые манипулируют данными и обрабатывают большой объем логики. Было бы глупо использовать его для мелкомасштабных элементов пользовательского интерфейса - дополнительная структура, которую он налагает, не требуется.
Обновление: что касается нескольких страниц, да, Backbone предоставляет мощный механизм для сохранения ваших данных. У каждой модели есть save
метод, который будет выполнять вызов AJAX для сохранения изменений на сервере. Итак, пока вы сохраняете свои данные на ходу, у вас может быть многостраничное приложение. Это очень гибкая модель, и поэтому мы, вероятно, в конечном итоге будем использовать Backbone на работе. Хотя мне бы хотелось создать одностраничное приложение, у нас уже 10 лет работы над существующим многостраничным приложением. Мы хотим перестроить некоторые из наших более интенсивных компонентов пользовательского интерфейса в Backbone, а затем синхронизировать изменения с сервером, прежде чем пользователь перейдет на другую страницу.