Издателями в России выступили «Символ-Плюс», что означает (повторюсь за Борисом) высокое качество перевода. Также меня очень порадовала работа научного редактора, который добавил большое количество сносок поясняющих некоторые тонкие моменты, на которых авторы не сделали акцента. Аннотацию можно почитать тут, но она ничем не отличается от аннотаций других книг по Ajax. Я же попробую подробнее описать, какие аспекты рассмотрены в данном издании, для этого пробежимся по содержанию.

• Глава 1. Что такое Ajax? В этой главе рассматривается история термина Ajax, примеры сайтов, использующих эту технологию. Кстати, даже я, читавший ни одну статью с таким названием, нашел для себя несколько новых фактов
• Глава 2. Основы Ajax представляет собой введение в основы Ajax, описываются методы реализации с использованием iframe’ов и XMLhttp, их преимущества и недостатки, варианты применения. Большое внимание уделяется такому важному аспекту как юзабилити. Также показывается удобства работы с кросс-браузерной библиотекой zXMLhttp, разработанной авторами книги (нужно отметить, что действительно удобная вещь для небольших проектов)
• Глава 3. Шаблоны проектирования. Очень важная, на мой взгляд, глава. Мало того, что в ней описываются наиболее часто используемые паттерны Ajax, она дает задуматься о важности глубокого анализа своего проекта на предмет построения более правильного взаимодействия частей отвечающих за реализацию Ajax.
• Глава 4. XML, XPath и XSLT. Это небольшое введение в технологии сопутствующие Ajax, большое внимание уделено кросс-браузерности.
• Глава 5. Синдицирование с использованием RSS и Atom. Описываются история появления и развития технологий распространения информации через Веб, включая RSS и Atom, а также процесс создания и реализации веб-агрегатора RSS/Atom
• Глава 6. Веб-службы. Для меня глава оказалась действительно полезной, так как четко определяет понятия SOAP, REST, WSDL. Также из этого раздела можно узнать о создании веб-службы с помощью ASP.NET и C#, и способ решения проблемы междоменных запросов.
• Глава 7. JSON. Наличие этой главы очень меня порадовало, так как многие авторы, освещающие Ajax тему считают, что XML это единственный формат общения серверной и клиентской частей. Но даже в одном из документов Googl’a по Ajax API, говорится о том насколько удобнее применять JSON в среде работы с JavaScript. Итак, в этой главе будет рассмотрен пример работы Ajax приложения с использованием формата JSON для реализации поля ввода с авто-дополнением (auto-suggestion)
• Глава 8. Виджеты на веб-сайте. Рассмотрены примеры реализации виджета со сводкой новостей, виджета с информацией о погоде, виджета поиска в Сети и поиска по сайту.
• Глава 9. AjaxMail. Самая интересная и полезная глава, рассказывающая о создании законченного веб-приложения с использованием всех приведенных сведений из предыдущих глав (надо сказать, достаточно мощное приложение получается)
• Глава 10. Интегрированные системы Ajax. В этой главе описывается три интегрированных системы: JSPAN для работы c PHP, DWR для работы с Java и Ajax.NET, каждая из которых автоматизирует какую-то часть процесса разработки в Ajax.

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

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме Книги.

Итак чтобы воспользоваться API нужно перейти по урлу http://www.searchmash.com/results/[query], где [query] нужно заменить на интересующий вас запрос. Если задать урл в следующем формате http://www.searchmash.com/results/[query]?i=11&n=10, то вы получите десять результатов запроса начиная с одиннадцатого. Также можно получить результаты по изображениям, видео и блогам:

http://www.searchmash.com/results/images:[query]
http://www.searchmash.com/results/blogs:[query]

http://www.searchmash.com/results/video:[query]

Если вы захотите использовать это API через AJAX, то возможно вам потребуется веб-прокси для создания междоменых запросов.

В PHP можно получить результаты, воспользовавшись библиотекой pear.php.net/pepr/pepr-proposal-show.php?id=198:


