Одноразовый expression
06 Dec, 2007Все уже часто сталкивались с специфическими для IE expressions, однако не все знают (я например не знал), что их можно оптимизировать. Об одном из приемов и пойдет дальше речь.
Проблема
Наверняка многие хакеры замечали, что когда expression становится много, то сайт начинает притормаживать в IE. Оно и понятно — они ведь исполняются при каждом действии на странице, будь то клик, наведение мышки, или ресайз экрана. Cмотрите сами. Для некоторых скриптов так и должно быть (min-width например), другим же достаточно одного выполнения(PNG fix, :first-child etc). О том как заставить их исполняться только один раз при загрузке и идет дальше речь.Решение
Все решения используют один и тот же прием. Есть некий "флаг", при наличии которого expression выполняется, скрипты же пытаются при первом же исполнении этот флаг убрать.Вариант решения
Первый вариант выглядит так:- jscript: expression(
- this.p ? 0 : (
- //а здесь пишем нужный нам код,
- this.p = 1
- )
- );
this.p = 0. Что гораздо быстрее любых других операций.
Яндекс вариант
Вариация(false true переставили местами) на тему этого способа используемая в верстке Яндекса:- b:expression(
- !this.a?
- (this.a=1, (this.previousSibling?this.innerHTML=' ·' + this.innerHTML:0)):
- 0
- );
Второй тип, я использую
Есть и второй тип, используется CSS свойство, которое потом в самом expression "сбрасывается", так, что expression при первом выполнении как бы "удаляет" сам себя:- background-image:expression(
- this.runtimeStyle.backgroundImage = 'none',
- //а здесь пишем нужный нам код
- );
background-image тут играет лишь роль флага, на самом деле скриптить таким способом можно все, что вам нужно, как-то так выглядит эмуляция :first-child:
- background-image:expression(
- this.runtimeStyle.backgroundImage = 'none',
- this.previousSibling?false:this.className += 'first-child'
- );
none, соответственно и expression перестает исполняться.
Безопасно вместо background-image использовать всякие редкие свойства вроде azimuth.
Изучать дальше
Вообще за поднятую тему оптимизации expression спасибо Павлу Корнилову выступившему с соответствующим докладом на ClientSide 2007.Следует помнить, что одноразовые expression нельзя применять для min-width, min-height и прочего. По понятным причинам подсчеты произведутся только при загрузке страницы.
- Пример трех одноразовых expression а так же пример одного обычного
- Текст доклада Корнилова на ClientSide и жж-пост про это, рекомендую ознакомиться с презентацией(внизу текста на его сайте есть линк)
- PNG fix использующий прием оптимизации, в комментариях есть несколько способов оптимизации
- PNG прозрачность у Харисова с использованием "одноразовости"
21 комментариев к “Одноразовый expression”