Нескінченний IFrame

Нескінченний IFrame - одна з основ ранніх та сучасних AJAX-додатків. У цьому транспорті - найбільше тонкощів (природно, це ж хак віконного інтерфейсу!, які я постарався розкрити та продемонструвати у цій статті.

Спосіб заснований на тому, що браузер обробляє сторінку послідовно і обробляє нові теги в міру того, як сервер їх надсилає.

Класична реалізація - це коли клієнт створює невидимий IFrame, що веде службову URL. Сервер, отримавши з'єднання на цю URL-адресу, не закриває його, а іноді надсилає блоки повідомлень . Javascript, що з'явився в IFrame'і, тут же виконується браузером, передаючи інформацію на основну сторінку.

Таким чином, для передачі даних використовується "нескінченний" іфрейм, через який сервер надсилає нові дані. Цей спосіб найвідоміший та крос-браузерний.

Загальна схема

  1. Клієнт відкриває невидимий IFrame на спеціальну URL
  2. При настанні події на сервері - в іфрейм відразу надходить

  • З'єднання завершується:
  • при помилках
  • кожні 20-30 секунд
  • для очищення пам'яті (іноді робимо новий IFrame) від старих повідомлень

    • завантаження

    Коли створювали IFrame'и, їм не призначали таке використання, тобто цей спосіб - по суті, хак.

    Окрім загальних проблем постійних з'єднань виникають ще деякі складнощі.

    Проблеми, специфічні для IFrame

    Буферизація скриптів браузером

    Деякі браузери не обробляють javascript-повідомлення, доки не відбудеться завершення з'єднання, або не заповниться внутрішній буфер.

    Рішення - паддинг пробілами, як і у випадку з проксі.

    Бачив цю проблему з деякими версіями IE(старими),із Safari. Паддинг у 1024 допомагає як правило (Safari), 2048 - завжди (деякі IE старі).

    Буферизація сторінки браузером

    Деякі версії IE не починають виконувати JavaScript, доки сторінка не досягне певного розміру. Тому перші кілька повідомлень затримуються, тому що браузер чекає, поки іфрейм підросте.

    Рішення - забити початок іфрейму чимось, поставити, наприклад, 1К прогалин на початку.

    Індикація завантаження

    Процес Server push повинен відбуватися якомога непомітно від користувача, якого потрібно повідомляти тільки при появі відповідних подій.

    А натура IFrame, навпаки, супроводжується індикацією: курсор-годинник, смуга завантаження і т.п. Найбільш чітко цю проблему було видно в IE6 до певної версії, де індикатор прогресу занадто яскраво анімувався і привертав увагу.

    Вирішення проблеми індикації для транспорту iframe Ви знайдете у статті AJAX-транспорт IFrame.

    Протестувати індикацію завантаження у вашому браузері можна, запустивши завантаження нескінченного іфрейму.

    Ось - серверний код нескінченного іфрейму

    Клієнтський код – ще простіше. Кожне повідомлення обертається у span і додається через DOM до дива.

    У загальному вигляді недоліки та переваги можна перерахувати як

    • мінімальна затримка та трафік
    • дані не можна стискати
    • ряд технічних та візуальних проблем через хакерську природу транспорту iframe

    Відсутність трафіку заголовків і затримок дають можливість, наприклад, відображати затримку користувача (лаг).

    Для цього кожну секунду (або декілька) – на сервер створюється подія типу "я тут, час XXX". Javascript на клієнті, отримавши це повідомлення, порівнює час зі своїм, локальним (обидва GMT) івиводить різницю як лаг.

    Крім того, onload-подія iframe (window.onload) зазвичай вішають обробник. Кінець завантаження iframe означає розрив зв'язку із сервером, тому такий обробник викликає функцію disconnect основного вікна.

    Ви можете завантажити вихідний крос-браузерного нескінченного iframe в кінці статті AJAX-транспорт IFrame.