Internet Explorer 9. SVG и GPU

Показывать лекцию целиком

GPU - акселерация

Одним из самых заметных и значимых новшеств в IE9 является использование GPU - ускорения. Помимо ускорения графики и HTML5 - видео, скорость отображения шрифтов также возросла, за счет поддержи Direct2D и DirectWrite.

Поддержка HTML5 video в IE9 была продемонстрирована еще на конференции MIX, но в первые две тестовые сборки она не попала. Зато было заявлено, что в июне, в третьей сборке мы HTML5 video уже увидим. Примечательно, что HTML5 Video в IE9 также ускоряется через GPU, что позволяет смотреть HD-видео без проблем и нагрузки на CPU.

Отметим, что единого мнения по тому какой кодек использовать в качестве стандартного в спецификации HTML5 – нет. Позиция Microsoft такова: IE9 будет поддерживать h264 из коробки, так как он встроен в системы, на которых будет распространяться IE9. Кроме того, Microsoft поддержала проект WebM и заявила о поддержке кодека, в случае, если пользователь самостоятельно установит его в Windows.

Соответственно, для поддержки любого нового кодека в IE необходима его установка в систему. h264 встроен в Vista и Windows 7 изначально и с ним нет проблем.

Оценить

SVG в IE9

SVG (масштабируемая векторная графика) — язык разметки масштабируемой векторной графики, созданный Консорциумом Всемирной паутины (W3C) и входящий в подмножество расширяемого языка разметки XML, предназначен для описания двумерной векторной и смешанной векторно/растровой графики в формате XML. Поддерживает как неподвижную, так анимированную и интерактивную графику — или, в иных терминах, декларативную и скриптовую. Это открытый стандарт, является рекомендацией консорциума W3C, — организации, разработавшей такие стандарты, как HTML и XHTML. Разрабатывается с 1999 года, в 2001 году вышла 1.1 версия, которая остается актуальной до сегодняшнего дня, в активной разработке версия 1.2. В основу SVG легли языки разметки VML и PGML.

К преимуществам SVG относят:

Текстовый формат — файлы SVG можно читать и редактировать (при наличии некоторых навыков) при помощи обычных текстовых редакторов. При просмотре документов, содержащих SVG графику, имеется доступ к просмотру кода просматриваемого файла и возможность сохранения всего документа. Кроме того, SVG файлы обычно получаются меньше по размеру, чем сравнимые по качеству изображения в форматах JPEG или GIF, а также хорошо поддаются сжатию.

Масштабируемость — SVG является векторным форматом. Существует возможность увеличить любую часть изображения SVG без потери качества. Дополнительно, к элементам SVG документа возможно применять фильтры — специальные модификаторы для создания эффектов, подобных применяемым при обработке растровых изображений (размытие, выдавливание, сложные системы трансформации и др.) В тексте SVG-кода фильтры описываются тегами, визуализацию которых обеспечивает средство просмотра, что не влияет на размер исходного файла, обеспечивая при этом необходимую иллюстративную выразительность.

Возможность увеличения - вы можете увеличить любую часть изображения SVG без потери качества.

Имеется возможность вставлять элементы с изображениями в форматах PNG, GIF или JPG.

Текст в графике SVG является текстом, а не изображением, поэтому его можно выделять и копировать, он индексируется поисковыми машинами, не нужно создавать дополнительные метафайлы для поисковых серверов.

Анимация реализована в SVG с помощью языка SMIL (Synchronized Multimedia Integration Language), разработанного также консорциумом W3C. Поддерживаются скриптовые языки на основе спецификации ECMAScript. SVG-элементами можно управлять с помощью JavaScript. Применение скриптов и анимации в SVG позволяет создавать динамичную и интерактивную графику. В SVG обеспечивается событийная модель, отслеживаются события (загрузка страницы, изменение ее параметров, события мыши, клавиатуры и др.) Анимация может запускаться по определенному событию (например "onmouseover" или "onclick" ), что придаёт графике интерактивность. У каждого элемента есть свои собственные события, к которым можно привязывать отдельные скрипты.

SVG — открытый стандарт. В отличие от некоторых других форматов, SVG не является чьей-либо собственностью.

SVG документы легко интегрируются с HTML и XHTML документами. Внешний SVG подключаются через тег <object>, значение атрибута data — имя файла с расширением ".svg", содержащего разметку SVG, type — MIME-тип, то есть image/svg+xml. Атрибуты width и height определяют размеры области SVG по горизонтали и по вертикали. Элементы SVG совместимы с HTML и DHTML.

Совместимость с CSS (англ. Cascading Style Sheets). Отображением (форматированием и декорированием) SVG элементов можно управлять с помощью таблицы стилей CSS 2.0 и её расширений, либо напрямую с помощью атрибутов SVG элементов.

Совместимость с технологией Java - SVG совместим с высокотехнологичным Java-графическим движком Java 2D API.

Internet Explorer 9 реализует стандарт SVG согласно документу Scalable Vector Graphics (SVG) 1.1 (Second Edition)

( http://dev.w3.org/SVG/profiles/1.1F2/publish/) Согласно HTML5, SVG-код может быть включен в разметку наравне с HTML. Соответственно, к SVG-тегам может применятся CSS. Возможность внедрять изображения в SVG позволяют накладывать поверх них графику и текст.

Internet Explorer 9 поддерживает четыре возможных типа внедрения кода SVG: в HTML, в XHTML, в тег object, как документ .svg.

В HTML5 SVG может встраиваться непосредственно в код HTML. Текущие веб-страницы могут быть обновлены для включения SVG с небольшим изменением общей структуры.

На текущий момент в IE9 поддерживаются следующие элементы (по крайней мере, частично):

Методы вложения: строчный HTML, строчный XHTML, <object>, .svg-документы

Структуры: <svg>, <defs>, <use>, <g>, <image>

Формы: <circle>, <ellipse>, <rect>, <line>, <Polyline>, <polygon>, <путь>

Текст

Заливка, выделение, (CSS3) цвет

DOML2 Core и SVGDOM

События

Презентационные аттрибуты и стилизация CSS

Преобразования: translate, skewX, skewY, scale и rotate.

Методы вложения: <embed>, <iframe>, <img>, css image, .svgz

Градиенты и шаблоны

Обрезку, наложение маски и составление

Курсор, маркер

В заключении отметим, что все изложенные в данной лекции особенности IE9 косвенно указывают на изменения в самой концепции предоставления веб - услуг. Формируется тенденция, при которой минимизируется нагрузка на сеть и сервер, в то время как компьютер - клиент берет на себя больше вычислительных функций ( GPU - акселерация ).