ТЕХНОЛОГИЯ WEB 2. 0, AJAX, GWT - Студенческий научный форум

IX Международная студенческая научная конференция Студенческий научный форум - 2017

ТЕХНОЛОГИЯ WEB 2. 0, AJAX, GWT

Ильина О.С. 1
1Балаковский инженерно-технологический институт – филиал федерального государственного автономного образовательного учреждения высшего образования «Национальный исследовательский ядерный университет (МИФИ)»
 Комментарии
Текст работы размещён без изображений и формул.
Полная версия работы доступна во вкладке "Файлы работы" в формате PDF
ВВЕДЕНИЕ

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

Но все эти страницы были бедны на оформление, состояли в основном из страниц, без оформления какого-либо CSS стиля (который на тот момент редко использовался), с прикреплёнными на них текстами и ссылками на файлы или очередные текстовые странички.

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

И необходимые технологии появились, появился новый стандарт, оформления страниц, в который входит много стилей и элементов управления, и технологии для создания этих страниц, без лишней нагрузки на сети, такие как Web 2.0, AJAX, GWT.

1. WEB 2.0

Web 2.0 – это методика проектирования систем, которые путём учёта сетевых взаимодействий становятся тем лучше, чем больше людей ими пользуются. Особенностью веб 2.0. является принцип привлечения пользователей к наполнению и многократной выверке информационного материала.

Определение Тима О’Рейлли нуждается в уточнении. Говоря «становятся лучше», имеют в виду скорее «становятся полнее», то есть речь, как правило, идёт о наполнении информацией, однако вопросы её надёжности, достоверности, объективности не рассматриваются.

По сути, термин «Web 2.0» обозначает проекты и сервисы, активно развиваемые и улучшаемые самими пользователями: блоги, вики-проекты, социальные сети и так далее [1,3].

Появление названия Веб 2.0 принято связывать со статьей «Tim O’Reilly - What Is Web 2.0» от 30 сентября 2005 года, впервые опубликованной на русском языке в журнале «Компьютерра» (№ 37 (609) и 38 (610) от 14 и 19 октября 2005 года соответственно) и затем выложенной под заголовком «Что за…» веб-сайтом «Компьютерра online».

В этой статье Тим О’Рейлли увязал появление большого числа сайтов, объединённых некоторыми общими принципами, с общей тенденцией развития интернет-сообщества, и назвал это явление Веб 2.0, в противовес «старому» Веб 1.0.

Несмотря на то, что значение этого термина до сих пор является предметом многочисленных споров, те исследователи, которые признают существование Веб 2.0, выделяют несколько основных аспектов этого явления. Первым, кто употребил словосочетание Web 2.0, стало издательство O’Reilly Media, специализирующееся на информационных технологиях. Произошло это в 2004 году. Немного позже глава издательства Тимоти О’Рейлли сформулировал часть принципов Web 2.0. За прошедшее время сфера Web 2.0 расширилась, вытесняя традиционные Web-сервисы, получившие название Web 1.0 [1,3].

Web 2.0 не является технологией или каким-то особым стилем Web-дизайна. Для определения сути подходит определение Web 2.0 как комплексного подхода к организации, реализации и поддержке Web-ресурсов.

«Web 2.0» не является новой версией «Всемирной паутины», а лишь продолжает использовать технологии и концепции «Web 1.0». Многие из идей Web 2.0 уже встречались в сети задолго до того, как возник термин Web 2.0. Например, сайт Amazon.com позволяет пользователям писать рецензии и руководства с момента своего создания в 1995 году.

Понятие Веб 2.0 также отразилось и в дизайне. Предпочтительными стали округлость, имитация выпуклых поверхностей, имитация отражений на манер глянцевого пластика современных hi-end устройств (к примеру, плееры). В целом, восприятие внешнего вида на глаз кажется более приятным. Графика таких сайтов занимает больший объём, нежели при использовании аскетичного дизайна. Отчасти эта тенденция связана с совпавшим по времени выходом новых версий операционных систем, использующих вышеупомянутые идеи. Наряду с графикой, в Веб 2.0 появилась тенденция значительно увеличивать размеры шрифтов по значимости содержания, особенно для заголовков, чтобы чётче выразить их на фоне пёстрого графического оформления, так же предоставляя текстовому наполнению больше пространства.

Однако однообразие таких сайтов явно, и в последнее время графический облик классического дизайна веб 2.0 считается устаревшим и не креативным. Особенно это отражается в современной тенденции создания информативных сайтов, где главную роль играет простота, изящество, графичность и юзабилити [1,3].