$request = 'статьи о AJAX'
require_once("JSON.php");
$json = new Services_JSON();
$full_json_return = $json->decode(implode('',file('http://www.searchmash.com/results/'.urlencode(iconv('cp1251','UTF-8',$request)).'?n=10')));
print_r($full_json_return->result);


© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме Без рубрики.

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме Библиотеки и фреймворки, Без рубрики.

ASP.NET AJAX JavaScript library (она же ”Microsoft AJAX Library”) выпущена под лицензией Microsoft Permissive (Ms-PL). Исходники всех контролов, входящих в ASP.NET AJAX Control Toolkit и разрабатываемые в рамках CodePlex Project были доступны и ранее.

К выходу итогового релизы приурочено и появление Microsoft AJAX Library cheat sheets (как бы корректнее перевести “cheat sheet”? ну не “шпаргалка” же!).

Кроме того, рекомендую почитать очень любопытную статью, касающуюся безопасности в ASP.NET AJAX и еще одну про использование ASP.NET AJAX в Vista sidebar

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме atlas, Microsoft, Библиотеки и фреймворки.

Это перевод статьи Джоана Хуртадо (Juan Hurtado) “GWT Small Guide”. Оригинал доступен на испанском и английском. Возможно перевод получится грубым, так как я очень торопился, буду рад узнать ваше мнение насчет качества перевода.

Потапов Геннадий (TermiT)

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме AJAX, Google, Java, Технологии, Библиотеки и фреймворки.

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме AJAX, atlas, Microsoft, Библиотеки и фреймворки.

Сегодня появился первый публичный релиз проекта “PHP for Microsoft AJAX Library, небольшой библиотечки, которая призвана облегчить использование Microsoft AJAX Library в приложениях, написанных на PHP. Проект открытый, базируется на и выпущен под Microsoft Permissive License.

Пока лишь альфа-релиз, и, при наличии множества конкурирующих библиотек, судьба проекта туманна. В качестве примера приведу код с использованием PHP for Microsoft AJAX Library, работающий с веб-сервисом. По построению на ASP.Net было бы то же самое:

HelloService.php:

< ?php

index.html:

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме AJAX, atlas, Microsoft, Библиотеки и фреймворки.

Ajax — это опасная для веб-разработчиков технология, она способна создать множество проблем как с пользовательским интерфейсом, так и с серверной составляющей и нагрузкой на сервер. Я составил сводный список ошибок разработчиков, использующих Ajax.

Этот список скопирован из моего блога: Alex Bosworth’s Weblog: Ajax Mistakes

Не согласны? Готовы назвать еще одну ошибку? Что ж, эта статья имеет свою страницу на сайте SWiK.net

Так же рекомендую посетить страницу wiki  places to use Ajax

Заметки

Использование Ajax ради Ajax.

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

Поломка кнопки «Назад».

Кнопка «Назад» – огромная функциональная возможность стандартного пользовательского интерфейса веб-сайта. К сожалению, она плохо работает с JavaScript. Сохранение функциональности кнопки «Назад» – главная причина для того, чтобы не делать веб-приложение только на JavaScript.

Отсутствие видимого сигнала о происходящем действии.

Если я кликаю по кнопке, вызывающей Ajax-функцию, вы должны дать мне визуальный сигнал, что что-то происходит. Пример этого – сообщение о загрузке на GMail, расположенное справа вверху. Всякий раз, когда я делаю что-нибудь в GMail, маленький красный прямоугольник в верхнем правом углу показывает, что страница загружается. Он замещает стандартную функцию пользовательского интерфейса браузера – отображение процесса загрузки новой страницы, т.к. Ajax этого не поддерживает.

Оставляя офлайн пользователей позади.

Так как границы применения веб-приложений раздвигаются все шире и шире, вскоре все приложения переместятся в веб. Инициализация, подготовка к работе – лучше, всемирная модель доступа – это здорово, эксплуатация и конфигурация – классная, изучение пользовательского интерфейса – проще и быстрее.

