Сколько будет разработчиков, я создаю веб-приложение, которое использует AJAX для извлечения данных и HTML.
Я новичок в веб-разработке и javascript, но уже несколько десятилетий имею опыт программирования на других языках.
Я использую mootools, который является отличным фреймворком, но боролся с отсутствием деструкторов в javascript или даже onDestroys / unloads для элементов dom.
Я написал несколько классов пользовательского интерфейса (в основном для изучения), и многие из них используют таймеры setInterval для периодического получения данных с WebServer и обновления элементов на странице (в основном, изображений с камер).
Большинство проблем возникает, когда в меню запрашивается другая страница, и div содержимого перезагружается с новым HTML и Javascript (с использованием Request.HTML). Это просто заменяет все элементы, уже находящиеся в div, на новый и запускает новые сценарии. Все таймеры в старых сценариях или старых созданных объектах будут продолжать работать. Это оставляло меня с множеством осиротевших Клозов, стихий и таймеров.
Я читал больше на сайте mootools и осознал ряд ошибок, которые я совершил, и начал исправлять многие проблемы. Самый большой из которых не использовал Element.store и Element.retrieve вместо того, чтобы связывать мои классы непосредственно с Элементами.
Я уже обнаружил, что содержимое перезагружаемого div нужно освобождать, вызывая destroy для всех его дочерних элементов перед вызовом Request.HTML, но это не удалит (очистит) все запущенные таймеры.
Итак, я сделал JSFiddle здесь деинициализируем классы , чтобы показать, что я пытался, похоже, он работает нормально, но вот что я хочу знать:
- Это хорошая идея?
- есть ли другие проблемы, которые я мог пропустить?
- Вы видите какие-либо проблемы с этим типом реализации?
- или я заново изобретаю колесо и пропустил
что-то?
Объяснение
Когда класс инициализируется, он сохраняет себя вместе с элементом.
Он также добавляет (делает при необходимости) сам в массив AssocClasses, также хранящийся вместе с элементом.
Я создал функцию ClearElement, которая вызывается всякий раз, когда содержимое элемента должно быть заменено, и вызов AJAX или другого метода, который получает все элементы в div, и если они имеют присоединенный массив AssocClasses, вызывает deinitialize на каждом из классов в массиве, он вызывает destroy для каждого из своих прямых потомков, чтобы освободить элементы / хранилище.
Любая информация, указатели и т. Д. Будут получены с большим удовольствием.