htmlshit | Unsorted

Telegram-канал htmlshit - Будни разработчика

14544

Блог Lead JS-разработчика из Хельсинки Автор: @bekharsky По рекламе: https://telega.in/channels/htmlshit/card?r=GLOiHluU или https://t.me/it_adv Чат: https://t.me/htmlshitchat

Subscribe to a channel

Будни разработчика

#релиз дня

Похоже, следующим коллегой разработчика станет не один ИИ-агент, а целая команда роботов.

В SourceCraft от Яндекса появилась возможность подключать автономных ИИ-агентов, которым можно поручать задачи прямо в обсуждениях GitLab. Причём это не очередной чат, в который нужно вручную копировать код и контекст. Агент работает под собственной учёткой, получает задачу, самостоятельно её выполняет и возвращает результат на ревью.

Самое интересное — что происходит, если в процессе что-то пошло не так. Не хватает данных или нужно согласовать решение? Агент сам обращается к команде. То есть разработчик распределяет работу между ИИ-исполнителями, подключается к сложным решениям и проверяет результат.

Не то чтобы разработчиков избавили от общения, конечно. Просто теперь ещё один участник будет писать в треде :)

Агенты могут заниматься разработкой, проверкой безопасности кода и другими задачами. Работать с ними можно не только через GitLab, но и из VS Code, командной строки, мессенджеров и веб-интерфейса SourceCraft.

При этом компании смогут подключать собственных агентов, в том числе созданных в Yandex AI Studio, и настраивать их под конкретные процессы разработки.

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

То есть агенту теперь мало уметь писать код. Нужно ещё научиться нормально работать с коллегами.

#ai #agents #sourcecraft

Читать полностью…

Будни разработчика

#статья дня

Polypane выпустили прекрасную статью о том, что вы все делаете скролл на страницах неверно. А точнее, как делать верно.

Суть — сплошь и рядом ломаете прокрутку на body.

У страницы в браузере есть специальный root scroller — тот самый скролл всего документа.

И браузер умеет для него заметно больше, чем для обычного div с overflow: auto: восстанавливает позицию после перехода назад, прокручивает страницу с клавиатуры, обслуживает window.scrollY / scrollTo, нормально делает печать и полностраничные скриншоты.

На мобильных от него ещё зависят схлопывание адресной строки, tap-to-top на iOS и pull-to-refresh.

Проблема в том, что отказаться от всего этого очень легко. Классический app shell:

html, body { height: 100%; overflow: hidden }

и потом height: 100vh; overflow: auto на wrapper — визуально страница продолжает совершенно нормально скроллиться, только теперь скроллится не документ, а вложенный контейнер. Ещё более неприятный вариант — сочетание height: 100% и overflow-x: hidden: из-за правил overflow body тоже может незаметно превратиться в scroll container.

Проверяется смешно просто: прокрутить страницу и посмотреть window.scrollY. Если там всё ещё 0, скроллится что-то другое. Автор дальше разбирает типичные случаи — full-height layout, fixed header/sidebar, горизонтальный overflow, блокировку скролла под modal — и показывает, как оставить основной скролл браузеру. Например, использовать min-height: 100svh вместо фиксированного 100vh, position: sticky вместо app shell с отдельным скроллом, а для обрезки горизонтального overflow — clip вместо hidden.


Ссылка ещё раз: The root scroller and how not to lose it

#css #scroll #root #appshell

Читать полностью…

Будни разработчика

#инструмент дня

Jev от TypeSafe — модель для задач, где не нужно генерировать ответ, а нужно выбрать один вариант из известного набора. Например, получить состояние интерфейса и решить, что делать дальше: CLICK, TYPE_TEXT, SCROLL, WAIT. Вместо текста она возвращает вероятности для возможных действий. TypeSafe называет такие модели System One Models.

Browser Use взяли Jev и сделали Jev Ultrafast — браузерного агента, в котором обычная LLM почти не участвует в навигации по странице. Jev решает, что нажать, куда ввести текст или когда проскроллить, а небольшую языковую модель вызывают только тогда, когда сам текст действительно надо сгенерировать. Как именно устроен цикл, проще посмотреть на картинке.

За счёт этого агент работает очень быстро и при этом не требует скриншотов на каждом шаге. Никаких специальных сценариев под конкретные сайты тоже нет: он читает текущее состояние страницы и выбирает действие из того, что действительно доступно прямо сейчас.

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

https://github.com/browser-use/jev-ultrafast/

Про сам Jev:
https://typesafe.ai/blog/introducing-system-one-models-and-jev

Думаю, про Jev-подход мы услышим ещё много. Это быстро, дёшево и удобно.

#jev #ai

Читать полностью…

Будни разработчика

#инструмент дня

GitHub вытащил stacked pull requests в открытое тестирование.

Сам подход стеков многим уже знаком: большую фичу режут на цепочку зависимых PR вместо одного огромного diff.

