Оптимизация блога

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

Первый совет заключался в более агрессивном уменьшении разрешения и качества изображений.

После эксперимента решил, что качество ниже 70 мне не подходит, а вот разрешение уменьшить нужно. Однако, хочется чтобы на экранах с повышенной плотностью пикселей, типа ретины, качество не страдало. Для этого можно использовать атрибут srcset — с помощью него можно задать изображение для тега img в зависимости от ширины экрана или от плотности пикселей.

Подробнее ознакомившись с этой темой, решил ещё поэкспериментировать с размерами и дописать скрипт, чтобы все варианты размеров генерировал автоматически. И желательно ещё автоматизировать указание размеров в самой разметке страницы. «Но потом, не сейчас»

Второй совет заключался в использовании модуля PageSpeed для Nginx.

Для того, чтобы не засорять систему разнообразными пакетами программ и библиотек, я все веб-сервисы на своём сервере запускаю в виде докер-контейнеров. Найти образ контейнера с Nginx и этим модулем на первый взгляд показалось пустяковым делом — обычно полезные вещи уже есть в репозиториях популярных дистрибутивов линукс или в виде готовых контейнеров. Однако, готового пакета для стандартного базового дистрибутива Alpine Linux не нашёл. Не особо удивился, потому что дистрибутив в последнее время достаточно популярный, но только как база для образов Докера и всяких микрокомпьютеров. А вот отсутствие готового ПО для CentOS и Debian удивило. Тем не менее, нашлось изрядное количество образов на гитхабе.

Проблема обнаружилась, когда часть из них не смогла собраться, а часть использовала старые версии программ или предоставляла не подходящий мне интерфейс. В итоге нашёл нужный образ, немного подправил его и, казалось бы, можно разворачивать и заменять мой стандартный Nginx. Но нет — PageSpeed не может быть скомпилирован отдельно и подключён к уже готовому Nginx, нужно компилировать Nginx заново вместе с модулем. Это требует достаточно много времени даже на восьми ядрах, которые у меня выделены для Докера. К слову сказать, основное время занимает компиляция самого модуля. В итоге, запустить сборку на своём одноядерном сервере я не решился. Пришлось собирать на ноутбуке, упаковывать образ в архив, отправлять на сервер, там распаковывать и потом уже запускать.

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

В Айфель на велосипедах 🚵🏽‍♂️

Вид из нашего номера

Вид из нашего номера

Мотивация

В Германии пасха является праздником, но так как она всегда приходится на воскресенье, хитрые немцы сделали выходными днями также пятницу перед пасхой (Good Friday) и понедельник после (Easter Monday). На самом деле, эта практика применяется во многих европейских странах, при этом в некоторых странах выходным является только один из двух дней.

Выбор движка для блога

Не сразу удалось определиться, какой функционал мне нужен в моём блоге. Изначально хотелось чего-то простого и чтобы хостилось на моём сервере, а не где-то там, поэтому вещи типа Медиума не подходили. Посмотрел Эгею — выглядит замечательно, предельно простой в обращении (если нет необходимости добавить или изменить функционал). Но не понравилось несколько вещей.

Скачивание вложений из телеграма пачкой

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

Делается всё элементарно, шаги такие:

  1. Идём на https://my.telegram.org и генерируем api id и api hash
  2. Устанавливаем Telethon командой pip3 install telethon
  3. Запускаем код по примеру ниже (надо заменить значения api_id и api_hash на те, которые сгенерировали на первом шаге, а также username — это имя чатика):
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
from telethon import TelegramClient

api_id=123456
api_hash='secretHashYO'

client = TelegramClient('test_session', api_id, api_hash)
client.start()
# Далее потребуется ввести ваш номер телефона и код подтверждения

for message in client.get_messages('username', limit=25):
    message.download_media()

Код выше скачает все вложения их последних 25 сообщений чата.

Оптимизация картинок для блога

В ходе знакомства с возможностями движка блога столкнулся с проблемой большого размера изображений. Большую часть фотографий я делаю на телефон, камера которого имеет разрешение 13 мегапикселей. Получаются фотографии формата JPEG и разрешением 4208×3120. Размер таких фотографий сильно зависит от содержимого, обычно — 1-5Мб. Ниже пример картинки, её размер — 4Мб, что многовато для веба.

Исходное изображение 4Мб

Исходное изображение 4Мб

Та же самая картинка после оптимизаций имеет размер 370Кб — примерно в 10 раз меньше.

Оптимизированное изображение 370Кб

Оптимизированное изображение 370Кб

Визуальной разницы нет, а польза налицо.