вторник, 4 октября 2011 г.

Internet Explorer 10 — новые горизонты производительности


После очередного превью платформы Internet Expolorer 10 стало очевидным, что Microsoft продолжает работу по оптимизации своего браузера. Как и ранее в центре внимания оказались HTML5 технологии, а также поддержка новых спецификаций и API рабочих групп W3C.
Производительность HTML5
При просмотре специально подготовленных демо непривычно было наблюдать, как всякий раз IE10 оказывался быстрее своих конкурентов — Chrome, Firefox и Opera. Internet Explorer 10 действительно показал незаурядную скорость при работе с HTML5 видео, аудио и canvas, а также CSS3 градиентами.
Демо Flying Images
Асинхронное выполнение скриптов
Наличие атрибута async делает загрузку и выполнение кода JavaScript асинхронной относительно других объектов страницы. Тем самым решается проблема нежелательных блокировок и уменьшается общее время загрузки в тех случаях, когда между файлами скриптов не явных зависимостей.
Данный атрибут является частью стандарта W3C HTML5 и уже поддерживается многими современными браузерами.
Web Workers
Для большинства браузеров традиционной являлась однопоточная реализация, при которой выполнение скриптов и рендеринг страниц не могли выполняться параллельно. Внедрение технологии Web Workers сделало возможным фоновое выполнение кода JavaScript.
Новый объект Worker в качестве аргумента требует имя файла, который будет получен посредством асинхронного запроса к серверу:
var myWorker = new Worker('worker.js');
Взаимодействие с фоновым потоком осуществляется с помощью системы сообщений. Для отправления данных используется метод postMessage, а получение ответа реализуется через событие onmessage.
В следующем примере показано создание Worker потока, который ожидает сообщение от скрипта:
var hello = new Worker('hello.js');
 
hello.onmessage = function(e) {
  alert(e.data);
};
«Рабочий» поток в свою очередь отправляет сообщение для отображения на экране
postMessage('Hello world!');
Page Visibility API
Page Visibility позволяет разработчикам явно отслеживать текущее состояние документа и назначать необходимые действия при изменениях видимости страницы сайта. API включает в себя два свойства document.hidden и document.visibilityState, а также одно событие visibilitychange.
С помощью Page Visibility API можно более эффективного распоряжаться вычислительными ресурсами, не нагружая ПК пользователей в те моменты, когда страница невидима. Кроме того, можно более грамотно реализовывать фоновое предварительное кэширование статических объектов.
Методы requestAnimationFrame и setImmediate
Поддержка двух новых методов requestAnimationFrame и setImmediate станет решением ряда проблем, связанных с выполнением кода JavaScript.
Часто случается, что анимации на веб-страницах выполняются в то время, когда документ находится на фоновой вкладке, или окно браузера и вовсе свернуто. Также нередким случаем является отсутствие синхронизации между частотой дисплея и таймерами JavaScript.
Например, если раньше интервалы для анимации задавались с помощью setInterval:
var handle = setInterval(renderLoop, PERIOD);
то теперь можно использовать более эффективный метод requestAnimationFrame, который автоматически выравнивает частоту обновления приложений и интервалы рендеринга самого бразузера:
var handle = msRequestAnimationFrame(renderLoop);
В свою очередь метод setImmediate является альтернативой методу setTimeout с нулевым периодом тайм-аута. Если ранее код имел вид:
var handle = setTimeout(spellCheck, 0);
То более эффективный подход будет выглядеть следующими образом:
var handle = msSetImmediate(spellCheck);
Источник: IEBlog

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