Статьи

Что нового в инструментах разработчика IE11

Это была большая неделя для браузеров. Была запущена Opera 15 , Chrome 28 , Firefox выиграл награды и пропустил опции JavaScript . Настало время восстановить баланс во вселенной и проявить любовь к IE!

Новые функции, появившиеся в IE11, получили широкую огласку. SPDY и WebGL: отлично. Лучшее сенсорное управление и синхронизация SkyDrive: приятно. Улучшенные табуляции и живые плитки: все хорошо. Но что нам действительно нужно, так это лучшие инструменты, помогающие в нашей повседневной разработке… собирается ли Microsoft что-то предложить ?

Я никогда не приветствовал инструменты разработчика IE. Первая версия для IE6 появилась в ответ на Firebug, который произвел революцию в тестировании в браузере. Панель инструментов была спешной и неуклюжей, но лучше, чем ничего. Он получил незначительные улучшения в версиях IE, но оставался разочаровывающим. Компания, создавшая VisualStudio, не смогла сопоставить инструменты браузера, предлагаемые конкурентами.

Хотя IE11 не появится в течение нескольких месяцев, последние инструменты разработчика F12 были полностью переработаны. Они отлично выглядят и имеют некоторые действительно инновационные функции, которые могут превзойти альтернативы.

Первое изменение, которое вы заметите, это то, что уродливые серые диалоги были заменены великолепно выглядящим современным интерфейсом:

Значки внизу слева ведут к:

  • DOM Explorer
  • консоль сообщений (которая также доступна в качестве наложения)
  • отладчик JavaScript
  • сетевой инструмент
  • профилировщик отклика пользовательского интерфейса
  • скрипт-профилировщик
  • инструмент анализа памяти
  • инструмент эмуляции для тестирования маленьких экранов и GPS

Пока что так, Firebug. Но есть некоторые удивительные функции, которые вы не обязательно найдете в другом месте …

IntelliSense : предложения автозаполнения доступны при редактировании активных атрибутов HTML, свойств CSS и объектов JavaScript.

DOM drag & drop : узлы можно переставлять и переставлять в живом дереве.

Подсказка события : узнайте, какие обработчики событий были применены к узлу DOM.

Де-минимизация кода : конвертируйте сжатый или минимизированный код в более читаемый формат.

Реверс выполнения : это не совсем машина времени, но можно переместить точку выполнения назад!

Установить следующее утверждение : пропустить утверждения — немного похоже на их временное комментирование.

Точки отслеживания : автоматически записывать сообщения в консоль — например, при console.log()

Разбить нового работника : прерывает выполнение при вызове веб-работника.

Профилирование производительности : узнайте о наиболее ресурсоемких задачах и о том, как они влияют на частоту кадров вашей страницы.

Профилирование памяти : сделайте снимки использования памяти, сравните их с другими и определите, какие узлы DOM или объекты JavaScript потребляют больше всего ресурсов.

Возможно, единственная недостающая функция — это инструмент для анализа локального хранилища HTML5. Но у Microsoft есть несколько недель, чтобы разобраться с этим …

Несмотря на историческую репутацию IE, Microsoft движется в правильном направлении. Вы можете даже потребовать IE11 для тестирования вашего следующего веб-проекта!