Например:

main ← schema ← API ← UI ← tests

Так делали руками много лет. Один PR строится поверх другого, ревьюить их проще, а работу над следующим куском можно продолжать до merge предыдущего.

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

Stacks автоматизирует именно это: GitHub понимает всю цепочку, показывает её целиком и умеет каскадно обновлять верхние PR после изменений и merge нижних. Есть и gh stack, при этом под капотом остаются обычные ветки и pull requests.

Меньше диффы, проще ревью, меньше ожидания между зависимыми кусками. С агентами это особенно полезно — сгенерировать огромный PR теперь легко, а читать его всё равно человеку.

Правда, пока не без проблем. При включённом dismiss stale approvals rebase может сбросить аппрувы, при этом UI способен ещё какое-то время показывать статус так, будто всё одобрено. Merge queue тоже добавляет сюрпризов: в некоторых сценариях после её работы stack может оказаться разбитым.

В общем, делаем всё то же самое, только теперь со сравнительно нормальным UI.

#github #stack

Читать полностью…

Будни разработчика

Участвуй во всероссийском ИТ-чемпионате МТС True Tech Champ 2026 c призовой фондом 10 250 000 рублей.

Если тебе нравятся алгоритмы, структуры данных и задачи на чистую логику — участвуй в алгоритмическом треке с индивидуальным зачетом.

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

В финале лучшие 120 участников алгоритмического трека сразятся в лайв-кодинге за шесть призовых мест и 2 750 000 рублей. Всех финалистов ждут:
— Лимитированный мерч;
— Сертификаты об участии;
— Масштабное мероприятие с выступлениями хэдлайнеров и фестивальными активностями.

Успей зарегистрироваться и пройти отборочный этап до 27 сентября.

Erid: 2VSb5xn8e7k

Читать полностью…

Будни разработчика

#видео дня

Посмотрел выпуск 1×1 с Лёшей Остриковым о разработке ИИ-агентов. Во многом он подтвердил мои мысли о том, как трансформируется подход к работе.

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

Если этого понимания нет, агент, скорее всего, сделает не то.

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

То же самое с агентами, которые ищут информацию в коде, Wiki и документации. Их ценность не в том, что они «знают всё», а в том, что они встроены в рабочий контекст и сокращают путь от вопроса до решения.

Поэтому сейчас особенно нужны люди, которые умеют разобраться в работе бизнеса, разложить процесс на шаги и понять, где агент действительно поможет. Это касается не только разработчиков — такие процессы есть в любой профессии.

Мне близка и мысль Лёши про любопытство: не ждать идеальных курсов, а брать реальную задачу и пробовать.

Короче, начинать нужно не с вопроса «какой инструмент выбрать», а с вопроса «как устроена моя работа и что в ней можно сделать лучше».

#ai

Читать полностью…

Будни разработчика

#статья дня

Chrome DevTools умеет включать условный Slow 3G, и очень легко забыть, что это не совсем эмуляция реальной сети.

Throttling в DevTools работает на уровне HTTP-запросов, а настоящая сеть — на уровне пакетов. Из-за этого Chrome не очень точно воспроизводит TCP slow start, handshakes, приоритизацию трафика и вообще не умеет нормально симулировать packet loss. В итоге вполне реальна ситуация, когда 20 КБ картинка в DevTools грузится 12 секунд, а на близком к реальному 3G — 300–500 мс.

То есть для быстрого «а как оно будет на медленной сети» DevTools годится. Для замеров, на основании которых вы собираетесь что-то оптимизировать, — уже не очень.

У Ивана Акулова хороший короткий разбор, почему так происходит и чем тестировать вместо этого: WebPageTest, Network Link Conditioner, @sitespeed.io/throttle и другие инструменты с packet-level throttling.

https://3perf.com/blog/chrome-throttling/

#devtools

Читать полностью…

Будни разработчика

#статья дня

Мы как-то с вами уже обсудили, какими разными бывают .*ignore-файлы. И что не .gitignore-ом единым, вот тут: /channel/htmlshit/3989

Но я упустил из виду, что у автора есть ещё статья-продолжение! И она — конкретно про разные вспомогательные файлы уже самого git.

Ну, например, с .gitignore всё уже понятно. А что насчёт .gitattributes?

А этот файл помогает разобраться, как поступать с разными файлами. Например, merge strategy:


package-lock.json merge=ours

и всё, разрулится как надо. Или вот шипите вы мультиплатформу:

*.sh text eol=lf
*.bat text eol=crlf

А? По-моему, очень круто. Но давайте дальше.

.gitmodules — конфигурация подмодулей git, .mailmap — хендлит обновление почты в старых коммитах, .gitmessage — шаблон сообщения коммита, .git-blame-ignore-revs — позволяет не включать преттиер и линтер в blame (Привет, Саша!).