Тем не менее, люди, имеющие нестабильное соединение с Интернетом, или люди, которые не хотят переходить на веб-приложения, должны иметь те же возможности при работе с новым поколением Ajax приложений, что и все остальные. То, что технология передовая, не означает, что люди готовы и желают работать с ней. При проектировании веб-приложений, в крайнем случае, надо предполагать оффлайн доступ. У GMail это POP, Backpackit имеет интеграцию с SMS. В Enterprise это веб-сервисы.

Не заставляйте меня ждать Ajax.

Со вкладками FireFox’а я могу управлять различным задержками на веб-сайтах и обычно я вынужден ждать только загрузки страницы. В случае AJAX-приложения и плохого соединения с Интернетом я могу получить действительно ужасное время взаимодействия с интерфейсом, потому что каждый раз, когда я что-либо делаю, я должен ждать ответа сервера. Помоги мне Боже, если я должен обратиться к диску сервера, прежде чем продолжить. Такие приложения могут даже заставить меня думать, что Ajax — это не круто.

Отправление важной информации в открытом виде.

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

Разработка AJAX приложений – это разработка для одной платформы.

Создание Ajax приложений – это кросс-платформенная разработка. Код Ajax выполняется JavaScript-движком IE, Rhino (JavaScript-движок мозиллы), или другим, менее популярным движком, который, тем не менее, может внезапно стать популярным. То есть, соответствия только со стандартным JavaScript недостаточно, необходимо тестирование для большинства приложений. Большая трудоёмкость создания хорошего Javascript кода вызвана глючностью реализации JavaScript в IE, хотя есть утилиты для облегчения разработки кода JavaScript под IE.

Слишком много кода замедляет браузер.

Ajax представляет возможность сделать JavaScript приложения более интересными. К сожалению, «интересными» часто означает больше выполняющегося кода. Больше кода – больше работы для браузера, а это значит, особенно для некоторых плохо написанных скриптов, что вам нужен более производительный центральный процессор, чтобы функциональность оставалось «живой». Производительность CPU раньше действительно была ограничением функциональности JavaScript, и то, что компьютеры стали быстрее, не означает, что проблема исчезла.

Отсутствие альтернатив для тех, у кого нет или отключен JavaScript.

Согласно статистике W3C по использования браузеров, которая неизбежно показывает перекос в сторону популярных браузеров, у 11 % пользователей JavaScript отключен. Так что, если ваше приложение полностью зависит от JavaScript, вы сразу же теряете десятую часть вашей аудитории.

Изобретение нового в пользовательском интерфейсе.

Главная ошибка, которую легко сделать, используя Ajax: “щелкни по этой непонятной штуке и получи неочевидный результат”. Конечно, пользователи, которые используют приложение некоторое время, могут выучить, что если по этой области кликнуть и удерживать кнопку нажатой, то эту область можно перетащить и оставить на новом месте. Но пока эта возможность не станет общей для большинства пользователей, вы лишь увеличите сложность и время на изучение вашего приложения, а это большой минус для любой программы.

Изменение состояний с помощью ссылок (GET запросы).

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

Неожиданное мигание и изменение элементов страницы.

Первая буква А в Ajax означает асинхронный. Проблема асинхронных сообщений в том, что вполне можно сбиться с толку, когда они вдруг выскакивают. Изменения на асинхронной странице должны происходить в строго определенном месте, и они должны быть ожидаемы. Вспыхивающие и мигающие сообщения, на которых я не хочу концентрироваться, напоминают о html-теге «blink».

Отсутствие ссылок, которые я могу послать друзьям или сохранить в закладки.

Другая великолепная возможность веб-сайтов: я могу переслать ссылки другим людям, и они увидят то же, что вижу я. Ещё я могу сохранить адрес в закладках и позже вернуться к нему. JavaScript и Ajax приложения, могут создать множество проблем при такой схеме использования. Как только JavaScript начинает вместо сервера динамически генерировать страницу, её адрес больше не может использоваться для навигации. Очень нежелательно терять такую возможность, и многие Ajax приложения имеют специально сконструированные ссылки, чтобы избежать этого.

