Новости
🔡 вышла версия новая версия Astro 5.1:
🔵 завезли экспериментальную поддержку хранения на севере данных сессии пользователя (на клиенте не хранятся никакие данные, кроме session id в куки), есть интеграции хранилища сессий с Redis и другими БД
🔵 появилось кеширование не только локальных картинок, но и удалённых
🔵 добавили хэлпер
getActionPath для того, чтобы узнать урл серверного action-а на клиентеПроекты
🔡 ghostty — быстрый и заточенный под «нативность» терминал для macOS и Linux
Статьи и демки
JS
🔡 напоминание, что React Server Components могут работать и без рантаймового сервера, в этом случае «сервер» в билд-тайме рендерит компоненты и сериализует их в текст, а уже этот текст может быть доставлен в SPA «лениво» по необходимости в виде статического файла с обычного файлового хостинга, в таком случае разгружается общий клиентский JS-бандл, то есть теперь SPA уже не всегда означает чистый client-side-render
🔡 если вы занялись
performance.now() более точен, чем console.time()/console.timeEnd(), но при этом выполнение кода специально может немного задерживаться для защиты от фингерпринтинга🔡 писать на TS, в целом, приятно (не всегда), но вот преобразовывать TS в JS вручную бывает заморочно почти всегда (
tsc медленный, нужны режимы билда/вотча…), но хорошо, что уже много тулов поддерживает TS из коробки, в том числе в скором времени и Node 23, так что все в дальнейшем будут ориентироваться на подход Node — просто вырезать типы (а пока будущее не докатилось до чётной версии Node, есть tsx — беззаморочный запускальщик ts-файлов в Node)🔡 методы
forEach и map массивов — всегда синхронные, то есть если вы обрабатываете ими большие объёмы данных, то эта обработка создаёт длинные таски, которые блокируют выполнение других задач в потоке, что в свою очередь может привести к зависаниям вкладки, лагающим анимациям; решается проблема переходом на цикл for .. of и батчингом: в процессе цикла нужно проверить, пора ли делать «паузу» и если да, то запускать await new Promise(requestAnimationFrame) для запуска отложенных перерисовок и scheduler.yield() для выполнения параллельных задачCSS
🔡 фоллбек-шрифт можно не просто перечислить в
font-family, но объявить в @font-face, а внутри подключить гарантированный локальный шрифт через local("Arial"), и затем потвикать его настройки с помощью size-adjust, ascent-override… для большего визуального соответствия основному шрифту🔡 несколько полезных фактов о кейфреймах:
🔵 одинаковые значения свойств можно не дублировать в нескольких правилах, а объединять в одно правило через запятую
0%, 50% {}🔵 порядок следования правил в кейфрейме может быть произвольным
{ from {} to {} from, 50% {} }🔵 правила с одинаковыми процентами каскадируются, то есть последнее перекрывает предыдущие; внутри отдельного правила в кейфрейме можно подправить
animation-timing-function, задав шагу функцию linear()Платформа
🔡 во вкладке Sources > Overrides можно подредактировать контент в файлах сайта, например, в HTML-файле отредактировать подключение картинок, чтобы протестировать фикс перфоманса без модификации исходного кода
🔡 как в своё время ES впитал новшества CoffeeScript, так и веб-платформа со временем впитывает то, что предоставлялось билд-тулами и фреймворками: резолв пути к файлу есть в нативном
import.meta.resolve() и import.meta.url, динамические импорты позволяют «лениво» запрашивать модули, минификация файлов реализуется на сервере с gzip или brotli, конкатенация файлов становится не нужна благодаря HTTP2/3; поэтому базовые кейсы из задач фреймворков/бандлеров вымываются, на их стороне остаются DX и сложные/узкоспециализированные вещи@web_platform | Поддержать канал 🤝