Ну и, например, как зашиппить пустую папку в git? Положите в неё файл .gitkeep! Но это не стандартный файл, это просто соглашение. Таких много.

Короче, всё это — вот тут: https://nesbitt.io/2026/02/05/git-magic-files.html

Я вообще этот блог люблю, автор жёстко упарывается по менеджерам пакетов и гиту. Алгоритмы разбора зависимостей, диффов, уязвимости — вот это вот всё.

#git #config

Читать полностью…

Будни разработчика

#инструмент дня

Слово «модель» сейчас обычно вызывает в голове что-нибудь на 7–70 миллиардов параметров и десятки гигабайт весов. Но модель вообще не обязана быть такой.

Vercel Labs сделали gpu-lexer — библиотеку подсветки кода, в которой вместо набора грамматик используется одна обученная модель на 41 321 параметр.

Веса упакованы в 6 бит, а весь браузерный пакет занимает 27.4 KB, в сжатом состоянии.

Работает через WebGPU.
Код сначала режется на слова, пробелы, переводы строк и символы. Потом модель для каждого токена выбирает класс: keyword, string, function, type, operator и т.д. Язык заранее указывать не нужно.

У классических хайлайтеров подход другой. Prism и Highlight.js хранят правила для отдельных языков. Shiki использует TextMate-грамматики. Больше языков — больше правил и больше данных.
Здесь одна модель занимает два десятка килобайт и пытается покрыть всё сразу.

Для сравнения, автор приводит примерно 162 KB для Prism, 240 KB для Highlight.js и 992 KB для полного набора Shiki.

Но это именно ML: результат не гарантирован правилами. С Shiki модель совпадает примерно на 88–90% токенов. На TypeScript и Python лучше, на менее популярных языках и шаблонизаторах заметно хуже.

Да, такой подход не вчера появился, но мне нравится, что он снова обретает право на жизнь в не слишком сильно детерменированных задачах.

https://gpu-lexer.vercel.app/

#syntax #ml #highlight

Читать полностью…

Будни разработчика

cursor: ew-resize;

Читать полностью…

Будни разработчика

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

В честь наступающего Дня разработчика вместе со студией FU2RE и 3D-художником Dmitriev Video они создали большой портал в прошлое — эмулятор 2006 года будущего разработчика. Внутри — олдскульные игры и викторины, за которые можно лутать баллы и подниматься в рейтинге.

Трём лучшим игрокам 15 сентября подарят суперпак настоящих разрабов, внутри которого салфетка на монитор из коллаборации с Elnik, плед, сумка и плюшевый талисман — кот Б/У. Так что времени сыграть ещё много!

P. S. А ещё в канале AvitoTech до 13 сентября будут каждый день выходить крутые праздничные посты. Не пропустите: может быть, и там они спрятали подарки ❤️

Читать полностью…

Будни разработчика

#ссылка дня

Если вдруг этим дождливым (ничо не знаю, у меня дождь) вечером нечем заняться, предлагаю вам попробовать покрасить кнопку!

И не просто покрасить кнопку, а покрасить кнопку с помощью Клода. И ничего более.

https://opusfived.dev/

Думаете, получится? :)

#claude #opus

Читать полностью…

Будни разработчика

Проект от подписчика!

Напоминаю, что я выкачу любую статью или проект от вас, не стесняйтесь писать.

Презентация? Выступили на митапе? Хотите поделиться интересной статьёй — добро пожаловать!

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

Все началось с того, что когда я пришел на проект - надо было поднимать нагрузку с абсолютного нуля. Поскольку у нас использовался JS стек(playwright) то было принято решение взять k6. Конечно, это позволило нам быстро стартануть, но чем дальше в лес, тем сложнее было поддерживать решение.

Начнем с того, что у k6 есть ограничение на VUS(virtual users) ~50k. И это стартовая точка костылей. Затем нам понадобился sidecar — helper сервер, чтобы производить определенные манипуляции, затем еще один за другим велосипедом. И в какой-то момент я решил, что управлять сложностью стало проблематично и решил, что хочу решить эти проблемы, но плавно.

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

Затем я начал думать над тем, что меняется от проекта к проекта и вывел закономерность - надо делить конфигурацию (configuration/config) от самого теста. Затем надо было добавить простой UI для отображения тестов и конфигураций, затем сделать интеграцию с OIDC и поместить внутрь контура. И вот так, постепенно, шаг за шагом, я пришел уже к полноценному продукту - https://perfscale.ru/ , который закрывает все типы тестов. А для большего комфорта я движок опенсорснул - 🧑‍💻 https://github.com/Perfscale/perfscale. Считаю, что это правильный шаг.

Единственное, что нет в OSS - fix protocol (прим. 📊fix protocol - финансовый протокол для передачи финансовых данных), ну и самих фич: OIDC, multi tenant, AI inference ,integrations (git, prometheus, allure testops, slack, webhooks, etc.) вобщем все то, что накладывается поверх самого движка.

