ИТ Блог. Администрирование серверов на основе Linux (Ubuntu, Debian, CentOS, openSUSE)
Сегодня мы поговорим немного подробнее о конкретных процессах, связанных с повышением скорости вашего сайта по множеству показателей.
Мы рассмотрим следующие показатели:
Итак, без лишних слов, приступим.
CDN – необходимость для любого высокопроизводительного веб-сайта. CDN – это сеть доставки контента, которая в основном представляет собой набор серверов, на которых размещаются файлы контента, такие как изображения, видео и т. Д. Причина, по которой веб-сайты с поддержкой CDN работают быстрее, чем те, которые не работают, просто связана с нагрузкой на сервер.
Идея распределения данных между несколькими серверами обеспечивает большую скорость. Это связано с тем, что серверы CDN распределены географически, и сервер, обслуживающий конкретного пользователя, выбирается на основе близости пользователя к серверу. Пользователь в Индии будет предпочитать доступ к контенту с сервера в Китае, а не в России.
Ведущими поставщиками CDN являются Akamai Technologies, Level3 и Amazon Web Services.
Думаете о масштабировании изображений в HTML? Если да, позвольте нам прояснить, это плохая идея! Не делай этого. Если ваше изображение должно быть 100 на 100 пикселей, но на самом деле его размер 5000 на 5000 пикселей и вы масштабируете изображение в HTML, вы делаете это неправильно.
Для уменьшения размера изображения лучше использовать Smush.it. Инструмент Smush.it Yahoo уменьшает стиль изображения за счет сжатия без потерь, то есть сохраняет качество при значительном уменьшении размера изображения.
Во-вторых, вы можете использовать масштабирование CSS, например <img style = “width: 100px; высота: 100px;” src =”image.jpg” />.
Это одна из самых распространенных проблем, когда дело касается медленных веб-сайтов. Признаком медленного сайта является огромное количество HTTP-запросов, которые требуют времени и, как следствие, раздражают пользователя. HTTP-запросы могут варьироваться от загрузки файлов сценариев, файлов CSS и т. д.
Давайте посмотрим, что помогает уменьшить количество HTTP-запросов и сделать работу пользователя более быстрой и плавной. Веб-мастер или веб-разработчик могут уменьшить количество HTTP-запросов следующими способами:
Важно минимизировать ваши файлы JS и CSS во время производства. Для тестирования и разработки – да, вы можете использовать неминифицированные версии, но в остальном – нет. Возможно, вы видели, как ведущие CSS-фреймворки, такие как Twitter bootstrap, предоставляют уменьшенную версию своего CSS для производственного использования, и в этом причина: они быстрее загружают сайты.
Если вы используете jQuery, вам необходимо использовать уменьшенную версию. Даже у других первоклассных JS-библиотек есть уменьшенная версия для производственного использования. Теперь вам должно быть интересно, что такое минифицированная версия, будь то JS или CSS. Что ж, ответ довольно прост.
Минифицированная версия – это файл, который весит меньше, чем неминифицированный, потому что в коде нет пробелов, что позволяет сэкономить значительное количество килобайт. Вы можете использовать https://cssminifier.com/, чтобы минимизировать свой код CSS. Аналогичным образом, для JavaScript вы можете проверить http://jscompress.com/. Кстати, этот процесс минификации кода также известен как сжатие кода.
Использование встроенных стилей CSS работает, но не рекомендуется. Встроенный стиль – это стиль CSS, применяемый к разметке HTML напрямую, как <p style = “color: red;”> Текст </p>. Рекомендуется избегать использования встроенных стилей CSS и лучше объединить весь код CSS в отдельный файл CSS.
Мы используем Image Sprites, потому что они просто делают вещи в 2 раза быстрее. Как? Это связано с тем, что спрайт изображения включает в себя несколько разных изображений в одном файле. Например, большинство панелей навигации используют спрайты изображений вместо отдельных изображений. Это хорошая практика. Это позволяет странице загружаться быстрее, так как клиентская сторона должна загружать одно изображение вместо множества разных, что значительно ускоряет работу!
Когда страница загружается, она загружает HTML, CSS и JavaScript. Рекомендуется размещать таблицы стилей CSS вверху, а скрипты JS – внизу. Это связано с тем, что таблицы стилей CSS обычно легче, и это помогает быстро отображать страницу. JavaScript может появиться позже, так как он не требуется для визуализации страницы (т. е. Того, как она выглядит).
Также рекомендуется использовать внешние файлы CSS и JavaScript, то есть избегать наличия кода CSS или JS в разметке HTML. Это загружает страницы быстрее и становится еще лучше, если вы используете CDN.
(1 оценок, среднее: 5,00 из 5)
Загрузка...
