15 способов ускорить ваш сайт

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


Всего за одну секунду:

  • Количество просмотров вашей страницы может сократиться на 11 процентов ��
  • Уровень удовлетворенности клиентов может упасть на 16 процентов ��
  • Вы можете столкнуться с 7-процентным снижением коэффициента конверсии.

В течение года эта задержка в одну секунду может привести к падению выручки на 2,5 млн. Долл. США для компаний, которые обычно составляют в среднем 100 000 долл. США в день продаж.

Короче говоря, задержка Враг производительности сайта и удовлетворенности пользователей. Пятьдесят три процента потребителей заявляют, что они покинут веб-сайт, загрузка которого заняла более трех секунд.

Что такое латентность и почему это важно?

Есть три компонента, которые способствуют скорости доставки данных: пропускная способность, задержка и пропускная способность. В сочетании с оптимизированным контентом и кодированием эти элементы идут рука об руку. Проблемы с одним будут влиять на другие.

изображение, показывающее задержку и скорость сетиПропускная способность это конвейер, по которому перемещаются ваши данные. Узкая полоса пропускания уменьшает количество информации, которая передается по этому конвейеру в любой момент времени. Это приводит к проблемам с задержкой и влияет на пропускную способность.

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

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

Что способствует высокой задержке?

  • распространения. Это промежуток времени, необходимый для перемещения пакетов данных из одного источника в другой..
  • Среда передачи. Мы прошли долгий путь со времен дозвона, но среда передачи все еще влияет на задержку. Даже такие технологические достижения, как волоконная оптика и глобальная сеть, имеют физические ограничения, которые влияют на скорость доставки контента..
  • Маршрутизаторы. То, что мы можем сделать с помощью щелчка мыши или ввода URL-адреса, приводит в движение цепочку событий, которая позволяет нам получить доступ к Интернету. По мнению рядового пользователя, запрос выполняется и выполняется со скоростью света. Однако это зависит от способности нашего маршрутизатора правильно анализировать заголовки пакетов и другую информацию..

Чем больше распределена сеть, тем больше раз пакет должен переходить от маршрутизатора к маршрутизатору. Это способствует высокой задержке.

  • Место хранения. Задержки происходят каждый раз, когда пакет данных успешно или сохранен. Процесс еще больше усложняется количеством коммутаторов и мостов, возникших между первоначальным запросом браузера и доставкой. Смотрите похожие – лучшее облачное хранилище
  • Форматирование То, как вы настраиваете файлы и управляете базами данных WordPress, влияет на то, как инструкции и код читаются и обрабатываются. Чистый, компактный и элегантный код обеспечивает эффективность и скорость.
  • Типы файлов и размеры. Разумеется, файлы меньшего размера и более простое форматирование будут проходить через сеть быстрее и эффективнее. Сайты с большим количеством графики и других мультимедийных материалов выглядят более загроможденными, и это влияет на скорость загрузки страниц. Вот почему важно сжать файлы вашего сайта.

Преимущества оптимизации вашего сайта

Независимо от того, решите ли вы использовать высококачественный конструктор веб-сайтов, нанять веб-дизайнера или создать свою веб-страницу самостоятельно, учитывая безопасность и скорость разработки, вы улучшите внешний вид и доставку своего контента. Это помогает с SEO оптимизация и обеспечивает лучшее пользовательский опыт (UX).

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

15 способов повысить скорость работы в сети сегодня

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

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

1. Включить сжатие файлов

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

Для этого установите плагин сжатия для вашей системы управления контентом или вручную через файл .htaccess. Это будет работать для CSS, JS, XML и HTML, добавив следующий код:

AddOutputFilterByType DEFLATE text / plain
AddOutputFilterByType DEFLATE text / html
AddOutputFilterByType DEFLATE text / xml
AddOutputFilterByType DEFLATE text / css
AddOutputFilterByType DEFLATE application / xml
AddOutputFilterByType DEFLATE application / xhtml + xml
AddOutputFilterByType DEFLATE application / rss + xml
AddOutputFilterByType DEFLATE application / javascript
AddOutputFilterByType DEFLATE application / x-javascript

2. Удалите ненужные плагины и расширения

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

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

3. Оптимизировать HTTP

