Monthly Archives: Май 2010

Известно, что Internet Explorer – браузер, который обновляется нечасто. Можно долго рассуждать почему так происходит и правильно это или нет. Однако точно можно сказать другое – функции, которые появляются в Internet Explorer стоят самого пристального внимания разработчиков. Это происходит просто потому, что сам IE и его функции – это мэйнстрим и, как правило, на момент выхода они реализованы в большинстве других браузеров, которые больше стремятся быть на краю нововведений.

Бывают и исключения, так нативная поддержка JSON, поддержка HTML5 DOM Storage, разделение вкладок на процессы, HTML 5 Networking Events и некоторые другие вещи были внедрены в Internet Explorer 8 раньше многих других браузеров.

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

Введение

Вместо введения я хотел бы рассказать про текущее состояние дел с Internet Explorer 9 и прогресс его создания. Первое упоминание и демонстрация тестовых версий браузера была проведена на конференции PDC в 2009 году. На показали то как браузер будет ускорять графику и использовать новый Direct 2D API для GPU-ускорения обработки текста и сглаживания шрифтов.

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

Следующее явление браузера состоялось на конференции MIX в 2010 году. Здесь нам не только показали новые возможности, но и в первые дали попробовать тестовую сборку самим. Расположенная по адресу http://ie.microsoft.com/testdrive/ тестовая версия доступна сегодня уже во второй версии. Кроме того, разработчики проделали много работы и создали множество наглядных демонстраций для того, чтобы показать те новые возможности, которые принесет с собой Internet Explorer 9. Разработчики пообещали выдавать новую версию IE9 для публичного тестирования каждые 6-8 недель.

Первая тестовая версия IE9 включала в себя множество новых вещей и, наверное, самым главным было GPU-ускорение графики и анимации основанной на SVG и JavaScript. Новый движок JavaScript под названием Chakra порадовал значительным ускорением и обгоном основного конкурента Firefox в тесте SunSpider. Тест ACID3 как индикатор поддержки стандартов стал выдавать 55 баллов вместо 20 в IE8. Плюс ко всему, Internet Explorer, наконец-то обзавелся 100% поддержкой CSS3-селекторов.

Вторая тестовая сборка IE9 принесла еще больше нововведений. О них и о всех других и пойдет речь в этой статье. Сразу стоит сказать, что главное, что мы увидим в третьей сборке в июне будет поддержка HTML5 Video, ускоренного с помощью GPU, которая уже была продемонстрирована в ходе MIX10, но пока не попала в публичные версии браузера.

Поддержка стандартов CSS

Давно известно, что команда Internet Explorer не спешит реализовывать открытые стандарты до того момента как они выйдут из статуса черновиков. Это связано со многими причинами, но как я могу судить – главная состоит в том, что IE является частью операционной системы и любое изменение проведенное в нем должно носить долгосрочный характер. Из этого проистекает и характер медленной разработки версий браузера. Впрочем, не всем это по душе. Разработчики всегда хотят быть на передовой инноваций, даже если придется со временем менять код из-за поменявшегося API. Microsoft, очевидно, не может себе позволить таких действий и придерживается политики осторожного внедрения инноваций в браузер.

В связи с этим, когда речь идет о поддержке CSS3, то стоит взглянуть на следующую таблицу, чтобы прикинуть о каких модулях CSS3 может идти речь, когда мы говорим про их возможной реализации в IE9. Можно убедиться, что стандартов со статусом Candidate Recommendation не так много. Но можно с некоторой долей уверенности говорить, что именно их и будет реализовывать Microsoft в своем браузере. И далее будет несколько подтверждений этой догадки.

CSS3 Backgrounds & Borders Module

Internet Explorer 9 привносит долгожданную поддержку border-radius – закругленных уголков, которые так любят и пользователи и многие дизайнеры. Поддерживаются следующие свойства:

• border-radius
• border-bottom-left-radius
• border-bottom-right-radius
• border-top-left-radius
• border-top-right-radius

Более того, разработчики гордятся тем, что их реализация уголков наиболее точна и правильная среди браузеров, в чем можно убедиться пройдя этот тест с разными браузерами. Например, какой вариант 4-ех браузеров по-вашему лучше и правильнее?

Кроме данных свойств модуля, в планах разработчиков реализация других свойств в будущих тестовых и финальной версиях IE9.

CSS3 Color Module

Поддержка данного модуля во второй тестовой версии IE9 заключается в реализации RGBA и свойства opacity. Пименение:

background-color: rgba(255,0,0,0.5);

и

opacity: 40%;

Другие свойства из этого модуля будут добавлены в ходе разработки.

CSS3 Media Queries Module

С работой свойств данного модуля вы можете ознакомиться на этой тестовой странице. Если коротко, то данный модуль описывает возможность браузера применять разный CSS код в зависимости от текущих размеров и других параметров отображения. Так в примере, если уменьшать размер видимого окна, будет меняться внешний вид и в том числе изменятся картинки, которые в маленьком окне будут выглядеть иначе, будет применен их миниатюрный вид.

Пример кода:

