2. Используйте Сеть доставки Контента (Content
Delivery Network).
Смысл CDN в том, что бы иметь
несколько географически распределенных серверов, которые используются,
для выдачи содержимого вашего сайта.
Данный подход стоит применять
только крупным проектам, когда все остальные способы уже себя
исчерпали.
На рынке есть множество компаний, предлагающих услуги CDN. Вот
наиболее известные Akamai Technologies, Mirror Image Internet,
или Limelight Networks.
3. Добавьте http заголовок Expires
Веб сайты становятся все больше
и больше. Больше скриптов, больше стилей, мультимедийный контент
и т.п. Зайдя на ваш сайт первый раз, посетителю придется загрузить
весь контент сайта. Добавление заголовка Expires, заставит браузер
сохранить уже загруженные элементы в кэше. Это позволит избежать
повторной загрузки этих элементов при повторном заходе на сайт.
Чаще всего данный заголовок используют
для картинок, но он также может подойти для javascript скриптов,
файлов стилей и флеш информации (то есть той, которая не часто
меняется).
Для установки данного заголовка
в веб сервере Apache можно воспользоваться следующей директивой:
ExpiresDefault "access plus 10 years"
В данном случае, директива указывает,
что необходимо перечитать содержимое сайта через 10 лет от даты
первой загрузки.
Будьте осторожны при установке
даты слишком далеко в будущее. Если вы все же измените файл
потом, то вам также придется поменять и его имя, что бы у ваших
пользователей он обновился до истечения срока указанного в заголовке
Expires.
4. Включите gzip сжатие для компонентов вашего
сайта
Все современные браузеры поддерживают
передачу содержимого веб сайта в сжатом виде. Это может существенно
сэкономить количество передаваемого трафика.
Однако у сжатия есть один отрицательный
момент. Данное действие, усиливает нагрузку на веб сервер, так
как ему необходимо сжимать страницу, каждый раз, когда она послается
ее клиенту.
В Apache 1.3 поддержкой сжатия
«занимается» модуль mod_gzip, а в Apache 2.x модуль mod_deflate.
5. Размещайте файлы стилей в начале документа.
Исследования Yahoo показали, что
размещение файлов стилей в заголовке страницы (в <HEAD>
секции) уменьшает общее время загрузки сайта, так как позволяет
браузеру отображать документ постепенно по мере загрузки.
Кроме того, в спецификации HTML
прямо указано, что все стили должны подключатся в <head>
секции. Однако, почти все браузеры позволяют включать стили
в любом месте текста документа, поэтому многие веб-дизайнеры
(или системы управления сайтом) пользуется этим.
6. Размещайте все скрипты внизу страницы.
Скрипты не так важны для отображения
сайта, как таблицы стилей. Поэтому, их рекомендуют размещать
в конце документа, что позволит загрузить сайт целиком и, лишь
затем, приступить к загрузке скриптов.
7. Не используйте выражения внутри CSS файлов.
CSS выражения – это мощный (и
опасный) инструмент, позволяющий изменять CSS свойства динамически.
Вот как можно задать разное значение цвета заднего фона в зависимости
от четности или не четности текущего часа:
background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF"
: "#F08A00" );
В данном случае вычисляется javascript
выражение, которое и используется для задания свойства.
Проблема в том, что данное выражение
вычисляется намного чаще, чем многие думают. Вычисление выражения
происходит не только в момент генерации страницы или изменения
ее размеров, но и при скроллинге страницы, и, даже, при наведении
на элемент мыши. Размещая счетчик в javascript'e такого выражения,
можно было увидеть, что количество вычислений легко может доходить
до нескольких тысяч.
Еще одной из причин не использовать
выражения в CSS является то, что их поддерживает только IE.
Многие хаки для IE используют CSS выражения. Прочитав данный
пункт, подумайте, а стоит ли их использовать.
Полезная инфрмация о каскадных таблицах
стиля CSS.
8. Делайте JavaScript и CSS внешними файлами
Использование внешних JavaScript
и CSS файлов дает лучший результат, так как позволяет браузерам
сохранять их в кэше, а не загружать каждый раз, когда пользователь
приходит на сайт. А это очень большое преимущество.
9. Уменьшайте количество DNS запросов.
DNS – осуществляет преобразование
доменных имен в IP адреса. Что бы сделать такое преобразование,
необходимо послать запрос к DNS серверу. На это уходит определенное
время. Пока запрос не завершился удачно, браузер не может продолжать
загрузку.
Вот почему, не желательно на вашем
сайте иметь элементы, загружаемые с разных доменов. Это может
привести к замедлению загрузки страницы.
10. Минифицируйте JavaScript
Термин «минификация» означает
удаление из кода различных символов, которые не несут смысловой
нагрузки. Например, комментарии, символы пробела, табуляции,
перевода каретки. Данное действие, может уменьшить размер JS
скрипта до 50%.
Существует несколько продуктов,
которые позволяют минифицировать JS код. Два наиболее популярных
из них это: JSMin и YUI Compressor.
11. Старайтесь не использовать редирект.
Редиректы бывают постоянными (301)
или временными (302). Получив заголовок с кодом 301 или 302,
браузер автоматически начинает загружать другую страницу, как
если бы именно ее запросил пользователь.
Редиректы замедляют попадание
пользователя на страницу, которую он хочет увидеть.
Однако, в некоторых случаях редиректы
необходимы (например, что бы перенаправлять пользователя со
старой версии сайта на новую).
12. Удалите дублирующиеся скрипты.
Здесь все ясно. Один и тот же
код не должен дублироваться на странице. Выносите одинаковую
функциональность в общие функции.
13. Сконфигурируйте Etags.
Теги содержимого (Entity Tags
– Etags) – это механизм, позволяющий браузерам узнать, соответствует
ли элемент в кэше браузера, элементу на сервере. Это поле более
гибкое, чем дата последней модификации компонента.
ETag– это строка, уникально идентифицирующая,
версию элемента на сервере.
При нахождении элемента в своем
кэше, браузер посылает на сервер запрос if_none_match. Если
элемент изменился, сервер отвечает 304 ошибкой и браузер скачивает
новую версию документа.
В Apache поддержка Etags включена
по умолчанию. Если вы хотите ее отключить, то используйте следующую
директиву: FileETag none
14. Сделайте свой Ajax код кэшируемым.
Ajax все больше входит в нашу
жизнь. В эпоху веб2.0 очень многие сайты используют Ajax. Поэтому
очень важно становится оптимизировать работу с ним.
Оптимизация Ajax подразумевает
применение к скриптам правил 3, 4, 9, 10, 11, 13.
Правило 3 – самое важное. Именно
оно управляет кэшированием скриптов.
Выводы
Такие нехитрые советы помогут
вам сделать ваш сайт "скоростным". Многие из них пересекаются
друг с другом, некоторые предназначены только для очень крупных
проектов, но в любом случае, о них желательно знать и понимать,
почему специалисты советуют именно это.
Еще статьи на тему: Оптимизация
и продвижение сайта
<<Предыдущая
сатья | Следующая сатья>>
S-PRO
студия веб дизайна