Есть два способа улучшить время загрузки страницы с помощью оптимизации HTML. Первый – минимизировать ваши HTTP-запросы. Вы можете сделать это несколькими способами:

  • По возможности используйте CSS вместо изображений
  • Объедините файлы CSS, JS и HTML, чтобы избежать раздувания и избыточности
  • Создавайте чистые, простые страницы с меньшим количеством элементов
  • Включить кеширование
  • Сократите количество перенаправлений, удалив старые страницы и неработающие ссылки.

Второй способ оптимизировать HTML – включить Keep-Alive. Обычно каждый запрос файла инициирует отдельное действие. Включив HTML Keep-Alive, вы создаете одно открытое соединение, которое остается таким до тех пор, пока все запросы браузера не будут выполнены. Просто скопируйте этот фрагмент кода в ваш файл .htaccess, окруженный соответствующими открывающими и закрывающими тегами:

IfModule mod_headers.c
Заголовок набора Поддержание соединения
IfModule

4. Установите сеть доставки контента (CDN)

Сети доставки контента (CDN) сократить время загрузки страницы так же, как серверы. Эти сети распределены по разным точкам земного шара, что позволяет кому-то в этой геолокации получить доступ к вашему веб-сайту ближе к дому..

Многие хостинг-сервисы включают CDN как часть своего сервиса, поэтому проверьте доступность, прежде чем входить в систему с кем-либо. Смотрите связанные – лучшие канадские CDN

5. Включить кеширование

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

Кэширование в WP можно включить с помощью плагина Rocket или с помощью одного из бесплатных плагинов, таких как WP3 Total Cache или Super Cache. Те, кто использует HTML, могут включить кэширование с помощью Etags, Expire или других методов. Пользователи Drupal могут включить кеш, следуя этим инструкциям.

6. Сократите код JS и CSS

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

7. Используйте асинхронную загрузку файлов JS и CSS

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

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

Большинство систем управления контентом имеют механизм, позволяющий загружать асинхронные файлы CSS и JS. Например, WordPress имеет вкладку «Статические файлы» в своем плагине Rocket, которая позволит вам включить эту функцию, установив соответствующие флажки в разделе «Блокировка рендеринга CSS / JS». Пользователь не-WP может включить это в JS, используя атрибут async или defer. Для CSS попробуйте написать стили для первого экрана в заголовке HTML, чтобы включить асинхронную загрузку первой страницы..

Отложенная загрузка JavaScript может привести к тем же результатам, и ее можно включить в том же разделе панели WP Rocket, что и параметры загрузки. Если вы работаете с сайтом в HTML, вы можете отложить загрузку JS, вызвав внешний файл непосредственно перед тегом body в вашем коде, например так:

8. Оптимизируйте файлы изображений

Один из крупнейших источников ресурсов и баз данных – изображения. Конечно, фотографии добавят к вашему контенту, но слишком много также повлияет на скорость и увести трафик. Если вам необходимо включить изображения на свой веб-сайт, выберите одно или два, уменьшите их размер и тип файла до чего-то более эффективного, например .jpeg, или превратите их в коллаж, а не в галерею отдельных изображений. Вы также можете переместить их на платформу, созданную для изображений, например, InstaGram, и просто перейти на эту платформу с вашего веб-сайта..

То же самое относится и к видеоконтенту, который можно удалить на канал YouTube. Оба эти решения также помогут с SEO, так как вы можете оптимизировать их отдельно, используя комбинацию alt-тегов для индексации изображений и видеоконтента и SEO на странице для общей оптимизации страницы. Одним из наших любимых является Optimizilla.

9. Отключите Hotlinking и ограничьте акции в социальных сетях

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

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

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

10. Уменьшить внешние скрипты

Добавление внешних скриптов vi JS-код увеличивает количество HTTP-запросов, что снижает скорость работы сайта. Некоторые внешние скрипты необходимы, поэтому вам не нужно полностью их удалять. Pingdom позволяет тестировать каждую внешнюю ссылку, чтобы определить, что вызывает проблему.

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

11. Найти и исправить неработающие ссылки

Любые неработающие ссылки, которые заканчиваются перенаправлениями или сообщениями об ошибках, могут повлиять на UX. Однако этот совет относится к ссылкам, содержащимся в вашем изображении, JS или CSS-файлах. Найдите и протестируйте ссылки в заголовке ваших CSS-файлов и в URL-адресе исходного кода JavaScript. Вы можете искать их вручную, просматривая журналы сервера или используя инструмент проверки ссылок.