Из последних вещей, которые я сделал в perfscale OSS (на момент написания) - это gRPC, child_process(sidecar) а впереди еще и поддержка других клиентов: databases, webrtc, graphql, и даже собственный marketplace для того,чтобы не городить ворох велосипедов. А еще я веду sponsr / habr - где пишу о еженедельных новостях, связанных с perfscale.

Ну а если я лично вам приглянулся , то еще и веду свой TG канал - ✈️ Haradkou SDET, где пишу обо всяком, связанным с автоматизацией тестирования

Читать полностью…

Будни разработчика

#фишка дня

CSS Grid умеет сам перекладывать карточки при ресайзе, но делает это мгновенно. Брамус не каратист Ван Дамм придумал довольно занятный способ добавить плавность без JS и View Transitions.

Трюк в том, что анимируется вообще не Grid. Карточки вынимаются из потока и привязываются к своим ячейкам через CSS Anchor Positioning. Grid пересчитывает раскладку, координаты anchor() меняются, а transition плавно двигает карточку к новому месту.

Сам Anchor Positioning уже добрался до современных Chrome, Safari и Firefox и считается Baseline 2026.

Firefox уже понимает anchors, но изменение координат из anchor() пока не анимирует — карточки просто прыгают. Но зато в Safari 26 всё отлично! Я удивлён.

Так-то забавно выходит.

Ах, да.

Ссылка:
https://www.bram.us/2026/09/07/animating-css-grid-layouts-with-css-anchor-positioning/

Сразу на демо: https://codepen.io/editor/bramus/pen/01a07dd4-4d23-7e7b-9f41-3e0aa126751f

#css #grid

Читать полностью…

Будни разработчика

#заметка дня

Nvidia покупает Hugging Face за $12.93 млрд, и кто-то явно решил, что просто круглой суммы для сделки такого масштаба недостаточно.

Берём число 129303 и проверяем в консоли:


String.fromCodePoint(129303)


Получаем:


🤗


Потому что 129303 — это U+1F917, Unicode-код эмодзи 🤗, который называется Hugging Face.

Но на этом пасхалки не заканчиваются. Если те же цифры прочитать как HEX цвет:


document.body.style.background = '#129303'


получим очень характерный зелёный, довольно близкий к Nvidia.

То есть число одновременно можно прочитать как Hugging Face и как зелёный Nvidia.

Где-то между due diligence, юристами и оценке на миллиарды долларов нашлось место шуточкам за 300.

#nvidia #ai #huggingface

Читать полностью…

Будни разработчика

#инструмент дня

Кто-нибудь, остановите это безумие!

Очередная библиотека подсветки синтаксиса — twinkleplop. Очередные рекорды скорости и размера побиты! Очередное API улучшено.

Можно конечно попробовать разобрать архитектуру, например: в основе твинклплопа — конечный автомат. Но кому это интересно? Не, если кому-то интересно, вот: https://twinkleplop.pngwn.at/docs/architecture

Но лично меня распёрло от их мини-игры на главной странице :)

Я вот в 50 секунд уложился.

#tool #syntax #highlight

Читать полностью…

Будни разработчика

Одно из модных слов этого года в ИИ — харнесс. Если совсем грубо, это вся обвязка вокруг самой модели: память, контекст, поиск, файлы, инструменты и логика того, как модель всем этим пользуется.

И харнесс, кажется, становится всё важнее. Современная модель сама по себе — уже не весь продукт. Очень многое зависит от того, в какую систему её встроили и что ей дали делать.

Свежий пример — GPT-6 Astra от OpenAI. На ARC-AGI-3 её прогнали в двух вариантах. В универсальном харнессе авторов теста, одинаковом для моделей разных компаний, при максимальном уровне рассуждений модель набрала 62,7%. С собственной обвязкой OpenAI — уже 98,6% при том же уровне рассуждений.

Разница в том числе в работе с контекстом: универсальная обвязка позволяет модели переносить между ходами только заметки, которые она сама решила сохранить. А обвязка OpenAI умеет сохранять внутреннее состояние рассуждений между запросами и сжимать длинный контекст.

То есть одну и ту же современную модель уже не всегда имеет смысл оценивать в отрыве от её «родной» обвязки. Если хочется выжать из неё максимум, харнесс может оказаться не менее важен, чем сама модель.

Похожую логику теперь можно увидеть и в Алисе AI. Она сама выбирает, какую модель использовать под конкретный запрос. Простому вопросу можно дать быстрый и дешёвый ответ. Если нужно проанализировать несколько документов, что-то посчитать или учесть много условий — Алиса может сама подключить режим «Эксперт».

В интервью Forbes Валерий Стромов рассказывает, что система строится вокруг 3–5 моделей-экспертов, автоматического распределения запросов и собственного харнесса.

