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

Ресурсы для проверки производительности сайтов
Основные советы по оптимизации сайта

Ресурсы для проверки производительности сайтов

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

Вот самые популярные из этих сайтов:

http://gtmetrix.com/ - показывает время загрузки всех элементов сайта, а также степень оптимизации сайта по алгоритмам PageSpeed и YSlow (подробнее о них).

https://developers.google.com/speed/pagespeed/insights/ - инструмент от Google, показывающий слабые места в оптимизации.

http://www.bytecheck.com/ - с его помощью можно проверить, в частности, параметр TTFB (Time To First Byte), на который часто обращают внимание при оптимизации (подробнее).

Основные советы по оптимизации сайта

Включение сжатия Gzip

Сжатие интернет трафика позволяет сократить время на передачу информации. Как это работает? После обработки запрошенных у сервера данных он их сжимает утилитой Gzip и отправляет клиенту (браузеру). Браузер после получения данных распаковывает их и обрабатывает. Причем сжатие происходит только для текстовых файлов. Выигрыш при этом происходит за счет времени передачи информации. Для включения сжатия воспользуйтесь статьей нашего Справочного центра "Gzip-сжатие веб-страниц"

Включение кэширования в браузере

Механизм кэширования доступен во всех популярных браузерах, однако в настройках сайта нужно указать, какие файлы можно сохранять и задать срок кэширования (дата, по истечении которой файлы будут удалены с жесткого диска).
Настроить кэширование для веб-браузера можно по инструкции: http://htaccess.net.ru/doc/Pass_Set_Env/cache4.php

Оптимизация изображений

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

При этом, если оригинальный размер изображения один, а на сайте должен быть другой (например, меньше), то рекомендуем изменить размеры и повторно сохранить изображение, используя редактор изображений вместо того, чтобы задать изображению новые атрибуты ширины и высоты в HTML. Если изменить только атрибуты, то у файла изображения по-прежнему останется большой размер, который будет дольше загружаться.

Инструменты, которые можно использовать для сжатия изображений, рассмотрены в данной статье: http://habrahabr.ru/post/168251/

Также для оптимизации изображения важно выбрать для него правильный формат (обычно выбор идет между JPG, PNG, и GIF). При этом оптимальнее будет сохранять большинство изображений в формате JPG, т.к. размер подобных файлов будет гораздо меньше, чем у PNG, соответственно, сократится и время загрузки. В форме GIF имеет смысл сохранить изображение с малым количеством цветов.

Более подробно данный вопрос рассмотрен в статье: http://it.sander.su/image-formats.php

Оптимизация CSS и JS

Общее правило: Размещайте CSS-файлы в head документа, а JS в конце body. Тем самым вы дадите браузеру сначала показать пользователю страницу, а потом выполнить JS-скрипт. Это поможет уменьшить время загрузки сайта, так как все функции и процессы, заложенные в JavaScript, будут выполняться после загрузки страницы. При этом CSS, которые прописаны в секции HEAD, позволяют ускорить рендеринг и устраняют проблему перерисовки элементов, если стили прописаны после вывода элементов.

Если CSS или JS-код мал, то лучше его встроить в код HTML-страницы, нежели создавать отдельный файл, который браузер будет скачивать.

Если же необходимо разместить код в отдельных файлах, то лучше объединить файлы стилей CSS в один. Это же правило справедливо и для JS-файлов.

Определяя всё в главном файле CSS, Вы позволяет браузеру делать меньше работы во время рендеринга страницы, так как он уже знает все правила стилей, которые ему надо применить. За счет уменьшения количества файлов достигается уменьшение HTTP запросов к серверу.

Подробная информация есть в статье об отсроченной загрузке JS: https://developers.google.com/speed/docs/insights/PrioritizeVisibleContent?csw=1#DeferLoadingJS

По завершении работы над проектом желательно уменьшить размер JS и CSS файлов, убрав из них лишние пробелы, табуляции и переносы. Это можно сделать с помощью онлайн-сервиса: http://refresh-sf.com/ 

Оптимизация кода сайта

Ряд полезных советов по оптимизации РНР-кода есть в статье: http://habrahabr.ru/post/22799/

Советы по оптимизации запросов к базе данных описаны в этой статье: http://recens.ru/mysql/32_tips_to_speed_up_mysql.html 

Также ряд статьей рекомендует использовать для оптимизации сайта акселераторы РНР и memcache-серверы.

Однако архитектура виртуального хостинга не предусматривает использования акселераторов PHP, также на хостинге нет memcache-сервера. Это связано с тем, что они создают высокую нагрузку на серверные мощности. Высокий уровень производительность достигается за счет определенной инфраструктуры, серверы хостинга объединены в кластер, нагрузка распределяется равномерно по нодам с помощью балансировщика нагрузки: http://kb.odin.com/en/114326

Возможно, вам также будут полезны эти статьи:

Что влияет на позицию сайта в поисковой системе?
Инструменты для проверки доступности сайта
Сайт взломан. Кто виноват и что делать?