Не применение локальных изменений к другим частям страницы.

Так как Ajax/JavaScript дает вам потрясающий контроль над содержанием страницы, то легко можно сфокусироваться на одной области страницы и совсем забыть об общей картине. Например, заголовок на Backpackit. Если вы меняете заголовок страницы в Backpackit, он немедленно заменяется в правой части страницы, но не меняется главный заголовок (тег title). При работе с Ajax вы должны думать о картине в целом, даже когда делаете локальные изменения.

Асинхронное выполнение групповых операций.

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

Прокрутка страницы и потеря места чтения.

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

Блокирование поисковых машин.

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

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме AJAX, Технологии.

Новая документация включает:

• Tips and Tutorials
• API Reference
• Blog

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме Библиотеки и фреймворки.

О статье
Автор заметки Stoyan Stefanov, он известен своими статьями о PEAR (скорей всего вы сталкивались с его статьей DB to MDB2), MySQL и AJAX. Речь пойдет о раскладке AJAX под MVC (казалось бы, вещь элементарная, но на самом деле легко допустить ошибку) и о мини-фреймворке, который предлагает вам автор. Критика по перевод приветствуется.

AJAX MVC
Это своего рода фреймворк для создания AJAX приложений, основанных на MVC паттерне. Да, я назвал много модных словечек, признаю, но это не должно восприниматься в серьез. Недавно я работал над несколькими небольшими проектами и как-то случайно (это вообще не входило в мои планы), разработал для себя маленький фреймворк. Потом, я заметил, что этот скрипт и его организация схож с MVC. Так как должен быть построен MVC когда мы имеем смесь толстого и тонкого клиента, HTML, JavaScript, XMLHttpRequest, PHP и СSS?

Как обычно работают AJAX приложения:

1. у нас есть HTML страничка, оформленная CSS
2. вы куда ни будь кликаете
3. JavaScript отправляет запрос на сервер (PHP скрипту)
4. JavaScript обновляет содержимое HTML страницы

Реализуем MVC паттерн
Итак, так какая часть будет отвечать за Model (Модель), View (Вид) и Controller (Контроллер)? С Моделью все просто, это бизнес логика: запись в базу и т.п. Модель – PHP скрипт. Вид? Очевидно это HTML страница, оформленная CSS. Надо заметить, что JavaScript, который будет обновлять страницу, тоже часть Вида. Неважно как это реализовано: innerHTML в JavaScript’e или DOM, в любом случае это часть HTML. А что насчет Контроллера? У нас будет два контроллера. Один на серверной части, PHP скрипт который будет получать запросы, и запрашивать у Модели данные. Другой на стороне клиента, JavaScript, который решает, что случится по нажатию кнопки и отправляет соответствующий AJAX запрос PHP контролеру. Поэтому я буду рассматривать любые действия JavaScript, включающие отлавливание событий и отправку HTTP запросов как часть Контролера. Схема:

В действии (пример)
Чтобы оправдать концепцию мы рассмотрим небольшое приложение в качестве примера. Простая HTML страница с кнопкой, оформленная CSS. Она содержит два JavaScript’a отвечающих за события (Контролер) и за обновления страницы (Вид). Также страница будет содержать два вспомогательных JavaScript’а, так как я использую YUI (Yahoo User Interface) библиотеку. JavaScript’овый Контролер будет связан с кнопкой, по нажатию этой кнопки он отправит запрос PHP Контролеру. PHP Контролер (просто switch) разбирает запрос и вызывает соответствующий объект бизнес модели. В нашем случае «объект модели» это простая функция, но вы легко можете ее расширить. Модель возвращает (в JSON формате) ответ, в нашем случае это список установленных расширений PHP. Теперь используя полученные данные, JavaScript Вида обновляет содержимое страницы. Затем Вид вызывает другую функцию из JavaScript’ого Контролера, которая добавляет новые обработчики событий для нового контента. (Оп, тут небольшая ошибочка, было бы лучше, если бы ответы Модели отлавливались JavaScript’овым контролером, который бы активировал обработчики обновления JavaScript’ового вида, в любом случае это легко исправить)

