Компания Microsoft недавно запустила новый сайт демонстрации IE 10, названный Bubbles. Сайт основан на анимационной оценке Bubblemarks.

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

По данным блога IE, сайт Bubbles в своей основе является относительно простым физическим движком JavaScript. На каждом кадре анимации, примерно 60 раз в секунду, данный движок пересчитывает положение всех пузырьков, корректирует их скорости, применяет гравитацию и вычисляет столкновения.

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

Сайт Bubbles работает и с другими браузерами. Правда, вместо логотипа IE пользователи Firefox и Chrome видят соответствующие символы своих браузеров. Протестировать свой браузер можно по этой ссылке.