1.1 Web-службы

Веб-службы - это программы, доступ к которым осуществляется через Веб (то есть протокол HTTP), а обмен данными происходит в формате XML или JSON, используя один из трёх наиболее распространённых архитектурных стилей проектирования приложений: RPC, SOAP или REST. В результате программное обеспечение может использовать веб-службы вместо того, чтобы самостоятельно реализовывать требуемую функциональность (например, проверить введённый в форме почтовый адрес). В отличие от обычных динамических библиотек, такой подход обладает рядом плюсов:

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

  • Инструменты для работы с HTTP и XML есть в любом современном языке программирования, поэтому веб-службы переходят в разряд платформонезависимых.

Веб mash-up (дословный перевод - «смешение») — сервис, который полностью или частично использует в качестве источников информации другие сервисы, предоставляя пользователю новую функциональность для работы. В результате такой сервис может становиться также новым источником информации для других веб mash-up сервисов. Таким образом образуется сеть зависимых друг от друга сервисов, интегрированных друг с другом.

Например, сайт по поиску недвижимости с интегрированными картами Google Maps в итоге представляет собой новый, более удобный сервис, с помощью которого каждый пользователь может сразу увидеть все предлагаемые для продажи дома на карте [1,3,4].

1.2 Недостатки Web 2.0

Пользование web 2.0 подразумевает высокую степень зависимости от сервисов сторонних производителей:

  • зависимость сайтов от решений сторонних компаний, зависимость качества работы сервиса от качества работы многих других компаний;

  • слабая приспособленность нынешней инфраструктуры к выполнению сложных вычислительных задач в браузере;

  • уязвимость конфиденциальных данных, хранимых на сторонних серверах, для злоумышленников (известны случаи хищения личных данных пользователей, массовых взломов учётных записей блогов);

  • серьёзнейшим недостатком сайтов web 2.0, где контент касается социально-значимых вопросов и допускаются пользователи под псевдонимами и анонимно, все чаще становится «затопление вздором» (английский термин BS-flooding).

Фактически сайт эпохи Веб 2.0 на первый взгляд интерактивен и дружелюбен, позволяет себя легко настраивать. Однако сбор статистики о пользователях, их предпочтениях и интересах, личной жизни, карьере, круге друзей могут помочь владельцу сайта манипулировать сообществом. По самым пессимистичным прогнозам, многочисленные сайты Веб 2.0 вкупе с другими современными технологиями дают прообраз тоталитарной системы «Большого брата» [1,3,4].

2. AJAX

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

Впервые термин AJAX был публично использован 18 февраля 2005 года в статье Джесси Джеймса Гарретта (Jesse James Garrett) «Новый подход к веб-приложениям». Гарретт придумал термин, когда ему пришлось как-то назвать новый набор технологий, предлагаемый им клиенту [1,2].

Однако в той или иной форме многие технологии были доступны и использовались гораздо раньше, например в подходе «Remote Scripting», предложенном компанией Microsoft в 1998 году, или с использованием HTML-элемента IFRAME, появившегося в Internet Explorer 3 в 1996 году.

AJAX стал особенно популярен после использования его компанией Google в сервисах Gmail, Google Maps и Google Suggest.

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

  • использование технологии динамического обращения к серверу «на лету», без перезагрузки всей страницы полностью, например с использованием XMLHttpRequest (основной объект);

  1. через динамическое создание дочерних фреймов;

  2. через динамическое создание тега .

  3. через динамическое создание тега , как это реализовано в Google Analytics.

  • Использование DHTML для динамического изменения содержания страницы;

Действия с интерфейсом преобразуются в операции с элементами DOM, с помощью которых обрабатываются данные, доступные пользователю, в результате чего представление их изменяется. Здесь же производится обработка перемещений и щелчков мышью, а также нажатий клавиш. Каскадные таблицы стилей, или CSS (англ. CascadingStyleSheets), обеспечивают согласованный внешний вид элементов приложения и упрощают обращение к DOM-объектам. Объект XMLHttpRequest (или подобные механизмы) используется для асинхронного взаимодействия с сервером, обработки запросов пользователя и загрузки в процессе работы необходимых данных.

Три из этих четырёх технологий - CSS, DOM и JavaScript – составляют DHTML. По мнению некоторых специалистов (книг),средства DHTML, появившиеся в 1997 году, подавали большие надежды, но так и не оправдали их.