Структура каталогов:

Код для примера
Мы добрались до самого интересного – реализации. Начнем с простого .html страницы, главной части вида.

Index.html:


< ?xml version=”1.1″ encoding=”iso-8859-1″?>
< !DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

Это фрагмент из behaviours.js:

// класс событий
var behaviours = {
phpcontroller: "../controller/switch.php?request=",
// продолжаются behaviour.methods ….
}

// загрузка страницы, добавляем onload событие
YAHOO.util.Event.addListener(
'thebutton', 'click', behaviours.theButtonClick);


Теперь, когда пользователь кликнет по кнопке, вызовется метод behaviours.theButtonClick(), что в свою очередь отправит запрос PHP контролеру и сообщит ему тип запроса: “loadSomething”:

theButtonClick: function(e) {
alert('Ouch! nnOK, I'll make a request for ya, buddy!');
YAHOO.util.Connect.asyncRequest (
'GET',
behaviours.phpcontroller + 'loadSomething',
{success: updates.writeContent}
);
},

PHP контроллер (controller/switch.php) получит запрос, пройдет switch (проверит тип запроса) и вызовет соответствующую (в нашем случае простую) функцию из бизнес модели. Полный код switch.php:


< ?php
// если это запрос
if (empty($_GET[’request’])) {
die();
}
// получить бизнес-логику
include_once ‘../model/business.php’;

// разбор запроса
// и вызов объекта логики
switch ($_GET[’request’])
{
case ‘loadSomething’:
echo loadSomething();
break;
case ‘loadSomeMore’: // не используется, только для примера
echo loadSomeMore();
break;
}
?>


Функция loadSomething() из PHP модели получает список установленных PHP расширений, кодируем в JSON и отправляем назад. Полный листинг ../model/business.php:

< ?php
function loadSomething() {
$extensions = get_loaded_extensions();
return ‘[”‘. implode(’”,”‘, $extensions) . ‘”]’;
}
?>

Если вернуться назад и взглянуть на AJAX запрос, можно увидеть, что в случае успеха, я вызываю метод updates.writeContent(). В ../view/updates.js содержится код обновления исходной html страницы, который создает HTML таблицу с результатами (списком расширений PHP). Потом я хотел прикрепить листенер к новой таблице, но это уже работа JavaScript’ового Контролера. Полный листинг updates.js:

var updates = {
writeContent: function (xmlhttp) {
if (!xmlhttp.responseText) {
alert("I got nothing from the server");
}
var data = eval(xmlhttp.responseText);
var write_to = document.getElementById('content');
write_to.innerHTML = '';

behaviours.updateTableBehaviour();
}
}


(Кстати, чтобы облегчить себе жизнь, при работе с DOM, я использовал свою небольшую утилиту html2dom)

И, наконец, оставшаяся часть JavaScript’ового Контролера (behaviours.js): метод behaviours.updateTableBehaviour(), который добавляет листенер к новой таблице и метод trClick(), который отлавливает клики по этой таблице. По клику просто меняется цвет выбранной строки.

trClick: function (e) {
var target = (e.srcElement) ?
e.srcElement.parentNode : e.target.parentNode;
if (target.tagName == 'TR') {
if (target.className == 'tr-on') {
target.className = '';
} else {
target.className = 'tr-on';
}
}
},
updateTableBehaviour: function () {
var el = document.getElementById('content').firstChild;
YAHOO.util.Event.addListener(
el, 'click', behaviours.trClick);
}

Демо и исходники
• Demo – on-line демонстрация
• Zipped demo – весь исходный код этого примера
• Template – исходный код примера, но часть кода закомментирована, так что вы можете использовать его в качестве шаблона для ваших будущий AJAX проектов. Единственное, что нужно сделать – кинуть YUI в папку _extras/yui.

© AJAX Planet, 2007. | Постоянная ссылка | Комментарии

Интересна эта тема? Посмотрите архив сообщений по теме Библиотеки и фреймворки.