Сейчас около 80% запросов обрабатывает собственная модель Alice AI. В «Эксперте» при этом могут использоваться как модели семейства Alice AI, так и общедоступные модели с открытыми весами, запущенные на серверах Яндекса.

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

Поэтому вопрос «какая модель самая умная?» постепенно становится менее интересным, чем вопрос «насколько хорошо вокруг неё собран продукт».

Читать полностью…

Будни разработчика

#библиотека дня

Браузер умеет рисовать текст уже лет тридцать. Но стоит вам открыть WebGL/WebGPU — и внезапно переносы строк, bidi, fallback шрифтов и лигатуры снова становятся вашей проблемой.

У Poimandres вышел Glyph v0.1.0 — движок типографики для веб-графики, который всё это забирает на себя: https://github.com/pmndrs/glyph

Poimandres (pmndrs) — это open-source коллектив вокруг React и веб-графики. Из их проектов вы, скорее всего, знаете React Three Fiber, Drei, Zustand, Jotai, Valtio, React Spring и use-gesture. То есть Glyph появился не из ниоткуда: это та же экосистема, которая уже много лет методично обрастает инструментами вокруг React, Three.js и интерактивной графики.

GPU-first рендеринг, batching, incremental updates, bitmap/MTSDF/Slug, Unicode shaping, CJK, font fallback, переносы, justification.

Есть и нормальный layout: абзацы, колонки, ограничения по форме, обтекание контуров и 3D-объектов.

Работает с Three.js, R3F и TypeGPU, можно подключить свой рендерер.

Пока pre-release: CJK частичный, TypeGPU experimental, emoji и vertical writing ещё в roadmap.

В общем, теперь для текста в WebGPU можно хотя бы не собирать HarfBuzz, layout и рендеринг по кускам самому.

Ну и ещё раз ссылка: https://github.com/pmndrs/glyph

#webgpu #typography #font #render

Читать полностью…

Будни разработчика

Проект от подписчика!

Напоминаю, что я выкачу любую статью или проект от вас, не стесняйтесь писать.

Презентация? Выступили на митапе? Хотите поделиться интересной статьёй — добро пожаловать!

Привет, я Ксюша. Много лет фронтендер, в прошлом дизайнер. Люблю упрощать себе жизнь, создавая удобные и уютные приложения под свои потребности.

Увидела, что автор канала выкладывает приложения подписчиков, и решила поделиться своим последним творением. Оно уже работает, им можно пользоваться.

Сначала приложение задумывалось для ребёнка: домашние дела как маленькая зарплата. Больше не нужно по сто раз напоминать про посуду, а спорить «я же всё сделал!» бессмысленно, всё видно в истории. Потом я его расширила, и теперь им могут пользоваться заказчик с фрилансером, друзья, муж с женой - назначать друг другу дела ) Какой бы вариант вы ни выбрали при входе, приложение остаётся таким же простым и милым.

Для семьи настройка занимает три шага: добавить ребёнка, завести список ежедневных дел, назначить цену дня. У нас это 100 тасккоинов в день (сын меняет их на робуксы для Роблокса или на рубли). Но валюта может быть любой, как договоритесь: хоть доллары, хоть поцелуи )

Дальше ребёнок открывает свою версию приложения и вычёркивает: помыть посуду, Duolingo, прочитать 40 страниц. Всё сделано - плюс сто. Что-то забыто - минус пятьдесят.

В любой день месяца можно нажать кнопку «Чек». Чек настоящий, лентой: дни, суммы, штрафы отдельной строкой, итого к выплате и штрихкод для реалистичности. Чек можно предъявить родителям, заказчику или жене.

В графе «Работник» стоит не имя, а Пингвин. Или Котик. Или Лисёнок. Имён приложение не спрашивает вообще, вместо имени выбирается мордашка. Это не только ради красоты: так не возникает вопросов к хранению персональных данных. Приложение не хранит ни имён, ни почты, ни телефона, войти можно анонимно.

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

TaskCoin — https://taskcoin.app/ru

Стек: React 19, Express 5, Prisma + PostgreSQL (Neon), хостинг на Vercel, ставится на телефон как PWA. Cron нет: зарплата и штрафы считаются в момент запроса, а день закрывается по часовому поясу ребёнка.

Читать полностью…

Будни разработчика

#заметка дня

Купили в комиссионке *Cut the Rope: Connect Four*. Дочь любит мультики про Ам Няма, так что игру, конечно, взяли.

Коробка практически полная. Детали даже не сняты с литников, все наклейки не наклеены и монетки на месте. Не хватало только подставки. То есть, буквально, самого главного.

Я решил сделать её на 3D-принтере. Но у меня опыта проектирования нет прям вообще — последний раз я что-то чертил в 2004 в университете, а вылетел из него я до того, как начался AutoCAD.

Таким образом, оставался только один вариант сделать это быстро: вайбкодить предмет.

