Для створення динамічних сторінок було розроблений цілий ряд технологій — JavaScript, Java Апплети, AdobeFlash, MicrosoftSilverlight. Реалізації деяких з них інтегровані в браузери (JavaScript), для роботи з іншими потрібно підключати спеціальні плагіни (доступні безкоштовно на Web-сайтах розробників або поставляються разом з операційними системами чи браузерами).
В середині 90х років розгорнулось боротьба між розробниками найбільш популярних (на той час) браузерів — NetscapeNavigator та MicrosoftInternetExplorer за ринок інтернет-браузерів. Основний спосіб боротьби — розробка та впровадження нових технологій, що були не сумісні з іншими браузерами. В результаті навіть на сьогоднішній день не вдалося досягти повної сумісності між усіма браузерами, хоча їх розробники та консорціум W3C, який займається стандартизацією Web-технологій, докладають максимум зусиль для цього.
З іншого боку, в результаті цієї боротьби, з’явився ряд технологій, що займають ключову роль в розвитку сучасного Web, серед них — JavaScript та Ajax. Зараз важко знайти сайт, побудований згідно принципів Web 2.0, який би не використовував Ajax або JavaScript.
2.2 Загальнi вiдомостi про Ajax
Ajax — група методів Web-розробки, що використовуються для створенняWeb-програм з багатими можливостями та мережевою взаємодією, що базується на «фоновому» обміні даними браузера з Web-сервером. В результаті сторінка не перезавантажується повністю і Web-програма стає швидкою та зручною.
Ajax це не самостійна технологія, а скоріше концепція використання декількох суміжних технологій. Ajax базується на двох основних принципах: використання технології взаємодії із сервером за допомогою JavaScript об’єкта XMLHttpRequest без перезавантаження усієї сторінки використання DHTML для динамічної зміни вмісту сторінки та реагування на дії користувача
Для передачі даних від сервера до клієнта використовуються формати XML або JSON. Класична модель web-програм пов’язана не лише з використанням базових web-технологій, а і з специфічним способом роботи з web-програмою, при якому web-браузер є лише низькорівневим терміналом. Він не має інформації про те, який етап роботи виконується користувачем. Він лише отримує готову сторінку в форматі HTML і відображає її користувачу.
У web-програмах, побудованих за допомогою технології Ajax, частина функціональних можливостей переноситься з сервера на клієнт. На деякі дії користувача така web-програма може реагувати самостійно. Якщо наявних можливостей не вистачає для виконання ініційованих користувачем дій то відбувається взаємодія із сервером, при цьому користувач може виконувати інші дії. Оскільки HTML документ присутній на стороні клієнта протягом всьго часу роботи з web-програмою, то він здатний зберігати всю інформацію про її стан.
Технологія динамічного завантаження вмісту існувала і раніше — за допомогою атрибуту src можна було завантажити зовнішній сценарій JavaScript, який змінить поточну сторінку. Але цей метод не є дуже вдалим через обмеження атрибуту src та додатковому навантаженні на сервер, бо він має виконати додаткові дії для генерації спеціального сценарію JavaScript, що містить інструкцію, як модифікувати поточну сторінку в нову.
Засоби, що використовуються в рамках технології Ajax не єдиний спосіб забезпечити асинхронний обмін даними з сервером. Наприклад Macromedia Flash (починаючи з 4ї версії) може завантажувати дані в форматі XML або CSV з серверу без перезавантаження сторінки. Але цю технологію не можна використовувати для створення багатих web-програм бо вона в основному використовується для роботи з мультимедійними даними і малопридатна для динамічної зміни вмісту сторінки.
Пізніше Microsoft створила об’єкт XMLHttpRequest в Internet Explorer 5, що і став основою Ajax.
2.3 Переваги Ajax
Створення web-програм, що мають інтерфейс та багаті можливості, подібні до звичайних програм — при цьому, завдяки активній взаємодії з сервером, web-програм мають значні переваги над звичайними програмами.
Економія трафіку — замість завантаження усієї сторінки достатньо завантажити відносно невелику частину, що змінилася.
Зменшення навантаження на сервер — серверу не потрібно кожного разу генерувати усю сторінки, а лише ту частину, що змінилася.
Прискорення реакції інтерфейсу — оскільки завантажується лише частина сторінки то користувач бачить результат своїх дій швидше.
Недоліки Ajax:
Відсутня інтеграція із стандартними інструментами браузера — не працює кнопка «Назад», сторінку, згенеровану за допомогою Ajax не можна додати в закладки.
Проблема з індексуванням сайту пошуковими роботами — у них відсутня підтримка JavaScript.
Використання JavaScript та DOM, що мають різну реалізацію в різних браузерах та навіть різних версіях браузерів.
2.4 Мова JavaScript
JavaScript — назва реалізація мови програмування ECMAScript. Найпоширеніше і найвідоміше застосування мови — написання сценаріїв для Web-сторінок, але вона також використовується для впровадження сценаріїв керування об'єктами вбудованими в інші програми.
JavaScript за назвою дуже схожа на мову Java. Але це зовсім різні мови з різними сферами застосування. Права на назву JavaScript належать Sun Microsystems (розробник Java) але JavaScript розробляла зовсім інша компанія — Netscape для власного браузера Netscape Communications.
Зараз JavaScript підтримують всі основні двигунці браузерів — Trident(InternetExplorer), Presto (Opera), Gecko (Firefox, Mozilla, Netscape) та KHTML/WebKit (Konqueror, Safari).
JavaScript має низку властивостей об'єктно-орієнтованих мов, але завдяки концепції прототипів підтримка об'єктів в ній відрізняється від традиційних мов ООП.JavaScript має ряд властивостей, спільних з функціональними мовами, що додає мові додаткову гнучкість.
JavaScript має подібний синтаксис, але має з нею відмінності:
об'єкти, з можливістю інтроспекції і динамічної зміни типу через механізм прототипів
функції як об'єкти першого класу
обробка винятків
автоматичне приведення типів
автоматичне прибирання сміття
анонімні функції
Одна з популярних технологій, що дозволила зробити сторінки динамічнішими і забезпечити нові можливості — це динамічне завантаження і вставка даних в документ, що отримала назву AJAX.
При використанні в рамках технології DHTML JavaScript код включається в HTML-код сторінки і виконується інтерпретатором, вбудованим в браузер. Код JavaScript вставляється в теги <script></script> з обов'язковим за специфікацією HTML 4.01 атрибутом type="text/javascript", хоча в більшості браузерів мова сценаріїв по замовчуванюю саме JavaScript.
При розробці великих і нетривіальних Web-програм з використанням JavaScript дуже важлива наявність зручних та досконалих інструментів відладки. Оскільки браузери мають різні двигунці, які по різному інтерпретують JavaScript (та об’єктну модель документу), то потрібно мати налагоджувач для кожного з основних двигунців.
Проблема з налагодженням JavaScript сценаріїв є найбільшим недоліком цієї мови. Спроба стандартизації у вигляді ECMAScript не досягла успіху — кожен двигунець має особливості і, фактично, доводиться писати код для різних двигунців одночасно.
Також JavaScipt має обмеження часу на завершення свого виконання (це може бути як фіксоване число у випадку браузерів з двигунцем Gecko або інше обмеження, наприклад максимальне число елементарних операція у випадку браузерів з двигунцем Trident).
2.5 Об'єктна модель документа
Об'єктна модель документу — специфікація прикладного програмного інтерфейсу для роботи зі структурованими документами (як правило з документами в форматі XML та похідних форматах).
Об'єктна модель документу визначає класи, методи та атрибути цих методів для аналізу структури документу та роботи із представленням документів у вигляді дерева. Це все призначено для того, щоб мати можливість доступу та динамічної модифікації структури, змісту та оформлення документу. Саме за допомогою об’єктної моделі документу в технології Ajax відбувається динамічна модифікація сторінки.
В перших браузерах з’явилися різні, часом несумісні інтерфейси для роботи з HTML в двигунцях JavaScript. Потім World Wide Web Consortium (W3C) узгодив та визначив низку стандартів, що отримали назву Об'єктна модель документу W3C. Специфікації W3C не залежать від платформи або мови програмування.
Існують декілька версій об’єктної моделі даних W3C, що мають назву рівнів. Кожен рівень складається з декількох обов’язкових та необов’язкових модулів. В 2005 році рівні 1, 2 а також деякі модулі 3-го рівня визнано як рекомендації W3C, що означає, що вони набули кінцевої форми.
Існують такі рівні об’єктної моделі даних W3C:
Нульовий рівень — не був стандартизований, але став основою першого рівня об’єктної моделі даних W3C. Прикладом є реалізація об’єктної моделі даних в ранніх версіях браузера Netscape.
Перший рівень — обхід структури (дерева) документу та модифікація вмісту (додавання, видалення та зміну елементів). Має повну підтримку сучасними браузерами.
Другий рівень — підтримка простору імен XML, фільтрованих представлень та подій. Має майже повну підтримку сучасними браузерами.
Третій рівень — складається з 6 модулів, статус рекомендацій W3C мають лише 3 (Ядро, Збереження та Завантаження а також Верифікація) інші 3 мають статус чернеток W3C (Представлення та формати, Xpath та Вимоги). Має часткову підтримку сучасними браузерами.
Не зважаючи на стандартизацію, браузери не мають повної сумісності їх об’єктної моделі даних.
Яскравим прикладом вказаної проблеми є функція createXmlHttpRequestObject, що створює екземпляр об’єкта XMLHttpRequest (необхідний для функціонування Ajax). Вона враховує різні двигунці та навіть різні версії двигунців — загалом вона виконує 7 спроб створити екземпляр об’єкта XMLHttpRequest, ігноруючи помилки. При розробці нових версій (або навіть нових двигунців) її, скоріше за все, доведеться модифікувати для працездатності в нових умовах.