Представляем Nostr-виджеты

Что это

Виджет — это SVG, отрендеренный на сервере. Вы встраиваете его одной строкой HTML:

<a href="https://nostr-wot.com/p/npub1gxdhmu9..." target="_blank" rel="noopener">
  <img
    src="https://nostr-wot.com/widgets/profile/npub1gxdhmu9..."
    alt="Leon Acosta в Nostr"
    width="320"
    height="220"
  />
</a>

Вот и всё. Никакого тега <script>, никакого iframe, никакого JavaScript-фреймворка. Изображение — это статический SVG, генерируемый на нашем сервере по живым данным Nostr, агрессивно кэшируемый и отдаваемый с правильными заголовками Cache-Control и ETag. Это работает в генераторах статических сайтов, в Notion, в Substack, в README на GitHub и в любом markdown-совместимом редакторе, поддерживающем изображения.

Три вида, по одному фрагменту на каждый

1. Карточка профиля

Самодостаточная карточка с аватаром, именем, NIP-05, био и кнопкой "Follow on Nostr". 320×220, фиксированные размеры, никаких сдвигов лэйаута. Подходит для био авторов, сайдбаров и секций "найди меня в Nostr".

2. Кнопка подписки

Кнопка-таблетка, ведущая прямо на профиль пользователя на nostr-wot.com. 220×44. Поставьте рядом с другими социальными кнопками (Twitter, LinkedIn, GitHub).

3. Лента заметок

Последние 1–5 коротких заметок автора, вертикальным списком. Каждая заметка содержит аватар, имя, время и первую строку контента. 320×переменная высота. Поставьте туда, где у вас был бы виджет "последних твитов" — только этот децентрализован, и ссылка ведёт на профиль Nostr, а не на корпоративную платформу.

Почему это важно для SEO

Когда вы встраиваете виджет, окружающий <a> указывает на nostr-wot.com. Для краулеров поисковиков это входящая ссылка с вашего домена на наш. По мере того как всё больше сайтов внедряют Nostr-виджеты, граф ссылок, питающий Web of Trust в Nostr, накапливает и авторитет ссылок в открытой сети — а значит, профили Nostr становятся легче находимыми через Google, а не только внутри Nostr-клиентов.

Это не случайно. Сама суть виджетов в том, чтобы они были link-friendly: настоящие <a>-теги, ведущие на настоящие URL, а не iframe, прячущие назначение от краулеров.

Чего здесь НЕТ (намеренно)

• Никаких iframe. Iframe не передают авторитет ссылок краулерам и привносят same-origin-риск, который мы не хотим брать.
• Никакого JavaScript на стороне встраивания. Добавление стороннего <script> на вашу страницу — это риск безопасности и производительности. SVG — это <img>. Он не может читать ваши куки, не может выполнять код, не может делать ничего, кроме рисования пикселей.
• Никаких параметров темы в день запуска. По одному выверенному дефолту на каждый тип виджета. Возможно, добавим ?theme=light|dark позже, если будет спрос.

Как это устроено

Сервис виджетов — это маленький Node-процесс за nginx, на той же VPS, что обслуживает nostr-wot.com. Когда краулер или браузер запрашивает /widgets/profile/<npub>:

1. Преобразуем npub в hex-pubkey.
2. Получаем последнее событие kind 0 (профиль) и kind 3 (список подписок) пользователя из SimplePool релеев Nostr.
3. Рендерим SVG-строку с встроенными данными — текстом, геометрией, встроенным аватаром (PNG 96×96 в base64, изменённый размер через sharp).
4. Возвращаем с Cache-Control: public, max-age=300, stale-while-revalidate=86400 и ETag.

Небольшой in-memory LRU поглощает дубликаты запросов. Пул релеев общий между виджетами, так что второй запрос для того же профиля по сути бесплатный.

Open source

Рендерер (@nostr-widgets/renderer) и сервер (apps/server) — оба под MIT и живут в репозитории nostr-widgets. Вы можете поднять сервис у себя, если не хотите зависеть от nostr-wot.com, или прислать новый тип виджета (zap-бейдж? карточку Lightning Address? ленту заметок по тегу?) через PR.

Начните

Возьмите свой npub, выберите виджет, вставьте сниппет:

• Карточка профиля — https://nostr-wot.com/widgets/profile/<npub>
• Кнопка подписки — https://nostr-wot.com/widgets/follow/<npub>
• Лента заметок — https://nostr-wot.com/widgets/feed/<npub>?limit=3

Загляните в галерею виджетов — там живые превью и готовые сниппеты для копирования.

Есть отзыв? Ответьте в Nostr или откройте issue на GitHub.