Я фотографировал детали, измерял их штангенциркулем и объяснял Codex-у, что нужно построить. Потом открывал модель во Fusion, смотрел, что выдаёт слайсер, печатал пробник и возвращался с замечаниями: тут полка нулевой толщины, тут дырка отверстие, тут контур не замкнут и деталь развалилась.

Почему так вообще можно? Потому что CAD-модель — это геометрия, а геометрию можно задать кодом. Ассистент писал Python-скрипт, менял в нём размеры и форму, а результат загружал во Fusion MCP. Слайсер затем показывал, как эту форму принтер разложит на слои. Получился почти привычный цикл разработки: описал задачу, собрал, нашёл баг, исправил. Только каждый «запуск» может занять час и потратить пластик.

Естественно, компьютерное проектирование — вовсе не новая идея. Первые CAD-системы появились ещё в 1960-х (Sketchpad), коммерческие — в 1970-х, а к концу 1980-х пришло привычное параметрическое 3D-моделирование с размерами и историей операций.

Мы же пришли к редактируемой модели через текстовый разговор и скрипт.

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

Но когда всё получилось — чувство какое-то дикое. Научился ли я CAD-у? Нет. Сделал ли я модель сложной формы? Да. Работает ли она — тоже да!

Так что обучение никто не отменял, но страх чистого листа уже преодолён.

Короче, это было круто.

#cad #model #3d

Читать полностью…

Будни разработчика

#заметка дня

Надоело сливать лимиты в Sol на каждую вторую задачу? А ты вообще смотрел, насколько дешёвые модели сейчас отстают от дорогих — и сколько при этом стоят?

Узнал от коллеги, что у Datacurve есть DeepSWE — очень наглядный график по агентам и моделям. Там 113 инженерных задач из реальных репозиториев: модель должна покопаться в проекте, найти нужный код, внести изменения и довести всё до рабочего состояния. Примеры задач тоже есть, кстати.

Наверху таблицы ожидаемо сидят самые сильные модели с результатом около 70–74%.

Но дальше...

GPT-5.6 Luna Max — около 67% за $0.61 на задачу.
GLM-5.3 Flash — около 63% за $0.24.

А модели с результатом на несколько пунктов выше могут стоить уже $6–12 за задачу.

То есть условно: получил не 73%, а 67%, зато заплатил в десять раз меньше.

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

Тем более в агентных сценариях никто не мешает гонять дешёвую модель несколько раз, проверять результат тестами, а только провалы отправлять в Sol или Opus.

Я уже гоняю Luna в Extra High и Max и... доволен.

Так что вопрос уже не только в том, какая модель набрала больше баллов.

Смотреть надо ещё и на то, сколько стоили эти баллы.

https://deepswe.datacurve.ai/

#ai #comparison

Читать полностью…

Будни разработчика

#инструмент дня

Когда-то давно ещё на Ubuntu я пользовался колорпикером Pick.

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

И назвал его Pipetka.

Как оказалось, macOS не умеет записывать видео выбора цвета :)

Pipetka умеет брать цвет с рабочего стола и окон, умеет генерировать палитры из одного изображения или целого их каталога. Даёт названия цветам, позволяет переключаться между разными их представлениями и экспортировать в разных форматах.

Проект открытый, на гитхаб автоматически выкладываются неподписанные релизы: https://github.com/bekharsky/pipetka

Правда, неподписанный релиз означает, что, собственно, разрешения работать не будут :) Так что я в процессе загрузки бесплатного подписанного релиза туда же.

Upd. Подписанный релиз загружен на гитхаб, всё хорошо! Но запускать приложение надо из Applications.

А если есть желание поддержать — Pipetka лежит в App Store: https://apps.apple.com/fi/app/pipetka/id6784390987?mt=12

Пользуйтесь :)

#colorpicker #app #macos

Читать полностью…

Будни разработчика

#инструмент дня

Этого стоило ожидать. Вашему вниманию — Quake на CSS.

Реализован он с помощью движка PolyCSS, а выбрать карту можно просто передав значение в параметр. Например, вот второй уровень первого эпизода: https://cssquake.com/?map=e1m2

Итак, а что же такое PolyCSS?

PolyCSS — 3D-движок, который рендерит модели обычными DOM-элементами через CSS matrix3d(). Без WebGL и без canvas для самой сцены. Загружает OBJ/MTL, STL, glTF/GLB и VOX, умеет в текстуры, свет, тени, камеры, orbit/map/first-person controls, плюс есть обёртки для React и Vue.

Полигоны при этом реально остаются HTML-элементами. Их можно увидеть в DevTools, стилизовать через CSS, повесить click, анимацию или вообще работать с ними как с обычным DOM. Отсюда же и довольно специфичная модель производительности: важны количество DOM-узлов и объём работы, который потом достаётся браузеру на рендер и композитинг.

