Школа
Веб-разработка

Как работает обратный отсчёт в письме

Вопрос для Василия и Игоря.

Расскажите, пожалуйста, как работает обратный отсчёт в письме «Последний день, чтобы подписаться на лекции бюро со скидкой 30%»?

Я привык к тому, что обычно в таких письмах в обратном отсчёте статическая гифка, которая отсчитывает 20 секунд. В вашем письме каждое открытие письма подгружает новую картинку, и обратный отсчёт почти всегда актуален.

Как это работает? Подключение внешней картинки с отсчётом с выключенным кешированием? Есть ли какие‑то сложности, которые не видны с первого взгляда?

Михаил Озорнин
5 авг 2021
👁 6168   🗩2
Веб-разработка

Как работает обратный отсчёт в письме

Вопрос для Василия и Игоря.

Расскажите, пожалуйста, как работает обратный отсчёт в письме «Последний день, чтобы подписаться на лекции бюро со скидкой 30%»?

Я привык к тому, что обычно в таких письмах в обратном отсчёте статическая гифка, которая отсчитывает 20 секунд. В вашем письме каждое открытие письма подгружает новую картинку, и обратный отсчёт почти всегда актуален.

Как это работает? Подключение внешней картинки с отсчётом с выключенным кешированием? Есть ли какие‑то сложности, которые не видны с первого взгляда?

Михаил Озорнин
5 авг 2021
👁 6168   🗩2
Василий Половнёв
Технический директор бюро
Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать

Михаил!

Мы взяли готовый сервис — NiftyImages. Со временем хотим перейти на самописный, потому что NiftyImages медленно отдаёт картинки и стоит $250 в месяц.

Чтобы написать свой, мы разобрались, как устроены таймеры в NiftyImages. Таймер — это гифка, которая генерируется при каждом запросе к ней:

В каждом таймере — 35 кадров. Дедлайн отсчёта задаётся юникс‑таймом в часовом поясе Москвы, поэтому таймер не ломается при смене часовых поясов у клиента

Чтобы гифка обновлялась, её отдают с явно выключенным кешированием:

GET https://img1.niftyimages.com/...?dt=...&format=epoch

cache-control: no-cache, no-store
expires: -1
pragma: no-cache

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

Самая большая сложность — производительность. Генерация каждой гифки занимает примерно 350 мс. Если не предусмотреть кеширование и ограничения по количеству одновременных запросов, легко заддосить сервис пачкой параллельных запросов.

P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.

Веб‑разработка
Полезно
Непонятно
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментариев пока нет

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы