Будни разработчика
14.4K subscribers
1.4K photos
405 videos
8 files
2.32K links
Блог Lead JS-разработчика
Автор: @bekharsky

По рекламе: https://telepost.pro/ch/id2415 или https://t.me/it_adv

Чат: https://t.me/htmlshitchat

№5001017849, https://www.gosuslugi.ru/snet/679b74f8dad2d930d2eaa978
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
#библиотека дня

Браузер умеет рисовать текст уже лет тридцать. Но стоит вам открыть 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
❤6
This media is not supported in your browser
VIEW IN TELEGRAM
#инструмент дня

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
❤12👍4🫡1
Одно из модных слов этого года в ИИ — харнесс. Если совсем грубо, это вся обвязка вокруг самой модели: память, контекст, поиск, файлы, инструменты и логика того, как модель всем этим пользуется.

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

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

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

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

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

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

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

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

Поэтому вопрос «какая модель самая умная?» постепенно становится менее интересным, чем вопрос «насколько хорошо вокруг неё собран продукт».
👍6❤3👏3🤩2
#статья дня

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
❤13
This media is not supported in your browser
VIEW IN TELEGRAM
#инструмент дня

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

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

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

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

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

#tool #syntax #highlight
🔥9❤6
#релиз дня

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

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

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

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

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

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

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

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

#ai #agents #sourcecraft
👍4❤1🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
#статья дня

Ахмад Шадид придумал, как на CSS определить, что два элемента начинают пересекаться.

Задача вроде простая: есть декоративный элемент, его позиция и размер плавают, рядом контент. Нужно скрыть декор не по @media, а именно когда между ними заканчивается место.

Решение довольно извращённое: через Anchor Positioning он создаёт невидимый .measure между элементами, добавляет туда псевдоэлемент фиксированной ширины и ждёт, когда контейнер начнёт overflow'иться. Дальше Scroll-driven Animations используются вообще не для анимации, а как детектор этого overflow: timeline переключает CSS-переменную, а style query уже скрывает нужный элемент.

То есть CSS всё ещё не умеет спросить «эти два элемента пересеклись?», но если достаточно долго смотреть на Anchor Positioning, timeline-scope, overflow и container queries — оказывается, можно заставить его ответить.

Поддержка, разумеется, пока не универсальная, поэтому сам Шадид рассматривает это как progressive enhancement.

Ссылка: https://ishadeed.com/article/css-detect-overlap/

#css #scroll #overlap
👍7👏2🤡2
This media is not supported in your browser
VIEW IN TELEGRAM
#фишка дня

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

𝚝𝚎𝚡𝚝𝚊𝚛𝚎𝚊 {
𝚏𝚒𝚎𝚕𝚍-𝚜𝚒𝚣𝚒𝚗𝚐: 𝚌𝚘𝚗𝚝𝚎𝚗𝚝;
𝚖𝚊𝚡-𝚑𝚎𝚒𝚐𝚑𝚝: 𝟻𝚕𝚑;
}


Современные единицы измерения, конечно, крутая штука :)

Автор

#css #textarea #lh
❤12👍2
This media is not supported in your browser
VIEW IN TELEGRAM
#библиотека дня

Poimandres снова на коне: заваншотили (на самом деле нет) математическую библиотеку для веба. Шутку про Opus авторы уже успели пошутить сами.

Пакет ставится как npm i math. Имя math на npm им отдал Kaleb Hornsby.

Репозиторий при этом старый и несколько лет толком не обновлялся. Теперь проект заметно переделали и выпустили math v0.1.0.

Возможностей навалили с верхом: векторы, матрицы и кватернионы, 2D/3D-геометрия, raycast и frustum, triangulation и quickhull, easing и springs, seeded random, несколько видов noise, цвета и inverse kinematics.

API сделан с расчётом на производительность. Функции пишут результат в переданный out, а не создают новый объект на каждом вызове, данные остаются обычными массивами, формат аргументов и возврата един.

Плюс всё разбито на отдельные точки входа и нормально тришейкится.

Поэтому использовать math можно хоть с WebGL, хоть с WebGPU, Wasm или собственным рендерером — библиотека сама не тащит за собой ещё один объектный мир.

Ну и без AI-обвязки релиз теперь, видимо, считается незаконченным: вместе с библиотекой положили /math skill.

https://github.com/pmndrs/math

#math #library
❤8🔥5
#релиз дня

