Как ускорить работу сайта для посетителя. Ключевые моменты оценки качества веб-проектов. Скорость работы сайта
С каждым годом Интернет растет вширь и вглубь. Увеличивается пропускная способность каналов, пользователи переходят с коммутируемого доступа на безлимитный. Сайты становятся больше по размеру, больше по наполнению и сложнее во взаимодействии. Размеры загружаемых файлов при этом увеличиваются многократно, а время ожидание пользователей не уменьшается.
За последние 5 лет средний размер веб-страниц вырос втрое (по данным исследования Akamai), а за последний год в полтора раза (по данным webo.in). При этом каждая страница использует в среднем по 60 объектов, что крайне негативно сказывается на общем времени загрузки. Только порядка 5-10% от общего времени загрузки приходится на серверную часть. Все остальное составляет именно клиентская архитектура.
Что обычно видит пользователь, заходя на ваш сайт? И как долго? 75% посетителей уйдут после 10 секунд. При этом наиболее характерным временем ожидания будет 4 секунды: если за это время сайт загружается у 90% пользователей, то вы счастливый владелец быстрого интернет-ресурса.
Однако и здесь дорога каждая миллисекунда. Недаром высоконагруженные проекты типа Google, Amazon, Flickr, Netflix, Яндекс, вКонтакте и Одноклассники так серьезно подходят к вопросу скорости загрузки сайтов. За каждым потерянным моментом времени кроется определенная сумма денег. Это именно то место, где время тождественно равно деньгам.
В чем проблема?
Основное время при загрузке страницы уходит именно на клиентскую часть. Серверные затраты обычно крайне малы и составляют от 50 до 500 мс. Среднему пользователю на самом деле абсолютно все равно, сколько страница будет создаваться на сервере, если он ее увидит через полсекунды. В этом случае фокус смещается именно на клиентскую, а не серверную оптимизацию.
Характер проблем варьируется от сайта к сайту. Иногда он заключается в особенности интернет-подключения основной массы пользователей ресурса (например, если широко используются модемы или GPRS). Иногда в сложности самого сайта и неоправданном использовании ресурсов сети. Иногда в неграмотном использовании клиентских технологий и большого количества разнородных решений. Но все эти проблемы можно решить.
Ключевые моменты оценки качества веб-проектов
Говоря о скорости загрузки нельзя не обозначить ее значение в оценке технологического качества любого интернет-проекта. При этом стоит обратить внимание и на следующие моменты (которые можно достаточно быстро проверить с помощью бесплатных инструментов):
Совместимость сайта с браузерами.
Соответствие стандартам.
Семантика HTML-кода.
Доступность сайта для пользователей.
Скорость работы на стороне сервера.
Скорость работы на стороне браузера.
Скорость работы сайта
Скорость работы оказывает ключевое влияние на конвертацию посетителей в доход сайта. Особенно это характерно для интернет-магазинов. Как мы можем проверить эту скорость? Для серверной стороны существует инструмент host-tracker.com, с помощью которого можно установить характерное время доступа к сайту из различных точек земного шара. Также он позволяет оценить характерное время создания страницы на сервере (если иинимальное время доступа к сайту больше 1с, то уже стоит бить тревогу). Также время создания страницы на сервере можно оценить с помощью webo.in/my/action/timings/ (необходима регистрация).
Для проверки отказоустойчивости сайта стоит воспользоваться сервисом Load Impact (http://www.loadimpact.com/). Бесплатный анализ позволяет проверить до 50 одновременных посещений (каждое из которых может открывать несколько десятков страниц на сайте). Основным показателем устойчивости сайта к нагрузкам будет вид кривой, который получится после проведения теста. Если график ровный или время открытия страницы несколько падает при росте посещаемости значит, с сайтом все нормально. Если нет, то нужно принимать решение об оптимальном потоке посетителей,
которых сайт сможет обслужить.
Рис. 1.1. Оценка отказоустойчивости сайта. Источник: www.loadimpact.com
Для проверки качества скорости загрузки клиентской составляющей можно воспользоваться либо YSlow под Firebug для Firefox (оценка должна быть не менее 80, лучше всего не менее 90), либо бесплатным инструментом webo.in (простая оценка не ниже 70, лучше не ниже 80). Подробнее об инструментах для анализа клиентской производительности веб-сайтов рассказано в первой главе.
На что влияет качество сайта
Это, в первую очередь, стоимость его поддержки и развития. Сайт, сделанный грамотно и по всем стандартам, гораздо проще развивать, поскольку времени на написание дополнительного кода при наличии хорошей, стандартной базы уходит значительно
меньше. Это и масштабируемость проекта, когда разработчики предусматривают большой запас прочности для ежедневных посещений, а в пиковые часы сайт работает в штатном режиме, не требуя дополнительного масштабирования.
Скорость создания HTML-страниц и общее время загрузки очень сильно влияет на доступность сайта. Ключевым параметром здесь является загрузка за 4 секунды и более быстрая загрузка, чем у основных конкурентов. В отсутствии основных преимуществ на рынках с высокой конкуренцией скорость работы сайта может оказаться решающим фактором при принятии решения со стороны конечного пользователя.
Для решения проблем, связанных с медленной скоростью загрузки сайта, прежде всего, нужно начинать с профессионального подхода при разработке какого-либо веб-приложения. Он обязательно должен опираться на использование веб-стандартов, в том числе и в области скорости загрузки и взаимодействия с пользователем.
Для полноценной оптимизации крупные компании разрабатывают специализированные решения. Однако даже в этом случае они опираются на многочисленный свод правил, описывающих наиболее оптимальное взаимодействие браузера с пользователем. Для среднего размера сайтов, использующих какое-либо стандартное решение для обслуживания контента, стоит обратить свое внимание на решения по автоматизации клиентской оптимизации. Подробнее они описаны в седьмой главе.
Наконец при разработке сайтов стоит руководствоваться принципом мягкой деградации , согласно которому нужно наращивать функциональность в зависимости от способности браузера, а не наоборот. Например, можно использовать самые передовые технологии при верстке, которые поддерживаются не очень большим числом браузером, но должны поддерживаться значительной их долей, скажем, через год. Тогда определенные решения будут выглядеть безупречно у небольшого числа пользователей, у остальных хорошо или приемлемо. Но с прогрессом интернета число последних будет стремительно уменьшаться.
Также стоит упомянуть про возможность использования распределенной сети серверов для сведения времени ответа к минимуму. В этом могут помочь существующие системы распределенных вычислений и обработки запросов, такие как: Amazon S3, Google Apps, Microsoft Azure. Также аналогичная система есть и на российских просторах. Это первая в России CDN NGENIX (http://ngenix.net/), подробнее о CDN рассказывается в пятой главе.