Визуализация DOM-дерева в 3D (расширение Firefox)

Расширение Tilt для Firefox (http://blog.mozilla.com/tilt/) строит трехмерную модель текущей веб-страницы, используя WebGL для быстрого рендеринга. Таким образом, можно мгновенно анализировать структуру страницы и взаимосвязи между разными частями. Как известно, с помощью объектной модели документа (DOM) любой HTML-документ может быть представлен в виде дерева узлов, каждый узел которого представляет собой элемент, атрибут, текстовый, графический или другой объект. Данное расширение строит такое дерево, накладывая на него текстуру из текста и графики, которые находятся в соответствующих узлах дерева. Кроме обычной визуализации, плагин показывает по щелчку правой кнопки различную информацию о каждом узле (тип, id, класс или другие атрибуты). Авторами расширения являются Виктор Пороф (основная часть), Седрик Вивье (рендеринг DOM-элементов в виде WebGL-текстур, эквивалент canvas.drawWindow) и Роб Кэмпбелл (автор идеи). После установки расширения оно запускается сочетанием клавиш Ctrl+Shift+L (или Cmd+Shift+L на маке) или выбором соответствующего пункта меню в браузере, выход - по клавише Esc. Расширение работает на любой странице. В будущем разработчики планируют добавить новые фичи, в том числе модификацию и обновление 3D-модели на лету (как только страница меняется, инициируется трансформация CSS для каждого узла; плюс настройка отображения элементов, в том числе прозрачность и взаиморасположение 3D-узлов); рендеринг не только страницы целиком, но отдельных частей, используя z-index; создание более удобного для веб-разработчика инструментария; лучшая интеграция с редактором Ace и Firefox Developer Tools (подсветка текущего выделенного узла, мгновенный 3D-предпросмотр), экспорт 3D-графики в другие браузеры или приложения (через файл с 3D-объектами, вероятно, .obj и/или COLLADA). Самым большим прорывом станет возможность 3D-серфинга между страницами, как в нормальном 2D-режиме. Анатолий АЛИЗАР

Регион: 

Заметили ошибку? Выделите ее мышкой и нажмите Ctrl+Enter!