Высокопроизводительные AJAX-приложения. Часть 5.

Высокопроизводительный динамический макет и CSS

Разные советы…

  • Используйте технику CSS Sprites для быстрого переключения картинок (Snappy Image Replacement, известен также как rollover-эффект).
  • Избегайте использования JavaScript для (анимации) макета.
    • Нужно помнить о window.onresize…
    • Вместо этого используйте чистый CSS!
    • Побочные эффекты: улучшается масштабируемость, улучшается поддержка пользователей с отключенными возможностями (скриптами, изображениями, стилями), и т.д.
  • Избегайте использования CSS-выражений (expressions) в Internet Explorer.
    • Выражения (в большинстве своем) постоянно пересчитываются, чтобы учесть текущие изменения на странице.
    • Существуют способы по их оптимизации, но, в общем случае, можно найти обходные пути, чтобы их не использовать.
  • Избегайте использования CSS-фильтров в Internet Explorer (или сведите их к минимуму).
  • Оптимизируйте табличную разметку.
    • Задача: позволить движку браузера начать отображение таблицы перед тем, как он ее полностью получит.
    • Используйте table-layout:fixed
    • Дополнительно определите элемент COL для каждой колонки.
    • Задайте значение для его атрибута WIDTH.
  • Оптимизируйте ваши CSS-селекторы [http://developer.mozilla.org/en/docs/Writing_Efficient_CSS]. Стоит заметить, что большая часть этих советов, в связи с проведенным исследованием, не несет особого смысла.