@media (max-width:899px) {
#demodescription {
display:none;
}
}

еще

@media (min-width:450px) and (max-width:950px) {
.placeTitleLong, .bigPhoto, .description {
display:none;
}
}

Подробнее эту возможность IE9 я попробую разобрать в отдельной статье.

CSS3 Namespaces Module

Internet Explorer 9 практически полностью поддерживает данный модуль, который позволяет определять пространства имен для CSS. Подробнее о модуле в его спецификации.

CSS3 Selectors

IE9 поддерживает CSS3-селекторы по спецификации и проходит тест по адресу http://tools.css3.info/selectors-test/test.html на 100%.

Internet Explorer 8 проходил тест с гораздо худшим результатом: “From the 43 selectors 22 have passed, 1 are buggy and 20 are unsupported (Passed 349 out of 578 tests)”.

Кроме того, IE9 содержит несколько селекторов, которые не определены в спецификации CSS3. Это псевдокласс :indeterminate (позволяет выбрать элементы управления с неявным состоянием) и псевдоэлемент ::selection (позволяет выбрать помеченную пользователем разметку).

DataURI

Data:URI не является модулем в CSS, но активно используется в CSS. Data:URI поддерживается в Internet Explorer 8 для изображений. Теперь, в IE9 Data:URI можно использовать для элемента script в атрибуте src.

Поддержка стандартов DOM

Internet Explorer 9 расширяет поддержку DOM Level 2 и добавляет поддержку избранных функций DOM Level 3.

DOM Core (L2 and L3) и DOM Views (L2)

Добавлена поддержка функций DOM Level 2 Core:

• DocumentType
• ProcessingInstruction
• createDocument

Добавлена поддержка пространств имен DOM и относящиеся к ним свойства

• namespaceURI
• localName
• prefix

Разработчики сообщают о поддержке многих свойств из DOM Level 3 Core и полной поддержке DOM Level 2 Views.

События DOM Level 2 и DOM Level 3

Команда IE9 реализовала стандартную модель работы с событиями, которая позволит вам отказаться от attachEvent в пользу стандартных методов:

• addEventListener, removeEventListener, createEvent, dispatchEvent
• объектов Event, UIEvent, MouseEvent
• DOMAttrModified
• DOM Level 3 событий DOMContentLoaded, CustomEvent, KeyboardEvent, DragEvent
• событий compositionstart, compositionupdate, compositionend

DOM Level 2 HTML

В IE9 появилась долгожданная поддержка getElementsByClassName, плюс других свойств из HTML5, вроде characterSet. Разработчики заявляют о значительных улучшениях в объектной модели таблиц, работы с формами.

DOM Level 2 Range и HTML5 Selection

IE9 полностью поддерживает оба API для доступа к выделенному фрагменту страницы: стандарты DOM L2 Traversal and Range и HTML5 Selection. Например, метод setSelectionRange. Или из HTML5: getSelection, selectionStart, selectionEnd.

DOM Level 2 Style

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

DOM L2 Traversal

В IE9 добавлена поддержка следующих свойств спецификации DOM L2 Traversal and Range: NodeIterator, TreeWalker, whatToShow и NodeFilter. Эти методы позволяют фильтровать и производить обход DOM-элементов.

HTML5

Выше уже были упомянуты некоторые функции из стандарта HTML5, которые были представлены в IE9. Кроме того, стоит упомянуть, что IE8 представил ряд функций HTML5 более года назад: DOM Storage, Cross-document Messaging, Ajax Navigations (свойство window.location.hash).

Разработчики уверяют, что парсинг HTML-кода в IE9 уже сейчас в значительной мере приближен к рекомендациям в черновике HTML5 Draft Specification.

Обобщенные элементы

Ранее, Internet Explorer рассматривал неизвестные ему теги в HTML как посторонние элементы и не учитывал их, пропуская их CSS-определение. Это приводило к тому, что следующий пример:

<style type="text/css">
mydiv {
color: blue;
font-weight: bold;
}
</style>
…
<p>I am using a <mydiv>generic element</mydiv> in this sentence.</p>

выводился в IE8 не так, как мог ожидать разработчик:

В Internet Explorer 9 разработчики добавили поддержку таких обобщенных элементов, теперь рендеринг производится так, как задумывал автор:

Перекрывающиеся элементы

Ранее Internet Explorer не поддерживал перекрывающиеся теги так, как это предписывает HTML5:

You should be aware of how <b>this <i>affects</b> script</i>.

При обработке в JavaScript результат мог быть не таким, каким его предполагал автор. В Internet Explorer 9 введена поддержка такого сценария согласно спецификации черновика HTML5.

Изменения в парсинге блоков style и script

Предыдущие версии Internet Explorer не воспринимали блоки style и script как часть дерева DOM. В IE9 вы получаете возможность оперировать такими блоками как частью DOM. Это позволит вам получать доступ к внедренному коду как к обычному тексту в дереве.

Парсинг XHTML

IE9 будет парсить документ с MIME application/xhtml+xml как XHTML.

Парсинг SVG…вместо заключения

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

Continue reading →