14544
Блог Lead JS-разработчика из Хельсинки Автор: @bekharsky По рекламе: https://telega.in/channels/htmlshit/card?r=GLOiHluU или https://t.me/it_adv Чат: https://t.me/htmlshitchat
Как выглядит ваше идеальное воскресенье? Пять мероприятий до обеда или пять часов под одеялом?
👀 У Саши Бударина и его жены мнения разошлись. Но одну идею они все-таки одобрили — сходить на ИТ-конференцию Импульс Т1.
19 ноября здесь можно отточить ИТ-мастерство на реальных задачах, познакомиться с экспертами, поработать с ИИ-агентами и попробовать новые инструменты. 5 направлений и 70+ активностей для всех, кто в ИТ. А после — ждем на классной вечеринке.
➡️ Если тоже за развитие с пользой и удовольствием — вам сюда ⬅️
#инструмент дня
Пару дней назад я писал про Skullet — библиотеку, которая автоматически генерирует скелетоны для загрузки контента. А теперь прилетел nano-skeleton, который решает ту же задачу, но совершенно другим способом.
Помните спор про то, что модели не могут в CSS? Вот оттуда ноги растут.
Напомню, Skullet невидимо рендерит компонент с примером данных, измеряет геометрию элементов и по ней строит скелетон. Причём умеет запоминать полученную геометрию для следующих загрузок.
nano-skeleton ничего не измеряет и не создаёт отдельную копию интерфейса. Мы просто оборачиваем существующие элементы в <nano-skeleton>, а библиотека превращает их в заглушки с помощью CSS. Исходная разметка остаётся в DOM и продолжает участвовать в раскладке.
Забавно реализована работа с текстом. Его скрывают через -webkit-text-fill-color: transparent, а вместо букв рисуют градиентный фон. box-decoration-break: clone позволяет превратить каждую перенесённую строку в отдельную закруглённую полоску.
Для более сложных вариантов автор даже сделал два собственных вариативных WOFF2-шрифта, в которых вместо букв нарисованы прямоугольники. У шрифтов есть оси для настройки ширины символов, высоты полосок и скругления углов. Так можно получить заглушки не только для целых строк, но и для отдельных слов.
В JavaScript остаются управление состоянием загрузки, MutationObserver для отслеживания изменений текста и Context Protocol для передачи состояния вложенным компонентам. Обёртки используют display: contents, чтобы не ломать flex/grid-раскладку. Есть поддержка Shadow DOM и SSR: стили могут отрисовать скелетон ещё до регистрации Web Components.
Но есть нюанс с обещанным отсутствием layout shift. Если настоящий текст окажется длиннее заглушки, интерфейс всё равно прыгнет. А режимы с подменой шрифта могут давать другие переносы из-за усреднённой ширины символов.
Впрочем, Skullet тоже не умеет предсказывать размеры ещё не полученных данных. Его точность зависит от того, насколько удачно подобраны образцы.
Получаются два разных подхода: Skullet измеряет интерфейс и воспроизводит его геометрию, nano-skeleton использует сам интерфейс в качестве заглушки. Никакого вычисления.
И решения CSS там на грани фантастики, в том числе.
Автор проекта: Владислав Шкодин.
GitHub: https://github.com/smashercosmo/nano-skeleton
#css #skeleton #placeholder
#релиз дня
Последние несколько месяцев активно развивается тема HTML-in-Canvas. Особенно на фоне агентской разработки, когда собрать какой-нибудь безумный эксперимент с WebGL, шейдерами и интерактивным интерфейсом стало гораздо проще. Ещё до официального релиза API появилась целая подборка экспериментов, и посмотреть там есть на что.
А теперь в Chrome 157 HTML-in-Canvas наконец добрался до стабильной версии и работает без флагов.
Суть в том, что обычный HTML теперь можно рисовать внутри <canvas>, в том числе использовать как текстуру в WebGL и WebGPU. Причём это не просто картинка из DOM: кнопки нажимаются, поля ввода работают, текст можно выделять, копировать, переводить и находить через Ctrl+F. Даже доступность для скринридеров сохраняется.
Можно буквально натянуть HTML-форму на вращающийся куб, пропустить через шейдер или отобразить на изогнутой поверхности — и всё продолжит работать. Раньше для такого приходилось синхронизировать HTML-оверлеи с 3D-сценой или самостоятельно реализовывать привычные возможности браузера.
Правда, за время разработки API уже успели несколько раз поменять, как это обычно и бывает. Например, <canvas layoutsubtree> превратился в <canvas content="drawable">, а WebGL-метод texElementImage2D() переименовали в texElementSubImage2D(). В результате часть старых экспериментов из той самой подборки в Chrome 157 уже не работает. Даже реализации в Three.js, PixiJS и PlayCanvas не успели сразу адаптироваться к изменениям.
Зато вот несколько примеров из актуального репозитория спецификации:
— Официальные демки Chrome
— Интерактивная HTML-карточка в WebGL
— Желейный слайдер на WebGPU
— Сложная типографика внутри Canvas
А здесь ещё одна галерея экспериментов с учётом изменений API.
Пока это преимущественно территория Chromium: Firefox и Safari API ещё не поддерживают.
Чо, котаны, кто сделает свою крутую демку? :)
#html #3d #webgl #webgpu #canvas
#инструмент дня
Я в универе постоянно делал презентации для своих работ и семинаров. Ну просто как минимум потому, что старание — это всегда плюс балл не только к оценке, но и к репутации.
Это, кстати, вполне себе лайфхак. Пишите лабы по программированию на двух языках, делайте нормальные доки — и будет вам легко.
Но не суть. Я сильно пристрастился к тачпаду на ноутбуке, потому все визуальные задачи, где нужно было мышевозить, давались с трудом. Когда готовишь документ, горячие клавиши спасают, а уж сейчас всё сразу в Markdown по-умолчанию пишешь и голова не болит. Но вот презентации и электронные схемы — дело другое.
И если для схем я ещё готов подключить мышь, напрячься и так далее, то презентации я писал на HTML, используя https://revealjs.com/.
Но инструмент, который хочу показать сегодня — это https://sli.dev/
Что он делает? Из видео, в общем, понятно — преобразует Markdown-файлы во всё те же презентации! Это очень круто, почти один уровень с Mermaid по удобству.
Горячая рекомендация.
P. S. Впрочем, можно взять ллм-ку и ffmpeg и устроить фурор с видео: /channel/htmlshit/4309
Но вдруг вам текст надо.
#markdown #tool #presentation #бородач
#статья дня
В Vercel научили AI-агентов заниматься работой, до которой у разработчиков обычно не доходят руки, — разбирать JavaScript-бандлы и выкидывать из них лишнее.
В Next.js 16.4 появился специальный скилл next-bundle-optimizer. Он даёт агенту доступ к графу зависимостей Turbopack, чтобы тот мог искать модули, которые случайно попали в первоначальную загрузку, неработающий lazy loading, дублирующиеся зависимости и прочие радости современной фронтенд-разработки.
Устанавливается одной командой:npx skills add vercel/next.js --skill next-bundle-optimizer
Дальше запускаем /next-bundle-optimizer, изучаем предложения и при желании просим агента применить исправления.
В Vercel таким способом уже убрали почти 2 МБ сжатого JavaScript суммарно с разных страниц v0 и vercel.com. Например, обнаружили, что редактор кода грузился даже для пользователей, которым он вообще не был доступен. Минус 150 КБ почти на каждой странице.
Кстати, о том, что ещё можно поручить ИИ. Поделюсь папкой Telegram-каналов, где авторы экспериментируют с нейросетями, автоматизируют рутину, занимаются вайб-кодингом и запускают собственные проекты. Есть что подсмотреть и попробовать у себя.
А на канале Veai из этой папки прямо сейчас лежит рабочий способ обойти блокировки Claude.
#инструмент дня
Во вчерашнем посте про переписывание веб-клиента Twitter я мельком упомянул их собственный линтер для AI-мусора — anti-slop.
Разработчики активно использовали AI-агентов (ещё бы), но одних инструкций в промптах оказалось недостаточно. Поэтому в репозитории появился AGENTS.md с общими правилами и больше 25 skills для типовых задач: от работы с Relay и роутером до ревью и сопровождения PR.
А правила, которые агенты регулярно нарушали, превратили в плагины для Oxlint.
Один из них — anti-slop. Он ловит характерные для AI-генерации конструкции:
- Цепочки приведений типов вроде value as unknown as User, которыми обходят проверку TypeScript.
- Параметры с типом unknown вместо конкретного контракта.
- Условные spread-операторы вроде ...(condition ? { value } : {}), которыми агенты любят усложнять код.
Есть и другие плагины, проверяющие использование Relay, Tailwind, тестов и переводов. Всё это запускается автоматически вместе с форматированием и проверкой типов.
Кстати, существует и независимый открытый anti-slop от Диллона Малроя. Тоже набор правил для Oxlint, но уже доступный всем. Там около 20 проверок: от небезопасных приведений типов и ненужных async до моков модулей и копирования аккумулятора на каждой итерации reduce.
Вместо того чтобы в сотый раз объяснять агенту, как не надо писать код, можно один раз сформулировать правило, добавить его в линтер и заставить агента исправлять собственные ошибки.
#ai #slop #tool
#статья дня
В Twitter переписали веб-клиент с нуля. Разумеется, с AI-агентами, пятью инженерами и прочими обязательными атрибутами 2026 года.
Потому пишем про работу над производительностью!
Например, Vite с Rolldown создавал 582 стартовых JavaScript-файла для неавторизованных пользователей и 754 для авторизованных. Это особенность алгоритма code splitting, унаследованного от Rollup: общие зависимости выносятся в отдельные чанки, иногда по одному модулю. Проблема настолько известная, что у Rolldown есть отдельный RFC.
Да-да, ESM на вебе это же такая офигительная идея.
Браузеру приходилось загружать сотни файлов за несколько сетевых раундов. Инженеры написали плагин, объединяющий стартовые модули в крупные чанки, и сократили количество файлов до 10 и 182 соответственно.
А ещё они перестали загружать JavaScript одновременно с CSS. На медленных соединениях скрипты конкурировали за пропускную способность с блокирующими рендеринг стилями. Теперь JS загружается после CSS, и First Contentful Paint на странице твита сократился с 7,2 до 1,8 секунды.
Из остального: объединили три сервера в один на Fastify, заменили пустую HTML-заглушку на streaming SSR, научились гидратировать страницу до завершения HTML-потока. Вместо сериализации Relay Store передают GraphQL-ответы прямо в HTML — это в 4–5 раз меньше данных. Убрали дублирование SVG-иконок, уменьшили HTML для поисковиков, перевели изображения на WebP и выкинули несколько десятков килобайт ненужных переводов и зависимостей.
И даже написали собственный anti-slop линтер, чтобы отлавливать мусор, который любят генерировать AI-агенты.
Кажется, самая интересная часть.
В результате на Slow 4G первый твит появляется за 2,7 секунды вместо 23,9.
Забавно, что главное достижение всех этих оптимизаций — снова научить браузер показывать HTML до загрузки JavaScript.
Подробный технический разбор от инженеров X.
Казалось бы, показать колонку с постами, да?
#twitter #performance
В поисках новых карьерных возможностей?
Необязательно ограничиваться локальным рынком: зарубежные компании тоже могут стать хорошей точкой для профессионального роста. Тем более что среди них есть команды, в которых уже работают русскоговорящие специалисты — адаптироваться к новой рабочей среде будет проще.
Коллеги из Dev Connectable Jobs подготовили подборку зарубежных вакансий, которые могут заинтересовать тех, кто задумывается о следующем карьерном шаге 👇
• QA Automation Engineer в Planner5D — один из мировых лидеров в нише home design, меняющий индустрию с помощью передовых технологий AI и 3D-графики.
•
• Senior Data Engineer в Symfa — международная компания, которая занимается разработкой ПО и IT-консалтингом для бизнеса.
• Senior QA Engineer (Full Stack) в Spotware — финтех-компания, специализирующаяся на разработке продуктов для брокеров, банков и трейдеров.
• Senior Staff Machine Learning Engineer в Inworld AI — предлагает платформу разработки виртуальных персонажей, управляемых AI.
• Backend Team Lead в Splitmetrics — платформа для аналитики и продвижения мобильных приложений в App Store и Google Play.
#заметка дня
Помните браузер Ladybird, который я тут периодически вспоминаю? Вот недавно: /channel/htmlshit/4055
Так вот он всё ближе к состоянию, когда им можно будет пользоваться каждый день. Октябрьский отчёт просто пушечный.
Посмотрите на сравнение Ladybird с Chrome, Safari и Firefox в начале отчёта. Пока JavaScript блокирует основной поток, у всех трёх браузеров CSS-анимация замирает, а у Ladybird продолжает работать как ни в чём не бывало.
Разработчики научили браузер обрабатывать CSS отдельно от JavaScript. Теперь, даже если JavaScript занят тяжёлыми вычислениями, браузер продолжает обновлять стили и расположение элементов на странице. Поэтому анимации работают, даже если они меняют размеры элементов (`width`, font-size`). Более того, даже :hover` продолжает реагировать на мышь! Авторы утверждают, что ни один другой браузер пока такого не умеет.
А заодно в октябре добавили JIT для JavaScript, новый движок WebAssembly (до 7 раз быстрее старого в отдельных тестах), пачку новых CSS-возможностей, обновили интерфейс и обогнали Safari Technology Preview по количеству пройденных Web Platform Tests, практически догнав Firefox.
Всё это на собственном движке, без Chromium и WebKit.
Вообще, в конце 2026 года делать очередной браузер на Chromium уже должно быть немного стыдно. Сколько можно перекрашивать один и тот же движок?
https://ladybird.org/newsletter/2026-10-31/
#ladybird #browser
#молния дня
Postman во время фонового запуска или обновления без согласия пользователя автоматически модифицирует глобальные конфиги локальных AI-инструментов (в частности Claude Code и Codex) и устанавливает в них свои плагины.
При этом инсталлятор программно добавляет хеши своих стартап-хуков в список доверенных, обходя стандартное окно подтверждения безопасности и незаметно внедряет собственные инструкции в рабочие сессии ИИ-ассистентов.
P.S. Разве им кто-то ещё пользуется? Ну да ладно, лучше предупредить.
Продолжают себя закапывать.
Поделитесь пожалуйста прекрасными альтернативами в комментариях.
https://github.com/postmanlabs/postman-app-support/issues/14370
#postman #scam
Про скрытую утечку памяти в личных финансах (и почему кэш сейчас – это убыток)
На позиции Senior/Team Lead с доходом 300k+ легко поймать ложное ощущение финансовой стабильности. Деньги приходят регулярно, накопления на счетах растут. Но если копнуть глубже, на длинной дистанции мы получаем классический Memory leak: код вроде бы выполняется без ошибок, но ёмкость капитала тает из-за инфляционного тренда (реальная инфляция превышает официальную инфляцию и, соответственно, ставки по вкладам и накопительным счетам в 2-3 раза)
Можно, конечно, хранить в крипте, но затариться на всю котлету – мягко говоря, глупо
Остаётся недвижка, которая каждый год растёт на реальный % инфляции. Покупать бетон на всю котлету – архитектурная ошибка, есть более изящный способ. Назовём его асинхронная инвестиция. Она включает в себя:
Использование плеча. Вместо покупки квартиры за кэш, грамотное использование инструментов: рассрочка, субсидированная или траншевая ипотека. Вкладываете мало, за счёт этого доходность на вложенные получается феноменальной
Амортизация за счёт текущего денежного потока. При грамотном выборе программы ежемесячный платеж на этапе строительства легко изолируется внутри текущего дохода. Для зарплаты в 300–400k это незначительная нагрузка, которая не ломает привычный уровень жизни
Выход в self-hosted. К моменту сдачи объекта актив переводится на модель самоокупаемости за счёт аренды + продолжает расти в цене без ежедневного участия
Гибкая настройка под локацию. Если ты удаленщик: Весь процесс от выбора проекта до регистрации сделки проходит в режиме 100% онлайн. Никаких перелётов и бумажной бюрократии
Если ты в РФ и любишь дотошный контроль: Эксперт работает с тобой в режиме парного программирования. Постоянно на связи, выдает инфу по объектам, в любой момент можно съездить на локацию, чтобы «пощупать» будущий актив
Если ты задумываешься о сохранения капитала и уровня жизни, то вот ребята с канала «Влюблённые в недвижимость» сделали свежую подборку для айтишников.
Подпишись, тут без маркетинговой шелухи.
#статья дня
В Video.js решили проверить, насколько веб готов к складным смартфонам, и попробовали повторить интерфейс Netflix на новом iPhone Duo: видео на верхней половине экрана, элементы управления — на нижней.
Оказалось, что необходимые API уже есть. Device Posture API позволяет определить, сложено ли устройство, а Viewport Segments API — получить размеры и расположение отдельных частей экрана. Причём адаптировать интерфейс можно практически целиком на CSS, используя @media (device-posture: folded) и env(viewport-segment-...).
Авторы даже воспроизвели красивое размытое отражение видео под кнопками управления с помощью Canvas.
Но есть нюанс. На iPhone всё это заработало только после включения трёх экспериментальных флагов Safari. А Chromium на Pixel Fold вообще обрезает полноэкранный интерфейс по границе верхней половины экрана.
Получается забавно: браузер уже умеет определять положение сгиба и геометрию экрана, но нормально воспользоваться этими данными в полноэкранном видеоплеере пока не даёт.
А вот разработчикам на фреймворках типа Flutter ещё веселее, потому что требование обновить под Duo уже не за горами, а инструментов толком нет. Жалко будет, если пульт из магазина выкинут :( Но вроде что-то наклёвывается.
#ios #iphone #duo
#статья дня
Команда Zed представила DeltaDB — систему контроля версий, рассчитанную на параллельную работу AI-агентов.
В отличие от Git, она записывает не только коммиты, но и каждое изменение кода вместе с контекстом его появления, включая переписку с агентами.
Это позволяет:
- Откатываться к любому промежуточному состоянию, даже без коммитов.
- Проследить историю конкретного фрагмента кода вплоть до разговора, в котором он появился.
- Нескольким агентам работать над проектом одновременно и синхронизировать изменения без отдельных worktree.
Под капотом Rust, SQLite, CRDT для объединения изменений и Cloudflare Durable Objects для синхронизации.
При этом отказываться от Git не нужно: DeltaDB работает рядом с ним, сохраняя подробную историю между коммитами.
Статья полна технических подробностей, развесистых деревьев и примеров кода.
Вопрос только в том, насколько удобно будет разбираться в этой истории, когда агенты начнут генерировать тысячи изменений за день.
#git #zed #vcs
#видео дня
Чем я занимаюсь в день рождения?
Хуячу устройство, которое прикидывается SD-картой, читает содержимое файла, описывающего анимации светодиодной полоски и, соответственно, эти анимации зажигает.
Цель — уместить это в плату, которая влезет в макбук без остатка :)
#заметка дня
Если вы ещё не пользуетесь git worktree — мы идём к вам.
В Git уже больше десяти лет есть возможность работать с несколькими ветками одновременно, не переключаясь между ними. Называется она worktree и позволяет создать несколько рабочих директорий одного репозитория. История коммитов общая, а файлы и незакоммиченные изменения у каждого дерева свои.
Например, в одной директории вы пишете фичу, в другой исправляете баг, а в третьей проверяете чужой PR. И никто никому не мешает.
Команд всего несколько:
- git worktree add -b fix/auth ../app-auth main — создать отдельную директорию с новой веткой.
- git worktree list — посмотреть, что уже создано.
- git worktree remove ../app-auth — прибраться после работы.
А с приходом ИИ-агентов worktree стал ещё полезнее.
Теперь можно запустить несколько агентов на разные задачи, каждому выдать свою директорию и не переживать, что один переключит ветку или перезапишет изменения другого.
Cursor, Codex и Claude Code уже умеют работать с worktree, в том числе создавать их для отдельных агентских сессий. Я вообще рекомендую включать это по-умолчанию.
Правда, есть нюанс: директории независимые, а вот ресурсы компьютера — нет. Несколько копий приложения могут конфликтовать из-за портов и базы данных, зависимости съедают диск, а параллельные тесты и линтеры — всю оперативку.
Поэтому для полноценной работы стоит автоматизировать настройку окружения, разделить порты и базы, использовать общие кеши и ограничивать число одновременных тяжёлых задач. Для последнего, например, есть свежая утилита heavy.
Ну а если вы работаете без агентов, worktree всё равно пригодится. Как минимум больше не придётся прятать незаконченные изменения в git stash ради срочного исправления в другой ветке.
Документация Git
#git #worktree
#такое дня
Недостаточно нам было RCE по всему интернету за последний месяц, так ещё и Telegram решил выкатить никому не нужные HTML-виджеты прямо в сообщениях. И практически сразу получил RCE в подарок.
В Telegram появилась возможность отправлять интерактивные сообщения с HTML, CSS и JavaScript. То есть боты теперь могут присылать небольшие приложения, которые выполняются прямо в мессенджере.
Для безопасности всё это запускается в отдельной песочнице на движке QuickJS. Без доступа к системным функциям, сети и прочим радостям.
Вот только в QuickJS обнаружилась ошибка работы с памятью, позволившая эту песочницу обойти. В результате исследователи продемонстрировали запуск калькулятора на Android, а затем появился и эксплойт для Telegram Desktop 7.4.2 под Windows. Там специально подготовленный виджет добирается до системной функции WinExec и запускает calc.exe.
Причём Telegram продолжает работать как ни в чём не бывало.
Уязвимость в QuickJS уже исправили, но в опубликованную версию Telegram Desktop 7.4.2 исправление ещё не попало.
У Telegram уже есть Mini Apps, теперь понадобилось ещё и выполнение чужого JavaScript внутри обычных сообщений. Зато теперь вместо скучной кнопочки бот может прислать вам всякого в нагрузку.
#telegram
Бэкендеры, 17 ноября AvitoTech усаживает вас за игровые столы 🔥
Backend Roulette — вечеринка для бэкенд- и Go-разработчиков и архитекторов System Design. Инженерные задачи там раскладываются как партия в покер, а вместо докладов будут практика, обмен опытом и немного азарта.
Роль крупье за каждым столом играет эксперт AvitoTech: выдаёт команде вводные и по ходу игры подкидывает новые обстоятельства, под которые придётся перестраивать решение.
Для тех, кто не хочет за стол, организаторы подготовили сайд-активности и нетворкинг с коллегами. А после игры — афтерпати и нетворк.
P. S. Играть в покер уметь необязательно, достаточно желания классно провести время.
📎 Регистрация
👾 Открытое собеседование для Frontend-разработчиков: интервьюер из R-Vision, ex-Сбер
12 ноября в 19:00 мск приходи посмотреть, как проходит реальное техническое интервью на позицию Frontend-разработчика
Интервьюер: Даниил Дмитриев, Frontend-разработчик в R-Vision, ex-Сбер. Работает с React и TypeScript, совмещает разработку с ролью тимлида, менторит коллег и проводит код-ревью
Без сценария и заранее известных вопросов ↓
В роли кандидата – действующий разработчик, который впервые увидит задания прямо на эфире
Обычно ты видишь собеседование только со стороны кандидата. Здесь сможешь посмотреть на процесс глазами интервьюера:
— какие темы и задачи проверяют на Frontend-собеседованиях
— как кандидат отвечает и где возникают сложности
— на что Даниил обращает внимание при оценке ответов
Как делегировать ИИ работу с реальными данными и не потерять контроль
ИИ-агенты уже умеют писать SQL лучше джуна. Но давать им доступ к базе без архитектуры, которой можно доверять, никто не хочет.
10 ноября Хекслет проводит бесплатный воркшоп про кастомный MCP. На нём разберём паттерн, который можно внедрить в команде:
→ в каких случаях нужен свой MCP-сервер
→ как спроектировать коннектор с контролем прав
→ как ограничить агента безопасным чтением
→ как агент-аналитик ведёт себя на реальной задаче
На выходе у вас будет готовый шаблон MCP-сервера, который можно забрать в свои проекты.
🗓 10 ноября, 19:00 МСК, онлайн
👉 Записаться >>
ㅤ
#реклама
О рекламодателе
#библиотека дня
Skullet — библиотека, которая сама генерирует скелетоны для загрузки контента. Больше не нужно рисовать серые прямоугольники руками и поддерживать отдельную вёрстку для каждого состояния.
Работает довольно просто: передаём компонент и пример данных, библиотека невидимо рендерит его, измеряет размеры элементов и строит по ним скелетон. В результате заглушка повторяет геометрию настоящего интерфейса, а при загрузке данных ничего не прыгает.
import { Skeleton } from "skullet/react";
const SAMPLE_USER = {
name: "John Doe",
bio: "Frontend developer",
};
<Skeleton data={user} sample={SAMPLE_USER}>
{(user) => <UserCard user={user} />}
</Skeleton>
Смысл быть Senior/Lead с доходом 300k+, если вы ведете себя как финансовый безграмотный и позволяете инфляции превращать ваш кэш в тыкву?
Пока вы ловите иллюзию стабильности и держите миллионы на тающих счетах, продвинутые удаленщики хакают систему и оформляют квартиры в Москве и Питере через гибкие беспроцентные рассрочки вообще без переплат
Команда Влюбленных в недвижимость без соплей и маркетинговой шелухи выложила закрытый пул инвест-объектов с готовой юнит-экономикой для ИТ – кликайте и забирайте, иначе так и останетесь с обесценивающейся бумагой.
Реклама. Рекламодатель ИП Громова А.Л. ИНН 781014051159 erid: 2VtzqxfKuJnЧитать полностью…
#игра дня
В 1996 году Пэт Керр за одни выходные написал на Atari ST небольшую симуляцию физики автомобилей. Позже она стала основой поведения машин в первой GTA.
Прототип был написан на GFA BASIC, а для самой игры его перенесли на C. Спустя 30 лет автор воссоздал его на JavaScript, добавил визуализацию сил и подробно разобрал, как всё работает.
В основе — физика твёрдого тела с массой, инерцией и вращением. А поведение шин автор, по собственному признанию, практически выдумал: сопротивление движению вбок значительно сильнее, чем вдоль колеса. Никакой сложной модели сцепления с дорогой, зато машина вполне убедительно разгоняется, поворачивает и уходит в занос.
На странице можно поиграть с симуляцией, переключиться между автомобилем, космическим кораблём и обычным кирпичом, включить ручник и посмотреть, как меняется поведение.
А заодно вспомним, что недавно Брамус Ван Дамм воссоздал первую GTA на JavaScript и WebGL. Причём не через эмулятор, а написав собственный движок на TypeScript и Three.js, который читает оригинальные файлы игры. И да, большую часть реализации ему помог написать Gemini.
Играем, котаны?
#game #engine
#заметка дня
Там WebKit-товарищи выкатили CSS mesh gradients и это какая-то совершеннейшая дичь, только посмотрите на иллюстрацию.
В отличие от привычных CSS-градиентов, здесь цвета задаются в узлах двумерной сетки. Узлы можно двигать, линии между ними изгибать кривыми Безье, а браузер сам рассчитывает плавные переходы. То, ради чего раньше приходилось открывать графический редактор или городить конструкцию из десятка radial-gradient().
Простейший пример — mesh-gradient(red, blue; green, yellow). Точка с запятой разделяет строки сетки. А дальше начинаются координаты, контрольные точки, интерполяция в разных цветовых пространствах и прочие радости.
Пока это лютый эксперимент. Базовый рендеринг только что попал в WebKit, причём пока на CPU, а GPU-реализация ещё впереди. В стабильном Safari этого нет, Chrome и Firefox тоже пока не поддерживают.
Зато CSS Working Group уже согласовала включение mesh-gradient() и его более простого родственника freeform-gradient() в CSS Images Level 5.
На MDN отдельной документации пока нет, но можно почитать предложение с примерами и синтаксисом.
#css #gradient
В России можно посещать IT-мероприятия хоть каждый день: как оффлайн, так и онлайн
Но где их находить? Как узнавать о них раньше, чем когда все начнут выкладывать фотографии оттуда?
Переходите на канал IT-Мероприятия России. В нём каждый день анонсируются мероприятия со всех городов России
📆 в канале размещаются как онлайн, так и оффлайн мероприятия;
👩💻 можно найти ивенты по любому стеку: программирование, frontend-backend разработка, кибербезопасность, дата-аналитика, osint, devops и другие;
🎙 разнообразные форматы мероприятий: митапы с коллегами по цеху, конференции и вебинары с известными опытными специалистами, форумы и олимпиады от важных представителей индустрии и многое другое
А чтобы не искать по разным форумам и чатам новости о предстоящих ивентах:
🚀 IT-мероприятия России — подписывайся и будь в курсе всех предстоящих мероприятий!
#новость дня
Я не первый и не последний, от кого вы это прочтёте, но это правильно. Потому что, судя по всему, повторять придётся ещё долго.
У Binance увели $6,3 миллиарда. Сначала интернет увлечённо обсуждал северокорейскую шпионку, якобы соблазнившую одного из инженеров. Эту историю Binance опровергла, но северокорейский след вполне реальный — на него указало ФБР.
А вот способ проникновения оказался куда прозаичнее. Фальшивые рекрутеры в LinkedIn, несколько собеседований, тестовое задание с вредоносным кодом. Параллельно другой инженер установил заражённый Homebrew по рекламной ссылке. Дальше — доступ к внутренним системам, использование корпоративного ИИ-инструмента и кража миллиардов.
Сесурити на уровне.
Кстати, Андрей Ситник ещё в 2024 году поднимал проблему безопасности Dev Containers. Он обнаружил, что VS Code пробрасывает внутрь контейнера SSH-агент, GPG и другие ресурсы хоста. То есть даже запуск подозрительного кода в Dev Container не гарантирует изоляции.
Фейковые HR, фишинговые тестовые задания и заражённые зависимости появились не вчера. Не запускайте чужой код и не устанавливайте непонятно что на свои рабочие и личные компьютеры. Используйте изолированные среды без доступа к вашим ключам и учётным данным.
И, пожалуйста, доносите это до работодателей. Безопасная среда для запуска чужого кода должна быть нормой, а не личной паранойей разработчика. Особенно сейчас, когда ИИ-агенты готовы скачать и запустить вообще что угодно.
#security
#фишка дня
Зачем?
Ну, во-первых, это красиво!
Вместо заранее подготовленной карты окружения используется фронтальная камера телефона. Изображение с неё уменьшается до 64 пикселей по длинной стороне и передаётся в WebGL-шейдер как текстура. Поэтому свет от настоящих ламп и окон отражается от виртуального металла.
Сама фольга тоже не просто золотой градиент. Поверхность состоит из участков с концентрическими бороздками, небольшими неровностями и анизотропными отражениями по модели GGX. Получается характерный блеск обработанного металла.
При наклоне телефона отражения перемещаются благодаря DeviceOrientationEvent. На компьютере можно управлять мышью, а без камеры — просто имитация комнаты с лампой.
Поиграться: https://tsumikiroom.github.io/holo-foil-test/cam.html
Там переключите на вариант с камерой сразу, это стоит того.
#webgl #shader
Новый уровень ИТ-практик: Импульс Т1 снова в Москве 🚀
19 ноября столица примет ИТ-конференцию Импульс Т1. Мы создаём среду, где специалисты получают не просто полезную информацию, а рабочие инструменты, применимые в проектах уже на следующий день.
Импульс Т1 2026 — это:
🔹5 направлений деловой программы;
🔹130+ экспертных спикеров;
🔹70+ прикладных активностей;
🔹2 000+ участников сообщества.
#статья дня
Сколько стоит разработка на разных JS-фреймворках, если код пишет AI?
Мы привыкли сравнивать фреймворки по производительности, размеру бандла и удобству разработки. Но теперь появилась ещё одна интересная метрика — сколько денег и токенов потратит AI-агент, чтобы написать на них одно и то же приложение.
Нолан Лоусон решил это проверить. Он взял 12 фреймворков, Claude Opus 5.5 и попросил агента собрать на каждом одинаковое приложение — каталог покемонов с поиском, фильтрами и данными из PokéAPI. Для каждого фреймворка провёл по пять запусков, проверил соответствие требованиям и прогнал Lighthouse.
Результаты по стоимости генерации:
• Hono + htmx — $2.67
• Astro — $2.76
• Nuxt — $2.82
• Vanilla JS — $2.98
• Next.js — $3.14
• React Router — $3.81
• SvelteKit — $4.28
• Angular — $4.97
Причём Angular не смог собрать рабочее приложение в двух из пяти попыток, а SvelteKit оказался дорогим отчасти потому, что агент каждый раз читал руководство по миграции на новую версию.
По количеству написанного кода разница тоже любопытная: Hono + htmx потребовал около 1370 строк, а Angular — более 2000. Это важно не только для читаемости: чем больше кодовая база, тем больше контекста придётся обрабатывать агенту при последующих изменениях.
При этом результаты Lighthouse у большинства почти одинаковые — 98–100 баллов по производительности. А вот объём клиентского JavaScript различается радикально: от практически нуля у Astro до 142 КБ у Next.js.
Конечно, один небольшой каталог покемонов — не универсальный бенчмарк, а пять запусков не позволяют объявлять победителя. К тому же стоимость генерации зависит не только от самого фреймворка, но и от того, насколько хорошо модель с ним знакома, качества документации и конкретной задачи.
Интересно будет повторить эксперимент через полгода. Если результаты заметно поменяются без существенных изменений самих фреймворков, получится, что мы измеряем не столько их сложность, сколько текущие предпочтения и пробелы конкретной модели.
Исследование и все графики
#ai #frontend
#день рождения дня
EMACS стукнуло 50, а мне стукнуло 39.
#такое дня
Я собрал себе под свой плеер — Innioasis Y1 — клиент YouTube Music. Плеер — на андроиде 4.2.2
Угадайте размер APK-шки.