Разгони свой сайт

Вопрос скорости загрузки веб-страниц привлекает внимание всех веб-разработчиков уже очень давно — практически с того момента, как в HTML-документе появились картинки и веб-страницы вышли на уровень взаимодействия с пользователями, а не только предоставления им необходимой информации.

За последние 10 лет уже многократно менялся сам подход к созданию сайтов. В эпоху браузерных войн и ограниченного доступа по модему наиболее важными аспектами клиентской производительности (отвечающей за скорость загрузки и работы веб-страницы) были ускорение передачи данных и ускорение отображения этих данных при использовании многоуровневых таблиц на странице. О блочной верстке и семантической разметке тогда просто не думали.

Но ситуация изменилась. Сейчас средняя веб-страница уже крайне тяжело вписывается в установленные когда-то рамки «загрузка за 10 секунд на модеме». В среднем на ней используются десятки различных объектов, и не всегда это только картинки. Объем файлов скриптов, обеспечивающих взаимодействия пользователя с веб-страницей, сейчас уже намного превышает размер предоставляемой на этой странице информации. И мир движется в сторону усложнения взаимодействия человека с машиной, а никак не в обратную.

Данное издание старается объединить в себе все современные подходы к построению высокопроизводительных веб-приложений и просто веб-сайтов, которые быстро загружаются. Подавляющая часть материалов книги уже была опубликована в 2008 году на сайте Web Optimizator ( http://webo.in/ ), из них были отобраны наиболее актуальные и проверенные на практике решения, которые и вошли в основу этой книги.

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

Идея организовать ресурс, как посвященный теоретическим аспектам оптимизации времени загрузки веб-страницы, так и предлагающий online-инструменты для этой самой оптимизации, появилась после обсуждения на конференции ClientSide'2007 ( http://client2007.ru/ ), где на фоне общего интереса к затронутой проблеме была задана пара вопросов о рассмотрении частных практических случаев.

За основу online-инструмента были взяты замечательные примеры с Web Site Optimization ( http://www.websiteoptimization.com/ ), OctaGate SiteTimer ( http://www.octagate.com/service/SiteTimer/ ) и Pingdom Tools ( http://tools.pingdom.com/fpt/ ), краткий обзор которых приводится в восьмой главе. Все эти сервисы являются англоязычными и предлагают достаточно широкий спектр инструментов для анализа скорости загрузки сайта. Однако русскоязычного сервиса на тот момент на было, и выдаваемая информация не являлась достаточно точной. Поэтому основным отличием от этих инструментов стало наличие максимально детальных советов по каждому анализируемому веб-сайту, которые, по идее, должны помочь веб-разработчикам предпринять конкретные действия для улучшения качества своего продукта.

Именно с этой целью и был создан Web Optimizator ( http://webo.in/ ).

Книга не увидела бы свет без помощи, советов и рекомендаций огромного количества людей. Каждый из них добавил что-то новое в нижеизложенный материал, поэтому у меня просто не получится упомянуть всех, кто внес свой вклад в создание статей и развитие ресурса, посвященного клиентской оптимизации, — перечислить всех не представляется возможным. И все же некоторым людям хочется сказать отдельное спасибо за их замечания и поддержку.

Во-первых, хочу высказать персональную благодарность Виталию Харисову за несколько очень своевременных замечаний относительно производительности CSS-движка в браузерах, которые подвигли меня изучить эту проблему более глубоко и совершить настоящий прорыв в понимании функционирования данной части браузеров.

Во-вторых, нельзя не упомянуть Павла Димитриева и его замечательный перевод классических советов от группы разработчиков Yahoo! (часть 1, http://webo.in/articles/habrahabr/15-yahoo-best-practices/ ), которые послужили отправной точкой в оптимизации скорости загрузки для многих тысяч веб-разработчиков.

Значительный вклад в продвижение идей «ненавязчивого» JavaScript и обратной совместимости в работе веб-сайтов (когда пользователь может взаимодействовать со страницей и с отключенным JavaScript или CSS) был внесен Дмитрием Штефлюком ( http://kpumuk.info/ ), Андреем Миндубаевым ( http://covex.in.nnov.ru/ ), Андреем Суминым ( http://jsx.ru/ ), Павлом Корниловым ( http://lusever.ru/ ), Павлом Довбушом ( http://dpp.su/), Вадимом Макеевым ( http://pepelsbey.net/ ) и Артемием Трегубенко ( http://arty.name/ ). Их идеи легли в основу некоторых частей данной книги.

Также необходимо упомянуть Евгения Степанищева ( http://bolknote.ru/ ), предложившего альтернативу data:URI-подхода для Internet Explorer, что позволило расширить этот метод для всех браузеров и составить реальную конкуренцию CSS Sprites. И Александра Лозовюка ( http://abrdev.com/ ), который смог найти время и дополнить предварительную версию рукописи своими замечаниями по использованию различных инструментов для анализа и автоматизации ускорения загрузки.

Естественно, нельзя обойти вниманием всех моих соратников по российскому крылу Web Standards Group ( http://web-standards.ru/ ). Не опираясь на их мощную профессиональную поддержку, освещать такую сложную и неоднозначную тему, как клиентская оптимизация, было бы весьма непросто.

Кроме этого Антон Лобовкин ( http://anton.lobovkin.ru/ ), Денис Кузнецов ( http://q-zma.com/ ), Евгений Кучерук ( http://kuklaora.blogspot.com/ ), Иван Никитин ( http://ivan-nikitin.spaces.live.com/ ), Алексей Басс ( http://alexey-bass.blogspot.com/ ), Владимир Юнев ( http://blogs.gotdotnet.ru/personal/XaocCPS/ ), Павел Власов ( http://zencd.livejournal.com/ ), Артем Курапов ( http://kurapov.name/ ), Алексей Тен.( http://lynn.ru/ ), Константин Бурнаев ( http://bkonst.livejournal.com/ ), Timur Vafin ( http://timurv.ru/ ), Денис Воробьев ( http://alfa.1nsk.ru/ ), Алексей Хоменко ( http://core.freewheel.ru/ ), Паша Друзьяк ( http://ilive.in.ua/enej/ ), Иван Курносов ( http://www.mzz.ru/ ) и многие-многие другие поделились полезными методиками, примерами конфигурационных файлов и просто ценными советами, за что им также огромное спасибо.

И конечно, обязательно хочу поблагодарить всех пользователей Web Optimizator ( http://webo.in/ ) и читателей блога Клиентская оптимизация ( http://habrahabr.ru/blogs/client_side_optimization/ ). Без их моральной поддержки и веры в благое начинание эта книга никогда не была бы опубликована.