Как говорится, я вас заебу одним аккордом, но прошел еще один день и вроде как комменты ожили, а это можно сказать событие.

Такими темпами к концу недели, думаю, что-то полуживое будет и в продакшене.

Feeling enthusiastic...

Если у кого есть желание побыть бета-тестером, то вот тут можно поиграться:

https://www.testing-toolbar.com/shared/6655c4625663311108dff9a1/JvBYke6W-9vXY5WHdoWuX

По ссылке можно авторизоваться через email (google пока в тест-окружении поэтому авторизовываться могут только разрешенные пользователи), дальше принять приглашение в проект (кнопка Join) и установить распакованное расширение в хроме. Периодически в этом процессе можно получать 500-е, но сейчас все работает на бесплатных shared тарифах, поэтому иногда похоже вылетаю за таймауты.

Дальше заходим на эту страницу, мои текущие комменты на ней.

Запускаем экстеншен (у него пока калечная дефолтная иконка в виде какой-то красной загогулины от vite-плагина для создания экстеншенов), он должен подцепить авторизацию. Нажимаем на шестеренку и выбираем проект nextjs, обновляем страницу и снова запускаем экстеншен, дальше должны загрузиться комментарии в блоке Edge and Node.js Runtimes.

Контрактная разработка

Всем нам знакома ситуация, когда бек и фронт надо прогать параллельно, сроки двигать нельзя и один ждать другого не может. Значит договариваемся о контракте и мокируем бекендовские запросы. Обычно для этого надо что-то закостылить на уровне приложения, потом бекендер отдает ручки и вы выпиливаете костыли, делаете с нормальными запросами.

Сегодня о том, как в данном случае сделать красиво. Мы все равно будем заниматься мокированием, но писать реализацию сразу с реальными запросами из сетевого слоя приложения.

Как показывает практика даже опытные разработчики не все знают об этом методе, поэтому поехали. Поможет нам mswjs. Эта штука умеет мокировать как бекенд реализацию, так и предоставлять моки для браузерных приложений. Суть такая, что эта штука поднимает service-worker, который перехватывает запросы вашего приложения, если запрос описан в моках, то отдаст мок, если не описан, то может падать, а может проксировать на реальный url.

При этом вы пишете настоящую реализацию, которую не надо потом доправлять. Все, что в конце потребуется - это выпилить мок хэндлер и начать ходить на реальные ручки. Если, конечно, ваш “контракт” фронта с бекендом не протух за время разработки, такое как мы знаем тоже частенько бывает.

Скрин как это работает на базе одного сайд-проекта.

Лучший друг разработчика StackOverflow ChatGPT

Последний месяц +/- перешел на активное использование ChatGPT вместо дефолтного гугления всевозможных вопросов по своей предметной области. Даже подписку плюс оплатил. И это, конечно, отвал башки.

Я даже сейчас не про кодген. Если раньше чтобы ответить на неочевидные вопросы по инструментам/сервисам надо было шерстить документацию, то сейчас достаточно спросить у AI. Сложность только в составлении правильного промта и учете всего нужного контекста.

Последний раз мне надо было разобраться с ресайзилкой картинок через воркеры CloudFlare. На каждый запрос она делает subrequest в ориджин сервер и мне казалось всему виной отсутствие кеша. Спросил у ChatGPT «должен ли cloudflare worker перезапрашивать файл с origin сервера на каждый запрос?» и получил ответ:

By default, a Cloudflare Worker does not cache responses or automatically reuse previously fetched resources unless you explicitly implement caching. However, you can control whether a Worker re-fetches a file from the origin server on each request by managing caching behavior.

Однако, тут не учтен один маленький момент, что в моем случае в воркере работал ресайз картинок, который использует кеш под капотом и промт должен был это учитывать иначе я потерял пару часов на то, что пытался прикрутить предложенный вариант gpt к своему воркеру, а оно никак не работало так как нужно. Пока в итоге уже в документации самостоятельно не нашел, что ресайз картинок под капотом уже использует свой хитрый кеш и там решать надо было чуть по-другому.

Для усмирения своего синдрома самозванца я хотел самостоятельно подвести итоги первого полугодия на новом месте, но внезапно HR-ы решили завезти Performance Appraisal процедуру и пришлось это делать в любом случае. В общем-то неплохой инструмент для самоуспокоения, если сделано, действительно, достаточно, лол.

Итак вот мой список what I've done с июня по декабрь 2024 (с учетом, что июнь это нулевая точка, когда я вообще ничего про состояние дел на проекте не знал):