В качестве формата передачи данных могут использоваться фрагменты простого текста, HTML-кода, JSON или XML [1,2].

2.1 Преимущества AJAX

Экономия трафика: Использование AJAX позволяет значительно сократить трафик при работе с веб-приложением благодаря тому, что вместо загрузки всей страницы достаточно загрузить только изменившуюся часть или вообще только получить/передать набор данных в формате JSON или XML, а затем изменить содержимое страницы с помощью JavaScript [1,2].

Уменьшение нагрузки на сервер: При правильной реализации AJAX позволяет снизить нагрузку на сервер в несколько раз. В частности, все страницы сайта чаще всего генерируются по одному шаблону, включая неизменные элементы («шапка», «навигационная панель», «подвал» и так далее) для генерации которых требуются обращения к разным файлам, время на обработку скриптов (а иногда и запросы к БД) - всё это можно опустить, если заменить полную загрузку страницы генерацией и передачей лишь содержательной части.

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

Ускорение реакции интерфейса: Поскольку загрузка изменившейся части значительно быстрее, то пользователь видит результат своих действий быстрее и без мерцания страницы (возникающего при полной перезагрузке).

Почти безграничные возможности для интерактивной обработки: Например, при вводе поискового запроса в Google выводится подсказка с возможными вариантами запроса. На многих сайтах при регистрации пользователь вводит имя, и сразу же видит, доступно это имя или нет. AJAX удобен для программирования чатов, административных панелей и других инструментов, которые выводят меняющиеся со временем данные [1,2].

2.2 Недостатки AJAX

Отсутствие интеграции со стандартными инструментами браузера: Динамически создаваемые страницы не регистрируются браузером в истории посещения страниц, поэтому не работает кнопка «Назад», предоставляющая пользователям возможность вернуться к просмотренным ранее страницам, но существуют скрипты, которые могут решить эту проблему.

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

Динамически загружаемое содержимое недоступно поисковикам (если не проверять запрос, обычный он или XMLHttpRequest): Поисковые машины не могут выполнять JavaScript, поэтому разработчики должны позаботиться об альтернативных способах доступа к содержимому сайта.

Старые методы учёта статистики сайтов становятся неактуальными: Многие сервисы статистики ведут учёт просмотров новых страниц сайта. Для сайтов, страницы которых широко используют AJAX, такая статистика теряет актуальность [1,2].

Усложнение проекта: Перераспределяется логика обработки данных - происходит выделение и частичный перенос на сторону клиента процессов первичного форматирования данных. Это усложняет контроль целостности форматов и типов. Конечный эффект технологии может быть нивелирован необоснованным ростом затрат на кодирование и управление проектом, а также риском снижения доступности сервиса для конечных пользователей.

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

Проблемы с отображением нестандартных кодировок в некоторых сценариях ajax-скриптов: О проблемах AJAX и кириллицы много сказано в обсуждениях в Интернете.

Низкая скорость при грубом программировании: Казалось бы, AJAX предназначен именно для повышения скорости. Но, когда AJAX-запросов на одной странице много и, например, по каждому щелчку подгружается список, AJAX-страница становится даже медленнее традиционной.

Плохое поведение на ненадёжных соединениях: Если связь часто теряется (из-за потери несущей или перегрузки канала), обычную страницу можно как минимум перезагрузить. AJAX-страницу (например, с «бесконечной» прокруткой) приходится перезагружать с самого начала и искать, где остановился. Параллельная работа - особенность AJAX — здесь оказывает медвежью услугу, делая и без того узкий канал на множество маленьких соединений, и велика вероятность, что какое-то будет разорвано. Частично решается API истории [1,2].

3. GWT

Google Web Toolkit (GWT) - свободный Java-фреймворк, который позволяет веб-разработчикам создавать Ajax-приложения. Его особенность - это компилятор Java, JavaScript, позволяющий почти всю разработку клиента и сервера реализовать на основе Java и лишь на последнем этапе создать соответствующие JavaScript, HTML и CSS. Выпускается под лицензией Apache версии 2.0. GWT делает акцент на повторное использование и кросс‐браузерную совместимость.

Используя GWT, разработчики могут быстро писать и отлаживать AJAX приложения на языке Java, используя инструментарий отладки Java. Компилятор GWT переведёт код Java приложения соответствующему браузеру JavaScript, HTML и CSS.

