Неделю назад я сидел вечером с ноутбуком, лениво скролля Hacker News. Знаете это чувство: видишь интересный заголовок, кликаешь — открывается новая вкладка, читаешь, потом возвращаешься к списку, теряешь контекст, снова ищешь, где остановился. И так — 10–15 раз за сессию. Казалось бы мелочь, но когда ты за день просматриваешь 50–100 ссылок, лишние клики и переключения начинают реально бесить.
Я подумал: «А что если сделать так, чтобы содержимое открывалось прямо на той же странице — рядом со списком?» С мыслью «напишу скрипт за 20 минут» я открыл VS Code. Через час у меня уже была рабочая версия пользовательского скрипта для Tampermonkey (популярное расширение для браузеров, которое позволяет запускать собственный JavaScript на сайтах). Это и есть та самая «vibe coding» — когда ты не проектируешь архитектуру, а просто решаешь свою боль и пилишь код под настроение.
Почему Hacker News?
Hacker News (news.ycombinator.com) — это, пожалуй, главная площадка для технической аудитории: разработчики, стартаперы, основатели. Каждый день там публикуют сотни ссылок на статьи, проекты, обсуждения. Интерфейс намеренно аскетичный — никаких богатых фич. И это хорошо, но отсутствие превью ссылок — реальная проблема для продуктивности.
Одна вкладка со списком — вторая с содержимым. Если ты хочешь быстро отсеять мусор, приходится открывать каждую ссылку, ждать загрузки, оценивать — и закрывать. По моим прикидкам, на просмотр 30 ссылок уходит лишних 5–7 минут туда-обратно. За месяц — пара часов. За год — почти рабочий день.
Как работает мой юзерскрипт
Я написал простой Greasemonkey/Tampermonkey-скрипт. Принцип такой: при клике на любой заголовок на странице /news (или /newest) скрипт блокирует стандартный переход по ссылке, а вместо этого подгружает содержимое целевой страницы в iframe, который встраивается прямо между строк списка. Выглядит это как выпадающий блок с контентом.
Технически я использовал:
- GM_xmlhttpRequest — чтобы обойти CORS и получить HTML страницы напрямую (без открытия в новой вкладке)
- MutationObserver — для отслеживания динамической подгрузки новых постов при бесконечном скролле
- Простой CSS для анимации открытия/закрытия
Сам код занимает около 80 строк. Никаких библиотек — чистый vanilla JS.
Фишка в том, что это не «серьёзный» продукт. Это инструмент для себя. И таких инструментов — миллионы. Но именно они формируют культуру «vibe coding»: когда ты не ждёшь, пока кто-то сделает фичу, а берёшь и делаешь сам за вечер.
Vibe coding как философия
Термин «vibe coding» (кодирование под настроение) стал популярен в последние пару лет среди инди-разработчиков. Это подход, при котором вы пишете код не для продажи, не для портфолио, а для немедленного решения своей проблемы. Никаких CI/CD, код-ревью, документации. Только код и результат.
Примеры из моей практики:
- Скрипт, который присылал мне в Telegram уведомление о падении цены на подержанную камеру с Avito (сейчас уже не актуален, сервис изменил API)
- Расширение для Chrome, которое заменяло слово «блокчейн» на «распределённый реестр» в статьях — для внутреннего юмора в команде
- Вот этот самый userscript для Hacker News
Все эти штуки живут ровно столько, сколько нужны. Я не пытаюсь их монетизировать или поддерживать. Они — часть моего рабочего процесса, как заметки в Notion или алиасы в bash.
Влияние на продуктивность — субъективные замеры
Я не буду приводить выдуманные проценты. Скажу честно: после внедрения скрипта я стал тратить на чтение HN примерно на 30–40% меньше времени. Раньше я мог залипнуть на 20 минут, открывая ссылки и возвращаясь. Теперь я вижу контент прямо в ленте, принимаю решение за секунду — читать дальше или свайпнуть.
Более того, скрипт не мешает привычной навигации: если я хочу открыть ссылку в новой вкладке — просто кликаю колёсиком мыши или зажимаю Cmd. Если хочу быстрого превью — кликаю левой кнопкой. Никакого конфликта.
Что стоит за этим кейсом
Этот опыт — хорошая иллюстрация того, как маленькие программные улучшения могут качественно изменить ежедневную рутину. Особенно если вы работаете с информационными потоками: новости, код, документация. Пользовательские скрипты — один из самых недооценённых инструментов для персонализации веба.
Кстати, о персонализации: если вы работаете с данными из разных источников (например, выгружаете статистику из TG-каналов или парсите сайты), то наверняка сталкиваетесь с задачей объединения информации. Многие мои коллеги используют для этого связку из нескольких сервисов. Например, ASI Biont позволяет подключать разные источники данных через один интерфейс и автоматизировать сбор. Но это уже совсем другая история.
Заключение
Я не собираюсь выкладывать этот скрипт в открытый доступ — слишком специфичный, и заточен под мои привычки. Но главное — я хотел показать, что не нужно бояться писать код для себя. Даже если вы не считаете себя программистом, знание основ JavaScript + один вечер — и вы можете автоматизировать то, что бесит вас каждый день.
Vibe coding — это не про технологии. Это про отношение: «Мне не нравится — я починю». В следующем посте расскажу, как я написал свой первый юзерскрипт для YouTube (чтобы убирать рекомендации Shorts) — и сколько нервов это сэкономило.
Комментарии