Новый редактор стилей и 3D отображение DOM-структуры страницы в Firefox 11

    Разработчики браузера Firefox, который сейчас испытывает сильнейшую конкуренцию с Google Chrome, в марте следующего года планируют к выпуску новую 11-ю версию своего обозревателя. В ней появится ряд новых инструментов, призванных облегчить труд разработчиков.

    Среди новых инструментов появится Style Editor: инструмент, предназначенный для более комфортной работы со стилями HTML-страницы. По сути, инструмент представляет из себя двух-панельное окно, одна из панелей которого предназначена для отображения списков имен стилей, а вторая — собственно, CSS-кода. Разработчики смогут создавать новые стили «на лету», импортировать их из файла, включать и выключать отдельные стили, получая возможность оценить как выглядит страница, причем выполняемые изменения тут же отображаются. Если разработчик хочет изучить CSS-код другого сайта, который часто минимизируют с целью уменьшения скорости загрузки, то Style Editor сможет определить «оптимизированные» места в CSS и отобразить их в удобном виде.

    Как выглядит будущий инструмент можно оценить на скриншоте ниже:



    Более эффектным визуально выглядит другое усовершенствование для разработчиков — отображение структуры web-страницы в виде 3D (функционал, который ранее был реализован в расширении Tilt)


    Если компьютер разработчика поддерживает WebGL, то Firefox 11 сможет отобразить DOM-структуру web-страницы в виде 3D-картинки, в котором вложенные элементы отображаются в виде «стеков». Конечно, 3D DOM страница поддерживает стандартные элементы работы с трехмерными объектами, такими как масштабирование и вращение, причем клик по 3D-элементу приведет к открытию его HTML и(или) CSS-кода.

    Как это выглядит, можно посмотреть на скриншоте ниже:



    Если вы не знакомы с процессом работы с web-страницей в виде 3D DOM, то изучить это можно на видео, иллюстрирующее использование аддона Tilt:



    [Источник]
    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 39

      0
      Где-то я это уже видел и щупал… Странно, не помню где
        +1
        >>(функционал, который ранее был реализован в расширении Tilt)
          0
          Сорри, сорри, точно
          0
          На LOR-е
            0
            СнупФокс же
              0
              Опять Ctrl+Enter как в скайпе нажал… Извините.
              Вот ссылка на Snoop
            –2
            Прибавится тормозов Firefox-у…
              +2
              Как ни странно субъективно не прибавилось, работает моментально.
              +3
              Представляю большие пирамиды в 3D DOM на некоторых сайтах.
                +3
                Я когда баг репорты Виктору слал — тоже задумался, что можно невидимыми обычному глазу штуками построить 3д скульптуру на сайте. Вроде пасхалки, или секретное чо-нибудь. Можно как в minecraft-е картинки рисовать на сайте :)
                  0
                  А Google возвела у себя кирпичную табличную стенку (PNG, 115Кб).
                    0
                    Чуть ли не арканоид
                    0
                    о да, теперь можно наглядно оценить, какую же кучу говна навалил плохой верстальщик :)
                    +9
                    Появятся сайты — игры или сайты — картины, сверстанные особым образом, чтобы в новом фф можно было играть / смотреть.
                      0
                      webgl без webgl
                      –7
                      Все это конечно круто, но вот какие преимущества это даст хомякам? Думаю никаких. Как эта фича может повлиять на популярность firefox? Думаю никак, любой веб-разработчик и так использует firefox как и любой другой браузер.
                        +4
                        ну так в этом случае видно проявление заботы не столько о хомяках,
                        как о разработчиках, ну или схожей тематики населения, а через них
                        опосредованно уже и на пользователей :) Вспомните скольким вы
                        установили тот или иной браузер по умолчанию.

                        А если кто и уже использует, то добавление вот такой штуки будет
                        приятным. Только вот зачем это и чем может помочь я так и не понял: З
                          +1
                          да понятно это все, мысль появилась после прочтения начала статьи. Каким образом эти фичи могут помочь конкурировать с хромом?
                            +1
                            в хроме встроенные инструменты для разработчиков, в отличие от фф. а не встроенный файрбаг, который мы безумно любим, при всех своих плюсах штука тяжелая и тормозная.
                        +5
                        Программист/хакер перемещается по древовидной стуктуре в 3D пространстве. Теперь не будут про фильмы, кричать что так не бывает.
                          +1
                          Интересно, через какое время браузеры будут уметь рендерить 3d макеты сайтов)) Особого смысла в 3D Dom пока не понял
                            +3
                            Смысл на мой взгляд в том, чтобы бегло оценит качество верстки. Если там небоскребы — в топку такую верстку
                              +2
                              Ага, скоро будем соревноваться у кого сайт более «плоско» сверстан ))
                                +3
                                Вы так говорите, как будто это что-то плохое :)
                                0
                                А «небоскрёбы» это сколько этажей?
                              0
                              ахренеть, всегда мечтал о таком. Жаль о tilt не слышал
                                +1
                                На первый взгляд просто игрушка, но на деле очень дельная визуализация. Помогает быстрее разобраться в общей структуре страницы, отследить элементы, которые выскочили из своих родителей и т.д. Особенно полезно, если приходится в чужом коде копаться.

                                А вообще нечто подобное мне уже приходило в голову когда-то.
                                  0
                                  А зачем это 3D? Нет, ну правда.
                                    0
                                    Хочу уже сейчас. 3D не предлагать.
                                      +1


                                      Вот как выглядит эта страница. Баловство, как мне кажется. Когда будет можно обойтись без Firebug, тогда можно будет о чём-то говорить. А пока в этом отношении у Chrome дела лучше обстоят.
                                        +4
                                        Набрал в google в поиске «tilt» чтобы поставить себе… А гугл взял и «дал крен» )))) В прямом смысле слова ))
                                        Красиво…
                                          +1
                                          Это же известная пасхалка — наберите еще do a barrel roll
                                          0
                                          Малоэтажное строительство рулит :)
                                            +4
                                            Видимо, придётся купить еще 8 гигабайт оперативной памяти =)
                                              +1
                                              По поводу Style Editor — это они Firebug заново изобрели? Или в чем принципиальное отличие?
                                              3D движок это интересно. Tilt ни разу не использовал, интересно на сколько он удобен, на видео подбрали сайт который отлично раскладывается в 3D, но гораздо интереснее было бы глянуть, когда есть элементы скажем с position: absolute, куча перекрывающих друг друга элементов — на сколько уджообно будет пользоваться инструментом в таком случае.
                                                +1
                                                По-моему зря они делают ставку на разработчиков — большинство разработчиков и так на FF (попробовал работать в консоли ГХ — не пересилил себя)… хотя, как разработчик, я не возражаю )
                                                  0
                                                  Если не выпускать фишки для разработчиков, очень скоро разработчики будут на чем-нибудь другом…
                                                    0
                                                    увы и ах, заметного движения конкурентов в этом направлении я не увидел, и даже если ГХ сравняется с ФФ по функционалу, большая часть всё равно будет на ФФ, потому что уже привыкли.

                                                    С точки зрения разработчика — я хотел бы увидеть развитие в не столько в инструментах, сколько в обработке DOM (mutation events, нормальный onResize и прочие прелести жизни)
                                                    С точки зрения пользователя — увеличение производительности
                                                  0

                                                  Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                                                  Самое читаемое