Поэтому PolyCSS много возится с самой геометрией: убирает внутренние грани, объединяет подходящие поверхности и выбирает разные способы рендера для разных типов полигонов. По умолчанию используется lossy`-оптимизация, которая может немного упростить исходную сетку ради меньшего количества DOM-элементов; если это нежелательно, есть `lossless. С текстурами похожая история: движок собирает texture atlas, а элементы показывают нужные участки, вместо того чтобы тупо вешать отдельную картинку на каждый треугольник.

До Three.js или Babylon.js по возможностям тут далеко: освещение проще, у теней и текстур есть ограничения, а большие сцены довольно быстро начинают упираться в DOM. Но для небольших интерактивных сцен, моделей и всяких веб-экспериментов подход вполне рабочий, и при этом весь результат остаётся частью обычной страницы.

PolyCSS: https://github.com/layoutit/polycss
cssQuake: https://github.com/layoutit/cssQuake

Демонстрация квейком, конечно, это мощно.

#3d #polycss #quake

Читать полностью…

Будни разработчика

🇩🇪 Германия нуждается в квалифицированных IT-специалистах. Но даже сильного опыта уже недостаточно, чтобы получить оффер. Узнайте у практикующих рекрутеров, что действительно работает на рынке.

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

Начать стоит с LinkedIn — ваш профиль должен быть адаптирован под выдачу в поиске рекрутера.

15 сентября в 19:00 по Берлину (UTC+2) пройдет бесплатный мастер-класс, где вы узнаете:

✔️ Как правильно настроить LinkedIn-профиль, чтобы рекрутеры находили вас и приглашали на интервью
✔️ Как рекрутеры ищут кандидатов через LinkedIn Recruiter и что влияет на выдачу профиля в поиске
✔️ Как адаптировать профиль под разные рынки и карьерные цели
✔️ Какие зарплаты сейчас предлагают компании для IT-специалистов (внутренняя статистика)
✔️ Как получить оффер в Германии уже в этом году

📌 Зарегистрироваться

🎙 Спикеры:

Инесса — IT-рекрутер, раньше работала в Amazon, ING Bank и REWE Digital, где формировала и развивала международные IT-команды.

Роман — Software Engineer с опытом 13+ лет. Работал в BMW, IBM и Eurowings, где прошёл путь от разработчика до тимлида. Обладает большим опытом найма IT-специалистов и точно знает, на что обращают внимание немецкие компании при выборе кандидатов.

Инесса и Роман — основатели рекрутингово-иммиграционного агентства Transparent Hiring. Они знают рынок найма с обеих сторон: каждый день нанимают кандидатов для немецких компаний и помогают специалистам с поиском работы и переездом.

У Transparent Hiring:
⚡️100% закрытие кейсов по визам и жилью — ни одного отказа в визе за 6 лет на рынке
⚡️В команде работают практикующие рекрутеры и визовые эксперты с опытом работы в немецких визовых центрах и австрийском консульстве
⚡️ 600+ успешных кейсов релокации в Германию кандидатов из 45 стран

А еще у команды глубокая экспертиза в работе со специалистами из стран СНГ. Они продолжают перевозить кандидатов в Германию, в том числе из РФ.

👉 Регистрируйтесь на вебинар, чтобы понять, каким должен выглядеть ваш профиль для немецкого рынка.

А пока ждете вебинар, подпишитесь на авторский канал Германия с Инессой 🇩🇪 — там Инесса делится полезными советами по оформлению CV и LinkedIn и переезду в Германию и другие страны Европы.

Читать полностью…

Будни разработчика

#релиз дня

Вышел React 19.3, и на этот раз в релизе есть несколько вполне заметных вещей.

Главное — две экспериментальные фичи наконец стали стабильными:

— <ViewTransition> — React теперь умеет нормально работать с браузерным View Transition API: enter/exit/update/shared-element анимации, интеграция с Suspense, свои переходы.

— refs на <Fragment> — можно получить доступ к группе DOM-элементов без лишнего wrapper-div: повесить event listener, IntersectionObserver, управлять фокусом, вызвать scrollIntoView() и т.д.

Ещё появилась довольно приятная мелочь для SSR:


use(browser())


Компонент таким образом можно явно исключить из серверного рендера. На сервере он уйдёт в ближайший Suspense, а в браузере продолжит рендериться как обычно. Никаких typeof window !== 'undefined' и mounted через useEffect.

Плюс React теперь поддерживает Trusted Types. Это браузерная защита от DOM XSS: через CSP можно запретить передавать обычные строки в опасные API вроде innerHTML и разрешать только заранее проверенный TrustedHTML. Раньше React такой объект превращал обратно в строку и ломал механизм. В 19.3 trusted-значения наконец проходят в DOM как есть.

Штош, мне нравится этот островок стабильности.

https://react.dev/blog/2026/09/09/react-19-3

#react

Читать полностью…

Будни разработчика

#такое дня

