#фишка дняАккордионы и прочие схлопывающиеся сценарии. Скажи, как ты их анимируешь, и я скажу, кто ты.Если ты их до сих пор анимируешь через max-height, скорее всего, ты — LLM-ка, которая застряла где-то там.Ну буквально, только что сессию демонстрационную проводил.Согласен, height ещё плохо анимируется в auto, хоть и появился interpolate-size. Но ведь гриды никто у нас не отбирал!Да-да, давненько я не напоминал, что гриды прекрасно анимируются и что уже давно не нужны извращения. Но сегодня я пришёл с маленьким дополнением.Все же в курсе, что классика — одна строка грида и 0fr ↔ 1fr?.accordion-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.28s ease;}.accordion-panel[data-open="true"] { grid-template-rows: 1fr;}.panel-inner { overflow: hidden; min-height: 0;}Внутренний блок клипится — высота анимируется без max-height: 9999px.А вот дополнение: в grid-template-rows можно и пиксели, и minmax(). Например, свёрнуто, но кусочек текста виден:grid-template-rows: minmax(48px, 0fr); /* закрыто */grid-template-rows: minmax(48px, 1fr); /* открыто */Демонстрация: https://codepen.io/alinaki/pen/QwGryqNПервый аргумент в minmax — минимум, не максимум: 48px снизу, а не «не больше 48». Полное скрытие — по-прежнему 0fr.И да: padding на clip-слой не вешайте — только внутрь контента, иначе и под 0fr торчит, и при открытии прыгает.#css #grid #accordion
#инструмент дняВ прошлом году я уже показывал, как удаление фона с изображений постепенно переезжает прямо в браузер:https://t.me/htmlshit/3797Тогда речь шла про Transformers.js и WebGPU — мол, многие ML-задачи уже спокойно работают локально, без серверов и сервисов.Теперь вот наткнулся на removerized:https://github.com/yossTheDev/removerizedЭто открытый AI image toolkit, который целиком работает в браузере.Под капотом — ONNX Runtime Web, WebGPU и client-side inference. То есть модели запускаются прямо у вас на устройстве, без отправки изображений на сервер.Из того, что есть сейчас:— удаление фона— апскейл изображений— пакетная обработка— офлайн-режим— кэширование моделей— расширенные настройкиА главное, работает. Демо:https://getremoverized.yoss.pro/removerizedДа, кстати. ONNX Runtime Web — это браузерный рантайм для запуска ML-моделей через ONNX.Если очень грубо: штука, которая позволяет запускать нейронки прямо в браузере через WebGPU/WebAssembly, без Python, CUDA и отдельного бэкенда.Сайт:https://onnxruntime.ai/docs/get-started/with-javascript/web.htmlGitHub:https://github.com/microsoft/onnxruntime#ai #opensource #webgpu #ml
#такое дняКогда в следующий раз будете ворчать на коллегу за PR в 200 строк — вспомните это: https://github.com/oven-sh/bun/pull/30412Ментейнеры Bun, конечно, могут сколько угодно рассказывать нам о бессонных ночах в попытке отдебажить утечку памяти в Zig (будучи крупнейшим проектом на этом языке), но без этих ночей ничего бы не вышло.Штош.P. S. кстати, почитайте, что ответили авторы Zig о недавнем «ИИ-форке», который представили Bun. Там прям интересно.#rust #zig
