Шаблоны AJAX в ASP.NET - Модель одностраничного интерфейса

ОГЛАВЛЕНИЕ

Модель одностраничного интерфейса

Чтобы в полной мере воспользоваться AJAX, все компоненты, или по крайней мере большинство из них, должны находиться на одной странице. Это называется моделью одностраничного интерфейса (SPI). В модели SPI все взаимодействия обозревателя с веб-приложением происходят в пределах одной страницы. Это революционный подход для Сети, но обычный в разработке для Windows® и рабочих сред. В конечном счете, модель SPI в точности подобна приложению Windows с основным (и единственным) окном.

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

 

Рис. 3 Элементы одностраничного интерфейса внутри страницы

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

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

Для создания чистых приложений AJAX необходимая хорошая библиотека элементов интерфейса пользователя для предоставления эффектов и специальных поведений. Необходима насыщенная и настраиваемая объектная модель документов (DOM), использующая стандартную модель DOM консорциума WWW W3C) в качестве нижележащего механизма, но позволяющая пользователю определить собственную модель для конкретного приложения. Наконец, необходима платформа сервера и клиента для быстрой разработки пользовательского интерфейса и вспомогательных сценариев. В идеале, следует также иметь средства для отладки и тестирования всего этого.

Корпорация Майкрософт и другие поставщики предоставляют некоторые из этих частей. Имеется несколько библиотек с элементами оформления интерфейса пользователя, из которых можно выбирать, и есть поставщики, производящие элементы управления, которые определяют собственные объектные модели на стороне клиента. Здесь могла бы серьезно помочь улучшенная платформа AJAX, специально разработанная как альтернатива веб-формам и вдохновленная моделью SPI.

Одной из таких альтернативных моделей программирования является инфраструктура модель-представление-контроллер (MVC), которую можно найти в библиотеке расширений ASP.NET 3.5. Но в своей текущей форме она мало чем может поделиться с AJAX, и, поскольку она не делает ненужной реализацию любой из функций AJAX, то не кажется разработанной с расчетом на эволюцию в модель SPI. Но посмотрим, что будет дальше.

В модели SPI основная страница указывает на конечные точки HTTP в том же приложении. Она исполняет удаленный код, но не перезагружает всю страницу. Кроме того, она обновляет интерфейс пользователя, используя элементы управления, создающие и HTML, и сценарий. И эти элементы управления могут быть достаточно «умными» для создания большей части требуемого ими кода JavaScript. Например, представьте себе форму, используемую для заказа билета на самолет, с двумя возможными параметрами для поиска: временем или стоимостью. Если пользователь более заинтересован в самом дешевом авиарейсе, то нет нужды отображать раскрывающийся список с часами. Если пользователю нужно вылететь в определенное время, то необходимо создать код HTML, отображающий часы.

Очевидно, что этот фокус с показом/сокрытием можно легко проделать, применив немного кода JavaScript. Однако в наше время разработчик страницы несет ответственность за написание этого кода. Элементы управления, такие как элемент управления CollapsiblePanel из библиотеки ASP.NET AJAX Control Toolkit (asp.net/AJAX/AjaxControlToolkit/Samples/CollapsiblePanel/CollapsiblePanel.aspx), также могут проделать это.