Производительность IE6 с выражениями CSS - PullRequest
4 голосов
/ 05 февраля 2009

Мы разрабатываем веб-приложение, которое будет продаваться многим клиентам. Уже есть один клиент (банк), который решил, что купит продукт, как только будет готов. К сожалению, из-за недопонимания выяснилось, что единственным браузером, который они используют, является IE6. Приложение уже было запущено с мыслью о том, что ему не нужно ничего поддерживать ниже IE7. Результаты также довольно хороши - он полностью применим в IE7 / FF / Opera / Safari. Не тестировался на Chrome, но проблем там немного. К сожалению, теперь есть требование IE6 ...

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

Приятной особенностью IE6 является то, что он поддерживает две нестандартные и очень полезные функции. Во-первых, это условные комментарии, которые позволяют мне включать некоторые файлы CSS / JS только для IE6. Второе - это CSS-выражения. То есть такие вещи:

input
{
    background-color: expression(this.type='text'?'silver':'');
}

По сути, он связывает значения CSS с выражениями JavaScript. Это позволяет легко эмулировать многие функции CSS, которые IE6 изначально не поддерживает, и может значительно облегчить мою работу.

К сожалению, IE печально известен своей производительностью JavaScript. Я обеспокоен тем, что использование слишком многих из этих выражений может замедлить его сканирование. Я также понятия не имею, какие компьютеры использует банк. Так как он довольно большой, я бы ожидал большого разнообразия во всех их филиалах. Я не собираюсь использовать там что-то особенное - некоторые простые математические, троичные операторы и просмотр свойств этого элемента / родительского элемента. Тем не менее, в файле IE6_override.CSS их будет несколько десятков.

Может ли это быть проблемой?

Добавлено: Бла, это то, чего я боялся. Хорошо, посмотрим, насколько я могу использовать другие хаки, чтобы обойти недостатки. Спасибо, люди!

Ответы [ 8 ]

10 голосов
/ 05 февраля 2009

https://developer.yahoo.com/blogs/ydn/high-performance-sites-rule-7-avoid-css-expressions-7202.html

Оказывается, вы можете избежать их использования, они опасны.

5 голосов
/ 05 февраля 2009

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

MS признали выражение () ошибочным и удаляют его из будущих браузеров .

Как правило, существуют лучшие индивидуальные обходные пути JavaScript для различных недостатков CSS в IE6.

Довольно печально, что так много компаний все еще придерживаются ужасного IE6. Возможно, если вы поставите проект поздно, он будет обновлен к тому времени!

4 голосов
/ 19 ноября 2009

Можно сделать так, чтобы выражения IE работали оптимально, не только для того, чтобы избежать таких вещей, как непрерывная переоценка, но также для привязки желаемого стиля к именам классов, специфичных для IE, что делает ваш CSS, специфичный для IE, более легким в обслуживании (так как сами выражения отвратительны):

input
{
    1:expression(this.executedExpressions ? void 0 : this.className += (this.type == 'text' ? ' ie-text' : ''));
    2:expression(this.executedExpressions = true);
}

input.ie-text
{
    background-color:silver;
}

Если вы вообще собираетесь использовать выражения IE, это лучший способ. (Я действительно должен написать об этом основательную статью).

2 голосов
/ 05 февраля 2009

Я бы предложил вам перейти на любую платформу JS Framework, которая поддерживает селекторы CSS, чтобы вы могли эмулировать поведение выражений CSS

вы можете проверить производительность JS Frameworks, если откроете этот URL в IE6

http://slicktest.perrohunter.com

ура

2 голосов
/ 05 февраля 2009

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

См. Эту статью для получения дополнительной информации: http://www.robertnyman.com/2007/11/13/stop-using-poor-performance-css-expressions-use-javascript-instead/

1 голос
/ 05 февраля 2009

Я сам не пробовал, но IE7-js выглядит многообещающе. Он утверждает, что IE6 совместим с IE7

Редактировать: Кстати, чтобы просто добавить несколько стилей для IE6, вы также можете использовать

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="screen"  href="ie6styles.css" />
<![endif]-->

И вы всегда можете использовать jquery для динамической установки свойств css во всех браузерах, включая IE6.

1 голос
/ 05 февраля 2009

Да, выражения очень медленные в период IE. Найдите способы их избежать.

0 голосов
/ 19 августа 2010

Если вам нужно их использовать, методы, найденные на Однократное выполнение выражений IE CSS , помогут с проблемами производительности (но не безопасности).

...