Кроме того, GWT оснащен XML парсером, поддержкой интернационализации, интерфейсом для удаленного вызова процедур, интеграцией JUnit и небольшим пакетом виджетов для разработки элементов графического интерфейса пользователя (GUI). Они могут быть созданы аналогично тому, как это делается с помощью пакета Swing.

Отладка GWT-приложения разделена на две части: отладка серверной части приложения осуществляется как отладка обычного Java web-приложения, для отладки клиентской части понадобится gwt dev-plugin для браузера.

Утилита командной строки webAppCreator, поставляемая вместе с GWT, автоматически создает все файлы, необходимые для нового GWT-проекта. Она также позволяет создавать файлы проекта Eclipse[1].

3.1 Особенности GWT

К особенностям GWT относятся:

  • Избегается повторная реализация одних и тех же графических интерфейсов для локальных и для веб-приложений с помощью различных технологий, например - RCP для первых и JSF - для вторых.

  • Обычная схема – «stateless клиент / stateful сервер» может быть заменена схемой «stateful клиент / stateless сервер». Это позволяет больше реакций пользователя обрабатывать непосредственно в клиенте.

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

  • Для передачи сложных данных может использоваться как стандартный RPC - передаче подлежат сериализируемые Java-объекты, так и тексты на XML или JSON [1].

  • Динамические и многоразовые компоненты пользовательского интерфейса (виджеты): Программисты могут использовать заранее разработанные классы для реализации трудоемких элементов динамического поведения, таких, как drag-and-drop, или сложных визуальных структур.

  • Управление историей браузера

  • Поддержка полнофункциональной Java отладки

  • GWT устраняет некоторые кросс-браузерные проблемы разработки.

  • JUnit-интеграция

  • Поддержка интернационализации и локализации

  • Поддержка HTML Canvas (с учётом изменений API)

  • Разработчики могут вставлять готовые JavaScript-фрагменты в исходный Java-текст, применяя JavaScript Native Interface (JSNI).

  • Поддержка использования Google API Gears в приложениях GWT

  • Программное обеспечение с открытым исходным кодом

  • Разработчики могут проектировать и разрабатывать приложения в чистом объектно-ориентированном стиле, так как они используют Java (вместо JavaScript). Обычные JavaScript-ошибки, такие, как опечатки и несоответствие типов, обрабатываются во время компиляции.

  • JavaScript, генерируемый GWT-компилятором, может быть разделен на фрагменты. Это не только дает возможность лучше понимать его, но и экономит время загрузки приложения - первый фрагмент может начать работать, не дожидаясь пока весь JavaScript текст будет загружен [3]

  • Ряд библиотек доступны для GWT, от Google или третьих лиц. Это расширяет функциональные возможности GWT[1].

3.2 Компоненты GWT

Основные компоненты GWT:

  • Компилятор Java->JavaScript (GWT Java-to-JavaScript Compiler): Переводит Java код в JavaScript.

  • Отладчик (браузер, GWT Development Mode): Позволяет запускать GWT приложения в режиме отладки (ранее назывался "hosted"; приложения запускаются как Java код в JVM без компиляции в JavaScript).

  • Библиотека эмуляции JRE классов (JRE emulation library): Реализация часто используемых стандартных Java классов на JavaScript.

  • Библиотека графических элементов (GWT Web UI class library): Множество пользовательских интерфейсов и классов для создания виджетов.

  • Веб-сервер: Tomcat или Jetty [1].

ЗАКЛЮЧЕНИЕ

Сдвиг от Web 1.0 к Web 2.0 особенно заметен в результате технологических улучшений, которые включали такую адаптацию Интернет-технологий как широкополосная сеть, улучшенные браузеры, Ajax, увеличение платформ приложений Flash и массовому развитию виджетов (такие как Flickr и значки YouTube).

Помимо технологических корректировок Интернета, переход от Web 1.0 к Web 2.0 является прямым результатом изменений в поведении тех, кто использует Всемирную Паутину.

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

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

СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ

  1. Википедия – Свободная энциклопедия [Электронный ресурс]. - ru.wikipedia.org. – (дата обращения 30.11.2016)

  2. Викиучебник [Электронный ресурс]. – ru.wikibooks.org. – (дата обращения 01.12.2016)

  3. Хабрахабр [Электронный ресурс]. - habrahabr.ru. – (дата обращения 30.11.2016)

  4. Creative Solutions [Электронный ресурс]. – www.creasol.ru. – (дата обращения 03.12.2016)

Просмотров работы: 718