#инструмент дня
Слово «модель» сейчас обычно вызывает в голове что-нибудь на 7–70 миллиардов параметров и десятки гигабайт весов. Но модель вообще не обязана быть такой.
Vercel Labs сделали gpu-lexer — библиотеку подсветки кода, в которой вместо набора грамматик используется одна обученная модель на 41 321 параметр.
Веса упакованы в 6 бит, а весь браузерный пакет занимает 27.4 KB, в сжатом состоянии.
Работает через WebGPU.
Код сначала режется на слова, пробелы, переводы строк и символы. Потом модель для каждого токена выбирает класс:
У классических хайлайтеров подход другой. 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
Слово «модель» сейчас обычно вызывает в голове что-нибудь на 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
❤12👍1🫡1
Media is too big
VIEW IN TELEGRAM
#инструмент дня
Этого стоило ожидать. Вашему вниманию — Quake на CSS.
Реализован он с помощью движка PolyCSS, а выбрать карту можно просто передав значение в параметр. Например, вот второй уровень первого эпизода: https://cssquake.com/?map=e1m2
Итак, а что же такое PolyCSS?
PolyCSS — 3D-движок, который рендерит модели обычными DOM-элементами через CSS
Полигоны при этом реально остаются HTML-элементами. Их можно увидеть в DevTools, стилизовать через CSS, повесить
Поэтому PolyCSS много возится с самой геометрией: убирает внутренние грани, объединяет подходящие поверхности и выбирает разные способы рендера для разных типов полигонов. По умолчанию используется
До Three.js или Babylon.js по возможностям тут далеко: освещение проще, у теней и текстур есть ограничения, а большие сцены довольно быстро начинают упираться в DOM. Но для небольших интерактивных сцен, моделей и всяких веб-экспериментов подход вполне рабочий, и при этом весь результат остаётся частью обычной страницы.
PolyCSS: https://github.com/layoutit/polycss
cssQuake: https://github.com/layoutit/cssQuake
Демонстрация квейком, конечно, это мощно.
#3d #polycss #quake
Этого стоило ожидать. Вашему вниманию — 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
1🔥9❤3
#статья дня
Мы как-то с вами уже обсудили, какими разными бывают .*ignore-файлы. И что не .gitignore-ом единым, вот тут: https://t.me/htmlshit/3989
Но я упустил из виду, что у автора есть ещё статья-продолжение! И она — конкретно про разные вспомогательные файлы уже самого git.
Ну, например, с .gitignore всё уже понятно. А что насчёт .gitattributes?
А этот файл помогает разобраться, как поступать с разными файлами. Например, merge strategy:
и всё, разрулится как надо. Или вот шипите вы мультиплатформу:
А? По-моему, очень круто. Но давайте дальше.
.gitmodules — конфигурация подмодулей git, .mailmap — хендлит обновление почты в старых коммитах, .gitmessage — шаблон сообщения коммита, .git-blame-ignore-revs — позволяет не включать преттиер и линтер в blame (Привет, Саша!).
Ну и, например, как зашиппить пустую папку в git? Положите в неё файл .gitkeep! Но это не стандартный файл, это просто соглашение. Таких много.
Короче, всё это — вот тут: https://nesbitt.io/2026/02/05/git-magic-files.html
Я вообще этот блог люблю, автор жёстко упарывается по менеджерам пакетов и гиту. Алгоритмы разбора зависимостей, диффов, уязвимости — вот это вот всё.
#git #config
Мы как-то с вами уже обсудили, какими разными бывают .*ignore-файлы. И что не .gitignore-ом единым, вот тут: https://t.me/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🔥1
Media is too big
VIEW IN TELEGRAM
#инструмент дня
Когда-то давно ещё на 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
Когда-то давно ещё на 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
1❤15
#статья дня
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,
https://3perf.com/blog/chrome-throttling/
#devtools
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
1❤14👍3
#заметка дня
Надоело сливать лимиты в 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
Надоело сливать лимиты в 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
👍8❤1
#видео дня
Посмотрел выпуск 1×1 с Лёшей Остриковым о разработке ИИ-агентов. Во многом он подтвердил мои мысли о том, как трансформируется подход к работе.
С агентами важнее всего не сам код и даже не умение писать хороший запрос. Нужно понимать процесс, в который ты их встраиваешь: что человек делает шаг за шагом, где он застревает, какие данные использует, где ошибается и что считается эффективным результатом.
Если этого понимания нет, агент, скорее всего, сделает не то.
В выпуске это показано на примере поддержки водителей такси. Агент полезен не потому, что умеет красиво отвечать. Он видит, что водитель не может пройти регистрацию, анализирует экран, находит проблему и помогает завершить процесс.
То же самое с агентами, которые ищут информацию в коде, Wiki и документации. Их ценность не в том, что они «знают всё», а в том, что они встроены в рабочий контекст и сокращают путь от вопроса до решения.
Поэтому сейчас особенно нужны люди, которые умеют разобраться в работе бизнеса, разложить процесс на шаги и понять, где агент действительно поможет. Это касается не только разработчиков — такие процессы есть в любой профессии.
Мне близка и мысль Лёши про любопытство: не ждать идеальных курсов, а брать реальную задачу и пробовать.
Короче, начинать нужно не с вопроса «какой инструмент выбрать», а с вопроса «как устроена моя работа и что в ней можно сделать лучше».
#ai
Посмотрел выпуск 1×1 с Лёшей Остриковым о разработке ИИ-агентов. Во многом он подтвердил мои мысли о том, как трансформируется подход к работе.
С агентами важнее всего не сам код и даже не умение писать хороший запрос. Нужно понимать процесс, в который ты их встраиваешь: что человек делает шаг за шагом, где он застревает, какие данные использует, где ошибается и что считается эффективным результатом.
Если этого понимания нет, агент, скорее всего, сделает не то.
В выпуске это показано на примере поддержки водителей такси. Агент полезен не потому, что умеет красиво отвечать. Он видит, что водитель не может пройти регистрацию, анализирует экран, находит проблему и помогает завершить процесс.
То же самое с агентами, которые ищут информацию в коде, Wiki и документации. Их ценность не в том, что они «знают всё», а в том, что они встроены в рабочий контекст и сокращают путь от вопроса до решения.
Поэтому сейчас особенно нужны люди, которые умеют разобраться в работе бизнеса, разложить процесс на шаги и понять, где агент действительно поможет. Это касается не только разработчиков — такие процессы есть в любой профессии.
Мне близка и мысль Лёши про любопытство: не ждать идеальных курсов, а брать реальную задачу и пробовать.
Короче, начинать нужно не с вопроса «какой инструмент выбрать», а с вопроса «как устроена моя работа и что в ней можно сделать лучше».
#ai
❤3🔥1
#заметка дня
Купили в комиссионке *Cut the Rope: Connect Four*. Дочь любит мультики про Ам Няма, так что игру, конечно, взяли.
Коробка практически полная. Детали даже не сняты с литников, все наклейки не наклеены и монетки на месте. Не хватало только подставки. То есть, буквально, самого главного.
Я решил сделать её на 3D-принтере. Но у меня опыта проектирования нет прям вообще — последний раз я что-то чертил в 2004 в университете, а вылетел из него я до того, как начался AutoCAD.
Таким образом, оставался только один вариант сделать это быстро: вайбкодить предмет.
Я фотографировал детали, измерял их штангенциркулем и объяснял Codex-у, что нужно построить. Потом открывал модель во Fusion, смотрел, что выдаёт слайсер, печатал пробник и возвращался с замечаниями: тут полка нулевой толщины, тутдырка отверстие, тут контур не замкнут и деталь развалилась.
Почему так вообще можно? Потому что CAD-модель — это геометрия, а геометрию можно задать кодом. Ассистент писал Python-скрипт, менял в нём размеры и форму, а результат загружал во Fusion MCP. Слайсер затем показывал, как эту форму принтер разложит на слои. Получился почти привычный цикл разработки: описал задачу, собрал, нашёл баг, исправил. Только каждый «запуск» может занять час и потратить пластик.
Естественно, компьютерное проектирование — вовсе не новая идея. Первые CAD-системы появились ещё в 1960-х (Sketchpad), коммерческие — в 1970-х, а к концу 1980-х пришло привычное параметрическое 3D-моделирование с размерами и историей операций.
Мы же пришли к редактируемой модели через текстовый разговор и скрипт.
Правда, «ИИ построил модель» не значит «её можно печатать». Несколько раз всё выглядело убедительно на экране, но в слайсере обнаруживались дыры, а у напечатанного пробника — слишком тонкие места. Модель буквально рассыпалась у меня в руках.
Но когда всё получилось — чувство какое-то дикое. Научился ли я CAD-у? Нет. Сделал ли я модель сложной формы? Да. Работает ли она — тоже да!
Так что обучение никто не отменял, но страх чистого листа уже преодолён.
Короче, это было круто.
#cad #model #3d
Купили в комиссионке *Cut the Rope: Connect Four*. Дочь любит мультики про Ам Няма, так что игру, конечно, взяли.
Коробка практически полная. Детали даже не сняты с литников, все наклейки не наклеены и монетки на месте. Не хватало только подставки. То есть, буквально, самого главного.
Я решил сделать её на 3D-принтере. Но у меня опыта проектирования нет прям вообще — последний раз я что-то чертил в 2004 в университете, а вылетел из него я до того, как начался AutoCAD.
Таким образом, оставался только один вариант сделать это быстро: вайбкодить предмет.
Я фотографировал детали, измерял их штангенциркулем и объяснял Codex-у, что нужно построить. Потом открывал модель во Fusion, смотрел, что выдаёт слайсер, печатал пробник и возвращался с замечаниями: тут полка нулевой толщины, тут
Почему так вообще можно? Потому что CAD-модель — это геометрия, а геометрию можно задать кодом. Ассистент писал Python-скрипт, менял в нём размеры и форму, а результат загружал во Fusion MCP. Слайсер затем показывал, как эту форму принтер разложит на слои. Получился почти привычный цикл разработки: описал задачу, собрал, нашёл баг, исправил. Только каждый «запуск» может занять час и потратить пластик.
Естественно, компьютерное проектирование — вовсе не новая идея. Первые CAD-системы появились ещё в 1960-х (Sketchpad), коммерческие — в 1970-х, а к концу 1980-х пришло привычное параметрическое 3D-моделирование с размерами и историей операций.
Мы же пришли к редактируемой модели через текстовый разговор и скрипт.
Правда, «ИИ построил модель» не значит «её можно печатать». Несколько раз всё выглядело убедительно на экране, но в слайсере обнаруживались дыры, а у напечатанного пробника — слишком тонкие места. Модель буквально рассыпалась у меня в руках.
Но когда всё получилось — чувство какое-то дикое. Научился ли я CAD-у? Нет. Сделал ли я модель сложной формы? Да. Работает ли она — тоже да!
Так что обучение никто не отменял, но страх чистого листа уже преодолён.
Короче, это было круто.
#cad #model #3d
1🔥12❤5👍4
Участвуй во всероссийском ИТ-чемпионате МТС True Tech Champ 2026 c призовой фондом 10 250 000 рублей.
Если тебе нравятся алгоритмы, структуры данных и задачи на чистую логику — участвуй в алгоритмическом треке с индивидуальным зачетом.
Решай задачи разного уровня сложности: от базовых до тех, что проверяют скорость мышления и умение оптимизировать решения за ограниченное время.
В финале лучшие 120 участников алгоритмического трека сразятся в лайв-кодинге за шесть призовых мест и 2 750 000 рублей. Всех финалистов ждут:
— Лимитированный мерч;
— Сертификаты об участии;
— Масштабное мероприятие с выступлениями хэдлайнеров и фестивальными активностями.
Успей зарегистрироваться и пройти отборочный этап до 27 сентября.
Erid: 2VSb5xn8e7k
Если тебе нравятся алгоритмы, структуры данных и задачи на чистую логику — участвуй в алгоритмическом треке с индивидуальным зачетом.
Решай задачи разного уровня сложности: от базовых до тех, что проверяют скорость мышления и умение оптимизировать решения за ограниченное время.
В финале лучшие 120 участников алгоритмического трека сразятся в лайв-кодинге за шесть призовых мест и 2 750 000 рублей. Всех финалистов ждут:
— Лимитированный мерч;
— Сертификаты об участии;
— Масштабное мероприятие с выступлениями хэдлайнеров и фестивальными активностями.
Успей зарегистрироваться и пройти отборочный этап до 27 сентября.
Erid: 2VSb5xn8e7k
Проект от подписчика!
Напоминаю, что я выкачу любую статью или проект от вас, не стесняйтесь писать.
Презентация? Выступили на митапе? Хотите поделиться интересной статьёй — добро пожаловать!
Привет, я Ксюша. Много лет фронтендер, в прошлом дизайнер. Люблю упрощать себе жизнь, создавая удобные и уютные приложения под свои потребности.
Увидела, что автор канала выкладывает приложения подписчиков, и решила поделиться своим последним творением. Оно уже работает, им можно пользоваться.
Сначала приложение задумывалось для ребёнка: домашние дела как маленькая зарплата. Больше не нужно по сто раз напоминать про посуду, а спорить «я же всё сделал!» бессмысленно, всё видно в истории. Потом я его расширила, и теперь им могут пользоваться заказчик с фрилансером, друзья, муж с женой - назначать друг другу дела ) Какой бы вариант вы ни выбрали при входе, приложение остаётся таким же простым и милым.
Для семьи настройка занимает три шага: добавить ребёнка, завести список ежедневных дел, назначить цену дня. У нас это 100 тасккоинов в день (сын меняет их на робуксы для Роблокса или на рубли). Но валюта может быть любой, как договоритесь: хоть доллары, хоть поцелуи )
Дальше ребёнок открывает свою версию приложения и вычёркивает: помыть посуду, Duolingo, прочитать 40 страниц. Всё сделано - плюс сто. Что-то забыто - минус пятьдесят.
В любой день месяца можно нажать кнопку «Чек». Чек настоящий, лентой: дни, суммы, штрафы отдельной строкой, итого к выплате и штрихкод для реалистичности. Чек можно предъявить родителям, заказчику или жене.
В графе «Работник» стоит не имя, а Пингвин. Или Котик. Или Лисёнок. Имён приложение не спрашивает вообще, вместо имени выбирается мордашка. Это не только ради красоты: так не возникает вопросов к хранению персональных данных. Приложение не хранит ни имён, ни почты, ни телефона, войти можно анонимно.
Бесплатно, без рекламы, работает на телефоне и на компьютере. Я сама пользуюсь несколько месяцев - полёт отличный. Может и вам пригодится.
TaskCoin — https://taskcoin.app/ru
Стек: React 19, Express 5, Prisma + PostgreSQL (Neon), хостинг на Vercel, ставится на телефон как PWA. Cron нет: зарплата и штрафы считаются в момент запроса, а день закрывается по часовому поясу ребёнка.
Напоминаю, что я выкачу любую статью или проект от вас, не стесняйтесь писать.
Презентация? Выступили на митапе? Хотите поделиться интересной статьёй — добро пожаловать!
Привет, я Ксюша. Много лет фронтендер, в прошлом дизайнер. Люблю упрощать себе жизнь, создавая удобные и уютные приложения под свои потребности.
Увидела, что автор канала выкладывает приложения подписчиков, и решила поделиться своим последним творением. Оно уже работает, им можно пользоваться.
Сначала приложение задумывалось для ребёнка: домашние дела как маленькая зарплата. Больше не нужно по сто раз напоминать про посуду, а спорить «я же всё сделал!» бессмысленно, всё видно в истории. Потом я его расширила, и теперь им могут пользоваться заказчик с фрилансером, друзья, муж с женой - назначать друг другу дела ) Какой бы вариант вы ни выбрали при входе, приложение остаётся таким же простым и милым.
Для семьи настройка занимает три шага: добавить ребёнка, завести список ежедневных дел, назначить цену дня. У нас это 100 тасккоинов в день (сын меняет их на робуксы для Роблокса или на рубли). Но валюта может быть любой, как договоритесь: хоть доллары, хоть поцелуи )
Дальше ребёнок открывает свою версию приложения и вычёркивает: помыть посуду, Duolingo, прочитать 40 страниц. Всё сделано - плюс сто. Что-то забыто - минус пятьдесят.
В любой день месяца можно нажать кнопку «Чек». Чек настоящий, лентой: дни, суммы, штрафы отдельной строкой, итого к выплате и штрихкод для реалистичности. Чек можно предъявить родителям, заказчику или жене.
В графе «Работник» стоит не имя, а Пингвин. Или Котик. Или Лисёнок. Имён приложение не спрашивает вообще, вместо имени выбирается мордашка. Это не только ради красоты: так не возникает вопросов к хранению персональных данных. Приложение не хранит ни имён, ни почты, ни телефона, войти можно анонимно.
Бесплатно, без рекламы, работает на телефоне и на компьютере. Я сама пользуюсь несколько месяцев - полёт отличный. Может и вам пригодится.
TaskCoin — https://taskcoin.app/ru
Стек: React 19, Express 5, Prisma + PostgreSQL (Neon), хостинг на Vercel, ставится на телефон как PWA. Cron нет: зарплата и штрафы считаются в момент запроса, а день закрывается по часовому поясу ребёнка.
❤27🔥14👎2👏1
#инструмент дня
GitHub вытащил stacked pull requests в открытое тестирование.
Сам подход стеков многим уже знаком: большую фичу режут на цепочку зависимых PR вместо одного огромного diff.
Например:
Так делали руками много лет. Один PR строится поверх другого, ревьюить их проще, а работу над следующим куском можно продолжать до merge предыдущего.
Проблема всегда была в обслуживании этой цепочки. Поправил что-то внизу — перебазируй всё сверху, делай force push, проверяй ветки и следи, чтобы GitHub не начал показывать лишние изменения.
Stacks автоматизирует именно это: GitHub понимает всю цепочку, показывает её целиком и умеет каскадно обновлять верхние PR после изменений и merge нижних. Есть и
Меньше диффы, проще ревью, меньше ожидания между зависимыми кусками. С агентами это особенно полезно — сгенерировать огромный PR теперь легко, а читать его всё равно человеку.
Правда, пока не без проблем. При включённом
В общем, делаем всё то же самое, только теперь со сравнительно нормальным UI.
#github #stack
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
1❤8🔥4👍1
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
Браузер умеет рисовать текст уже лет тридцать. Но стоит вам открыть 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
❤5