Ускорение сайта по советам Google: PageSpeed Insights

21.05.2018 09:14:16 pm

Инструмент Google: PageSpeed Insights тестирует сайт и выводит недостатки, которые препятствуют скорости ресурса. Следуя советам "PageSpeed Insights" можно сделать загрузку сайта быстрее. В этой теме я постараюсь подробно рассказывать о советах, что дает "PageSpeed Insights" и как их следует выполнять.

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

# Modify Headers
<IfModule mod_expires.c>
	ExpiresActive On

	# Cache files
	<FilesMatch "\.(js|css|ico|pdf|flv|jpg|jpeg|png|gif|swf|mp3|mp4)$">
		Header set Cache-Control "public"
		ExpiresDefault "access plus 2 months"
	</FilesMatch>
</IfModule>

Перечисление файлов, которые необходимо кэшировать: js|css|ico|pdf|flv|jpg|jpeg|png|gif|swf|mp3|mp4.

Для серверов Nginx:

	location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|js|swf|txt|ico)$ {
		expires 7d;
	}

Перечисление файлов, которые необходимо кэшировать: jpg|jpeg|gif|png|ico|css|js|swf|txt|ico.

Кстати, на Nginx, заметил: установка значения expires менее семи дней "не заметна" для PageSpeed Insights, чуть подробнее в теме: PageSpeed Insights: Используйте кеш браузера (Nginx).

Жалоба

22.05.2018 01:36:40 pm

Совет Включите сжатие. Перед отправкой файлов на компьютер пользователя можно их сжимать, тем самым уменьшать вес страницы в целом. Сразу покажу, как можно сжимать файлы: Для серверов Apache:

# Compress JavaScript & CSS
<IfModule mod_deflate.c>
	<FilesMatch "\.(js|css)$">
		SetOutputFilter DEFLATE
	</FilesMatch>
</IfModule>

Тут: js|css перечисляем файлы, которые необходимо сжимать перед отправкой.

Для серверов Nginx:

	gzip on;
	gzip_comp_level 5;
	gzip_disable "msie6";
	gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript;

Перечислять файлы, которые предварительно надо сжать в Nginx, тут:

text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript

Жалоба

23.07.2018 05:56:40 pm

Если вам Гугл дает совет Оптимизируйте изображения, значит его система обнаружила, что картинка/картинки весят больше, чем могли бы весить, оставаясь в текущем качестве.

Одно время я писал сценарий, который сжимает картинку, делает ее легче, а значит загружаться она будет быстрее. Сценарий доступен в теме: Оптимизация картинок сайта на PHP (Сжатие).

Жалоба

24.07.2018 07:46:22 am

Совет Сократите CSS, говорит о том, что у вас подключаемые файлы стиля к документу могут занимать меньше места, чем в данный момент. Скорее всего код классов стиля выглядит так:

body {
	background-color: #FFFFFF;
	font: 12px Verdana, Arial, sans-serif;
	line-height: 13px;
	margin: 3px auto;
	width: 860px;
}

div {
	vertical-align: top;
	overflow: hidden
}

table {
	width: 100%;
}

В коде можно убрать лишние табуляции, пробелы и переносы строк, в результате получим сжатый код:

body{background-color:#FFFFFF;font:12px Verdana,Arial,sans-serif;line-height:13px;margin:3px auto;width:860px;}div{vertical-align:top;overflow:hidden}table{width:100%;}

Экономится несколько байт.

Как программно сжимать код стилей, я рассказывал в теме: Компрессор CSS кода (Сжатие файлов на PHP). Если у вас движок phpBB, то вам в тему: Сжатие CSS кода в phpBB.

Жалоба

24.07.2018 11:08:50 am

Так же, как и Сократите CSS, Google может порекомендовать сократить JavaScript, то есть удалить лишнее: табуляции, переносы строк, пробелы и комментарии, все, как с CSS.

Пример сценария для сжатия JS кода, можно глянуть в теме: Сжатие JS кода в phpBB.

Возможно, будет интересно:
- Удаление комментариев из JavaScript на PHP

Жалоба