"Оживление" компонента

20-08-2019

Зададимся целью – сделать так, чтобы компоненты оживали как можно быстрее. Для этого необходимо рассмотреть ряд вопросов:

какой момент лучше всего подходит для начала выполнения скриптов? как быстрей всего создать объект нужного класса? как инициализировать поля объекта нужными значениями? где должна находиться логика инициализации? в какой момент должны добавляться обработчики событий?

Начало выполнения JavaScript'a

Перед нами стоит вопрос – в какой момент запустить на выполнение скрипт, оживляющий компоненты? Пойдем от простого к сложному. Простейший вариант – выполнять оживляющий скрипт для каждого компонента сразу после того, как отрендерился его HTML код. Пример:

...

Этот способ плох тем, что страницы превратится в кашу из HTML и JS кода, заметно увеличится время отрисовки последних HTML тегов.

Раз этот способ не подходит – значит нужно группировать все оживляющие скрипты и выполнять их все разом в какой-то один момент. Таких моментов может быть три (в порядке наступления):

перед закрывающимся тегом document.ready (DOMContentLoaded) window.onload

Итак, у нас есть кусок кода, оживляющий все компоненты на странице. Пусть, например, это будет функция initComponents:

function initComponents() {/*code*/};

window.onload. Добавить эту функцию в качестве обработчика события load объекта window. Например, так:

jQuery.event.add(window, 'load', initComponents);

Способ прост в реализации, и если у вас на странице мало изображений, FLASH объектов и другого мультимедийного контента, то его вполне можно использовать. Однако в последнее время придумали лучший способ.

document.ready (DOMContentLoaded). Добавить эту функцию в качестве обработчика события DOMContentLoaded. Это событие возникает в тот момент, когда загружен весь HTML код, но еще не загружена мультимедийная информация (изображения, FLASH, видео). Для оживления компонентов эта информация не нужна, поэтому можно начать оживлять в момент возникновения этого события. Единственная проблема в том, что это событие не кроссбраузерное. Точнее, оно реализовано по-разному в разных браузерах. Для того чтобы привязаться к этому событию, нужно воспользоваться одной из библиотек. Например, так:

jQuery(document).ready(initComponents);


Смотрите также:
 Разработка и создание сайтов.
 "Оживление" компонента
 ICQ Mobile для Symbian
 Как не запутаться в собственном коде
 Русская версия ICQ 7.7 бесплатно

Добавить комментарий:
Введите ваше имя:

Комментарий:

Защита от спама - решите пример:


Онлайн-игры для социальных сетей:

Понравились обзоры? Читайте еще!

Новые обсуждения на форуме:

Парк аттракционов "Сегодня парки отдыха практически повсеместно вытесняются тематическими парками, хотя обычно эти два определения смешивают.."
Зачем надо учиться играть в шахматы? "Шахматы долгое время считались игрой королей и аристократов.."