Замечательная презентация “Высокие нагрузки: 14 правил для ускорения загрузки страниц” (англ.)
Автор - Steve Souder, тот самый который написал “High Performance Web Sites” и “Even Faster Web Sites”
Объясняет, как latency коррелирует с прибылью, почему сайты вообще медленно грузятся в браузере и рассказывает как это можно исправить. Утверждает он следующие интересные вещи:
Влияние latency на доход
Google: +500 ms -20% traffic
Yahoo: +400 ms -5-9% full-page traffic
Amazon: +100 ms -1% sales
На конференции Velocity 2009 докладчикам от AOL, Google, Microsoft и Shopzilla задали вопрос “почему это важно - уделять внимание производительности?”
- Microsof (Bing): увеличение времени отклика на 2 секунды это -1,8% запрос/пользователь и -4,3% дохода с пользователя
- Google: увеличение времени отклика на 400 ms это -0,59% запрос/пользователь
- AOL: 25% падение количества page hits при удвоении времени отклика
- Shopzilla: Ускорение с 7секунд до 2х дало +25% page hits, +7-12% дохода и 50% экономия на железе
Почему сайты медленно грузятся?
Согласно Souder-а причины могут быть следующие:
- Тормозит back-end
- Тормозит front-end
- Тормозит интернет
Steve говорит, что 80-90% всего времени тратится на front-end и соответсвенно оптимизировать надо как раз эту часть в первую очередь. И дешевле всего и эффект виднее.
Как исправить
Вот его 14 правил:
- Делать меньше HTTP запросов
- Использовать CDN
- Не забыть про Expires
- Использовать Gzip компрессию
- Все стили на верх страницы
- Все скрипты - вниз
- Избегать CSS expressions
- Выносить JS и CSS во внешние файлы
- Уменьшать DNS lookups
- Сжимать JS
- Избегать redirect-ов
- Выкинуть повторяющийся JS
- Не забыть про ETags
- Сделать AJAX контент cacheable
Сама презентация поясняет основные приёмы ускорения загрузки страниц:
- сначала грузим только то, что надо для отображения станицы, затем всё остальное
- 6 способов загрузить JS и чем они отличаются
XHR Eval, XHR Injection, JS in Iframe, JS DOM Element, JS Defer, document.write Script Tag - как прятать от пользователя что мы ещё не все загрузили (индикатор загрузки в браузерах)
- несколько неблокирующих способов грузить JS
- способы вызова/инициализации JS со страницы, он называет это “coupling techniques”
hardcoded callback, window onload, timer, degrading script tags, script onload - какие домены лишние, а какие наоборот надо добавить в round-robin DNS
- почему для статики HTTP 1.0 лучше чем HTTP 1.1
- фокусы с flush() на разных языках
- эффективные и не эффективные CSS