- в первые пару недель собран первый список технического беклога
- ускорены билды всех проектов (кроме нового екома, там моего участия не было)
- внедрен Sentry для логгинга ошибок
- заведен документ по алертам и настроены правила на эти алерты в Sentry, чтобы мы вовремя узнавали о фронтовых инцидентах на продакшене
- в еком собираются метрики web vitals и мы последовательно улучшаем их, следим за их изменением
- построено нормальное взаимодействие с командами, с лидами команд проводятся регулярные 121
- начата кросс-командная коммуникация между порталом/екомом, ожил общий чат фронтовых команд в slack
- запущен процесс технических воркшопов по сложным задачам, проведено 2 таких митинга и пишется документ с логом таких митингов
- запущено e2e тестирование фронтом для всех проектов
- настроен сбор кавераджа e2e
- в GitLab заведен механизм запрета релизов с понижением кавераджа с возможностью обхода под апрув
- запущен первый обучающий курс по тестам e2e
- исправлена проблема утечки памяти SSR на еком

И это какие-то более менее важные майлстоуны, которые обозначались вопросами на изначальном онбординге, наверное, я забыл еще тележку каких-то более мелких вещей.

Иногда в общем полезно посидеть и выписать свои дела, чтобы внутренний критик хотя бы на чуть-чуть заткнулся.

Мы тут месяца 3 плотно угораем по Web Vitals, много работали над улучшением скорости загрузки, но теперь дошла очередь до INP.

Interaction To Next Paint - метрика, которая "упрощенно" отвечает за то, как ваш сайт тормозит или не тормозит на устройстве пользователя.

В общем мы видим тут две ступеньки, первая связана с переходом на React 19 + React Compiler. Да, мы решили не ждать и попробовать заюзать вместе с компайлером в продакшене и на удивление это тот случай, когда ребзя из меты не просто так едят свой хлеб. Реально обновление либы дало 30% буста по INP.

Вторая ступенька связана с более неочевидным моментом. Я профилировал на старом андроиде и обнаружил, что в таблицах светится либа записи реплаев от Sentry. Отключив сентри для теста, она все равно осталась, оказалось, что реплаи были включены еще и в posthog.

Вывод, если маркетологи или дата-инженеры приходят к вам с какими-то новыми инструментами - необходимо предварительно прочекать, какой оверхед на рантайм спровоцирует внедрение. Зачастую такие задачи звучат и оцениваются как одной строкой включить в JS, а потом платформенные команды без конца занимаются оптимизациями и поиском мест, где же мы тормозим.

Вайб кодинг

А вы че, ребята, все программируете? А сейчас уже не программируют, а вайб-кодят

Я навайбкодил себе обновление сайта

https://egor.sh
https://egor.sh
https://egor.sh

Конечно, рандомный чел вряд ли может сделать с помощью агента что-то вменяемое, но если ты знаешь что надо или хотя бы имеешь представление как сделать, то это буст +100 к ловкости.

Пример из моего кейса. Мне пришла идея, что на сфере было бы неплохо нарисовать «sh», я ж не просто так домен красивый купил, надо его подсветить и промт для курсора быстро сгенерировал решение, но буквы оказались где-то сбоку и сначала вообще были не видны до клика. В итоге я провозился пару часов, чтобы нормально заработало, без AI я бы проковырялся день, я думаю.

В общем через год-два если разраб не будет юзать AI на полную катушку, то индустрия его выкинет на боковину истории, надо перестраиваться, что я в том числе и пытаюсь делать.

Alright, Egor. Here’s your reality check.

You’ve got the experience. You’ve got the title. You’ve built things, led teams, and earned respect. But here’s the brutal truth:

You’re plateauing. Not because you lack skill — but because you’re operating like a high-performer inside someone else’s system. You’re optimizing within boundaries instead of breaking past them. You’re playing to maintain excellence, not to redefine it. And that’s a massive risk for someone like you, who should be several levels higher — in impact, in reach, and in vision.

И пять контрольных...

1. You’re spending too much time polishing rather than disrupting.

2. You’re still tied to your identity as “the frontender who builds stuff.”

3. You’re underestimating marketing and overestimating product.

4. You’re rationalizing a slow pace by hiding behind “quality.”

5. You’re avoiding the pain of reinvention.

Если у вас есть какая-то более-менее история взаимодействия с этим чатом, то промт будет в первом комментарии. Я, честно сказать, удивлен насколько точно он все расписал.

Покодил на выходных, теперь уже самостоятельно.

В общем собираюсь генерить картинки для шаринга ссылок в соц сетях.

Хотя редактор получается уже довольно мощным смысл все-таки будет больше в AI генерации дизайна, динамического контента и простой интеграции с основными no-code платформами.

Что-то после отпуска дел навалилось и совсем нет времени на ваулинк, но прогресс все-таки есть.

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

Зато есть анализ ссылок со скриншотами всей страницы/логотипа (если он в svg) и заливкой этого добра в s3. База на supabase, на которой засетаплена и очередь обработки, так как на контексте все ждать может не очень понятное время. Перевел все на монорепу с вынесенной view частью, то есть компоненты переиспользуются и для рендеринга картинки, и для редактора. Рендер картинок работают на Cloudflare Workers и это довольно удобно, хоть и со своими ограничениями.

Ну и для Paddle я отправил уже миллион документов для верификации, надеюсь, что скоро все-таки они меня заапрувят.

Очень хочется допилить и собрать это все в продакшене, но непонятно где взять время.