Ускорение загрузки сайта: с чего следует начинать

07.10.2010 by Константин
Комментировать »
ускорение сайта

ускорение сайта

В прошлой статье «Ускорение загрузки сайта» мы говорили о том зачем необходимо уменьшать время загрузки сайта и какими инструментами можно воспользоваться для того что бы узнать время загрузки сайта. Теперь мы рассмотрим, на чем можно сэкономить столь драгоценное время загрузки.

Быстрый Хостинг

Первый момент, на котором следует остановиться это выбор хостинга для вашего сайта. Насколько бы хорошо ни был оптимизирован ваш сайт, на медленном сервере он будет работать медленно, как бы вы ни старались. Так же хостинг должен уметь пропускать большие объемы данных, для работы со всеми входящими подключениями.

Вы можете проверить скорость вашего хостинга воспользовавшись одним из следующих интернет сервисов серверов:

Оптимизированная графика

Оптимизация графики дает один из наибольших приростов производительности при загрузке сайта. Используйте графические файлы только тогда, когда это действительно нужно и следите за тем, чтобы ваш файл был оптимизирован. Для больших много цветных изображений, например, таких как фотографии, рекомендуется использовать файлы формата jpeg. Для остальной графики наиболее подходящим форматом, является формат png. Данный формат был разработан специально для интернета и является более экономичным, чем gif, но при небольших изображениях, таких как иконки, gif может быть более предпочтительным форматом. Так же файлы формата gif поддерживают анимацию. Изображения рекомендуется сохранять с прогрессивной (чересстрочной) разверткой.

Использование CSS и его оптимизация

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

Уменьшение количества HTTP-запросов

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

Сжатие JavaScript

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

Сжатие HTTP

Использование сжатие HTTP, как и оптимизация графики дает один из наибольших приростов в скорости загрузки сайта. Сжатие HTTP подразумевает под собой отправку пользователю сжатых данных, которые разархивируются уже непосредственно на клиентской машине. Сжатие HTTP позволяет сократить объем предаваемой информации на 60-70 процентов. Наиболее распространенным методом сжатия является использование GZIP.

Оптимизация SQL запросов к базе данных

Необходимо сократить количество SQL запросов к базе данных и как можно лучше оптимизировать их. Не забывайте использовать индексы при построении таблиц.

Использование одного изображения

Использование так называемой карты изображения – т.е. объединение всех изображений использованных на странице в одно. И настройка его отображение при помощи CSS команд background-image и background-position. Размер изображение равен сумме размеров всех изображений, но при его загрузке используется только один HTTP-запрос

ИТОГИ

Этот далеко неполный перечень того что может помочь вам сократить время загрузки сайта. Более подробно об оптимизации графики, сжатие CSS и JS файлов, использовании GZIP будет написано в следующих статьях.

Читайте так же:


1 звезда2 звезды3 звезды4 звезды5 звезд (Еще не оценили)
Загрузка ... Загрузка ...
Распечатать запись Распечатать запись
Реклама

2 комментариев(ия)

  1. Хороший пост. Осталось только грамотно всё реализовать на сайте.

  2. Елена says:

    Полезная инфа, а я как раз сейчас занимаюсь ускорением блога и обязательно воспользуюсь вашими советами. Спасибо!

Оставить комментарий