12. Оптимизируйте свои базы данных

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

оптимизация базы данных

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

13. Используйте легкие темы

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

Как и в случае с плагинами, обязательно удалите старую тему, а не отключайте ее.

14. Выберите хорошую систему управления контентом

Системы управления контентом (CMS) имеют решающее значение для поддержания надежной скорости и производительности. Самым популярным на сегодняшний день является WordPress, но есть также Joomla, Drupal и многие другие. Они предлагают преимущество оптимизации контента и наличие плагинов или функций, повышающих производительность..

15. Выберите свой хостинг с прицелом на производительность

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

Это означает не только выбор плана, который позволит вам справиться с резкими скачками и ростом трафика, но также поиск поставщика с технологией для поддержки производительности. Общие планы хостинга – это нормально, если вы только начинаете и используете больше статического контента. Однако ваша скорость и доступность ресурсов иногда зависят от хороших соседей.

По возможности выбирайте качественную виртуальную частную сеть (VPN), или Выделенный сервер. Это обеспечит вас ресурсами, хранилищем и доступностью, необходимыми для сокращения времени простоя и задержки..

Не забывайте о тестировании и текущей оценке

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

Независимо от того, какой метод или инструмент вы используете, обязательно проводите тестирование в разных местах. Разумеется, серверам, расположенным дальше от источника, потребуется больше времени для доставки контента. Геотестирование из нескольких мест поможет вам определить уровень задержки. При проведении теста скорости делайте это как с включенным, так и отключенным CDN. Это поможет вам оценить эффективность вашего CDN и других технологий.

как работает CDN

Одним из наиболее распространенных и эффективных инструментов тестирования скорости является Pingdom. Этот бесплатный онлайн-инструмент – это простой способ определить диапазон проблем с производительностью и скоростью работы сайта. Вы просто вводите свой URL и местоположение сервера в поле поиска и нажимаете «Начать тест». Вы также можете приобрести премиум-подписку для более глубокого тестирования работоспособности и типов контента с более чем 70 серверов.

Это пример теста ping с использованием общедоступного DNS Google:

$ ping 8.8.8.8
PING 8.8.8.8 (8.8.8.8): 56 байтов данных
64 байта из 8.8.8.8: icmp_seq = 0 ttl = 56 время = 54,524 мс
64 байта из 8.8.8.8: icmp_seq = 1 ttl = 56 время = 43,423 мс
64 байта из 8.8.8.8: icmp_seq = 2 ttl = 56 время = 50,773 мс

Инструмент traceroute будет отслеживать прохождение пакетов от сервера к серверу, измеряя маршрут от браузера к хосту и выявляя любые узкие места или другие проблемы..

Вот пример отчета команды traceroute с использованием того же Google DNS:

$ traceroute 8.8.8.8
трассировка до 8.8.8.8 (8.8.8.8), максимум 64 прыжка, 52-байтовые пакеты
1 192.168.0.1 (192.168.0.1) 6,632 мс 9,659 мс 10,089 мс
2 10,89,0,1 (10,89,0,1) 29,867 мс 14,293 мс 30,259 мс
3 blk-212-126-117.eastlink.ca (173.212.126.117) 20,677 мс 19,575 мс 20,155 мс
4 ns-hlfx-dr002.ns.eastlink.ca (24.215.102.161) 30,093 мс 29,371 мс 30,796 мс
5 ns-hlfx-br002.ns.eastlink.ca (24.215.102.221) 29,540 мс 29,516 мс 29,989 мс
6 ns-hlfx-br001.ns.eastlink.ca (24,215.102,9) 26,678 мс 29,203 мс 30,787 мс
7 google.eastlink.ca (24.215.101.10) 49,027 мс 49,196 мс 90,601 мс
8 209,85,241,127 (209,85,241,127) 49,999 мс
72.14.239.75 (72.14.239.75) 48,939 мс
72.14.235.169 (72.14.235.169) 46.823 мс
9 google-public-dns-a.google.com (8.8.8.8) 49,465 мс 45,436 мс 43,772 мс

Говоря о Google, у них также есть бесплатный инструмент для проверки сайтов на скорость и производительность. Вы можете получить доступ к их PageSpeed ​​Insights здесь.

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

Последние мысли

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

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map