Ничего такого, просто макбук с линуксом (конкретно, Omarchy) смотрит на себя в зеркало через вебкамеру, чтобы дать агенту нужную информацию для оптимизации драйвера AMD Radeon GPU.

https://x.com/jpschroeder/status/2097758256420565442

#ai

Читать полностью…

Будни разработчика

#книга дня

Data Structures and Algorithms от Kirupa

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

https://www.kirupa.com/data_structures_algorithms/introduction_book_tutorials.htm

Темы обычные: Big O, массивы, стеки, деревья, графы, DFS/BFS, Дейкстра, сортировки. Но часть материала сделана специально под веб, а не просто перенесена туда из учебника.

Например, офигенская глава про движение по двумерной сетке:

https://www.kirupa.com/data_structures_algorithms/moving_around_a_grid.htm

Там есть чувачок-инопланетянин, которого можно гонять стрелками или WASD по сетке 10×10. На нём разбираются смещения координат, проверки границ и обновление позиции.

Ах, да. Естественно, все изученные структуры данных даются не просто так, а чтобы написать простые игры, представленные в конце цикла.

#algorithms #data_structures

Читать полностью…

Будни разработчика

#заметка дня

Сразу нелишним будет напомнить, что я уже 6 лет живу и работаю в Финляндии, и даже в финской компании.

Есть одна вещь, которая мне очень нравится в том, как финны в IT обращаются с английским: они совершенно не считают нужным оставлять английские слова английскими.

Финский вообще довольно буквальный язык: a читается как «а», e как «э», i как «и», j как «й», ударение почти всегда на первый слог. И английское слово, попав в финскую речь, часто просто прогоняется через эти правила.

Jira — «йира».
Cache — примерно «кацхе».
Done — «до́нэ».
System — «сюстэм»
Apple — буквально «аппле».
Google — guugle.
YouTube — juutuubi.

А дальше слово ещё и становится грамматически финским:

sprint → sprintti
ticket → ticketti
server → serveri
bug → bugi
commit → committi
deploy → deployata

Есть даже отдельный термин — rallienglanti, «раллийный английский»: английский финских гонщиков, где слова английские, а фонетика, ритм и интонация остаются совершенно финскими.

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

А «яваскрипт», «микрософт», «аппле», «питон» или «докер» легко могли звучать либо как плохой английский, либо как намеренный айтишный китч.

Получалось смешно: всё предложение по-русски, но перед словом framework человек на секунду становился американским радиоведущим.

А потом садился в свой Mini с Union Jack на крыше.

В Финляндии этого переключения как будто нет. Человек может прекрасно говорить по-английски, но в финской фразе Jira всё равно будет «йира», Apple — «аппле», а что-нибудь вполне можно deployata.

Слово попало в язык — всё, поздно. Теперь оно немного финское. Или русское, смотря кто произнёс.

Иллюстрация: Jutta Mykrä.

#finland #it

Читать полностью…

Будни разработчика

#инструмент дня

TanStack выпустили Hotkeys — библиотеку обработки клавиатурных сокращений.

Да, давно уже есть react-hotkeys-hook, hotkeys-js, Mousetrap, у части из них тоже есть scopes, refs, sequences и запись макросов.

Но у TanStack Hotkeys всё это сразу считается одной командной системой.

Скоупы, последовательности, удержание клавиш, keyup, rebinding, конфликты, Mod для Ctrl/Cmd, platform-aware отображение сочетаний, работа с editable-элементами и даже devtools. По отдельности почти всё это уже где-то было. Вопрос в том, сколько библиотек и собственного кода вам нужно было собрать вокруг простого keydown, чтобы получить всё сразу.

Ах, да. Framework-agnostic, конечно же.

С Query, Table и Virtual у них уже получалось примерно то же самое. Они редко приносят новую идею как таковую, зато дорабатывают прекрасно.

Hotkeys пока alpha, но почитать документацию стоит хотя бы ради того, чтобы посмотреть, сколько нюансов там вообще.

#tanstack #hotkeys #library

Читать полностью…

Будни разработчика

#инструмент дня

Разобраться в концепциях Git просто не только лишь всем. Кто-то схватывает на лету, кто-то продирается сквозь ветки и листья документации. Кто-то забивает на всё, использует UI любимой IDE и ничего сложнее git pull origin master не разруливает.

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

И называется он git-sim, вот так вот буквально.

Нужно разрулить конфликтный cherry-pick? Слить несколько веток вместе? Посмотреть последствия reset, stash, rebase? Да запросто! Просто вместо git команда пишете git-sim команда и наслаждаетесь.

Ах да, ссылки на примеры от авторов (много видео и иллюстраций): https://initialcommit.com/tools/git-sim

И на GitHub проекта: https://github.com/initialcommit-com/git-sim

Очень уютная штука.

#git #sim #tool #бородач

Читать полностью…
Subscribe to a channel