Яндекс выложил в открытый доступ новую базовую модель Alice AI — AliceAI-Foundation-80B-A3B-Base. Веса доступны под Apache 2.0. И это не доработка чужих весов: модель полностью обучили с нуля.

Turing Post включил её в подборку ключевых моделей недели, а техрук из Google DeepMind выделил Alice AI как запуск, доказывающий тренд на то, что небольшие и эффективные модели уже сейчас меняют всю экономику AI.

По сравнению с предыдущей Alice AI LLM она стала заметно компактнее: 80 млрд параметров вместо 235 млрд, а при генерации благодаря Mixture of Experts активируется только 3 млрд. Основной претрейн — 17,5 трлн токенов, рабочий контекст — 128K, максимальный — 256K+.

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

Параллельно в сам претрейн добавили больше математики, программирования и STEM-задач, чтобы заготовить основу для reasoning ещё до последующего дообучения. На опубликованных компанией тестах это дало особенно сильные результаты в русскоязычных задачах: модель заняла первое место на 8 из 10 бенчмарков на факты, образование и экспертные знания среди сравниваемых открытых претрейнов.

При этом Foundation — не финальный вариант, а полигон для следующего поколения моделей. На ней проверяют архитектуру, данные и подходы к обучению, которые потом должны лечь в основу более сложного reasoning и агентных возможностей.
🔥7👍2🫡2👏1
#заметка дня

Позабытый формат

В комментариях к свежему Subversion спор про Git и централизованные VCS.

На моей первой работе — 2009 год — мы использовали svn. И стыдно не было.

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

CVS и SVN предполагали/предполагают одну главную историю на сервере. Для обычной команды это вполне логично. У Linux была и есть другая структура: тысячи разработчиков, мейнтейнеры подсистем, несколько уровней доверия. Изменения идут от автора к мейнтейнеру, от него выше и в конце концов к Линусу.

С одним центральным репозиторием сразу возникает вопрос: кому разрешено туда писать? Всем нельзя, одному Линусу — бессмысленно. Поэтому Linux сначала перешёл на BitKeeper, где у каждого мейнтейнера мог быть свой полноценный репозиторий, а изменения передавались дальше по цепочке.

В 2005 году бесплатный BitKeeper для Linux закончился, и Линус написал Git. Требования были вполне приземлённые: быстро работать с огромным проектом, нормально переживать множество параллельных веток и не требовать единого сервера для каждого коммита. Человек ведёт свою историю сам, а другой человек решает, забирать её к себе или нет.

Git при этом сначала был скорее механизмом работы с историей, чем аккуратно спроектированным пользовательским инструментом. Интерфейс достраивали уже потом. Этим хорошо объясняются index, HEAD, несколько видов reset, reflog и прочие вещи, которые приходится отдельно учить даже после многих лет работы.

Потом появился GitHub. Git уже был, но совместная работа вокруг него требовала заметно больше ручной возни. GitHub собрал в одном месте репозитории, форки, просмотр кода, обсуждения и pull requests. Именно после этого Git стал удобен не только как VCS, но и как основа всей работы вокруг кода.

А дальше Git просто стало трудно не выбрать. На нём жил open source, его знали разработчики, его поддерживали IDE, CI и хостинги.

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

Кто-то из вас, котаны, застал или сидит до сих пор на svn?

Иллюстрация: GitKraken.

#svn #git
🔥2👍1
#инструмент дня

Забайтил твиттер этим скриншотом с успехом аж на 55 тысяч просмотров. На скриншоте изображён стрим экрана моего iPhone в приложении Device Hub.

И чо?

А в то, что в Евросоюзе приложение iPhone Mirroring для управления телефоном с ноутбука отключено уже второй год.

И нюанс тут вот в чём: причина отсутствия Mirroring — не техническая. Apple упирается в DMA, а конкретно в требования к interoperability. Если Apple даёт своему Mac особый доступ к возможностям iOS, сторонние производители тоже могут потребовать сопоставимый доступ. Сама Apple прямо пишет, что пока не нашла безопасного способа открыть iPhone Mirroring для non-Apple devices, не подвергая риску данные на телефоне. Поэтому в ЕС функцию просто не выпускают.

А Device Hub — пожалуйста.

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

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

Обычный iPhone Mirroring он, конечно, не заменяет. Нет всей системной интеграции, уведомлений и сценария «телефон валяется где-то в квартире, а я пользуюсь им с Mac».

Короче, стримить айфон нельзя, но если очень хочется — то можно.

#ios #iphone #apple #eu
❤2