🖇️ Полностью в вебе
Новости
🔡 зарелизился Firefox 138:
🔵 в сам браузер добавили профили пользователей, а также раскатили на всех группы табов
🔵 добавили поддержку Import Attributes (теперь поддерживается везде), а также Error.isError
🔵 как и обещали, поправили дефолтную стилизацию вложенных элементов
<h1>🔡 а так же радостная новость: в FF 139 (уже есть в ночной сборке 140) появится поддержка View Transition API (теперь будет поддерживаться везде!)
🔡 в Chrome передумали блокировать 3rd-party куки по умолчанию (не смогли со всеми договориться), всё останется как есть сейчас (можно вручную отказаться в настройках браузера), а также пообещали в Incognito-режиме добавить маскировку IP-адреса устройства
🔡 и ещё про Chrome: в грядущей принудительной продаже браузера покупателем может стать OpenAI (если так случится, то скорость изменения индустрии ещё больше ускорится)
🔡 вышел GSAP 3.13: на удивление, фаундеры и ментейнеры до их покупки Webflow, никуда не ушли, а продолжают пилить проект; с этим релизом в GSAP сделали все ранее платные плагины бесплатными, а заодно и дропнули премиальный клуб GSAP
Проекты
🔡 unbuilt.app — реверс-сервис, находящий по артефактам в коде сайтов, какие технологии использовались для их создания
🔡 component-template — если уж теперь LLM расширяют наши возможности, почему бы не попробовать начать писать веб-компоненты? Вот как раз и стартовый шаблон подходящий нашелся.
Статьи, мнения, туториалы
JS/TS
🔡 из всех способов вывести что-то как строку, менее подверженный ошибкам —
{}.toString.call(v), но в большинстве случаев подойдёт String(v), но он, в свою очередь, не выведет содержимое объекта; для этого подходит JSON.stringify(), но тоже со своими ограничениями🔡 возьмём дерево компонентов в React: обход и рендер происходит начиная с родителей «вглубь» детей, а применение эффектов (
useEffect) — на «обратном» пути обхода, «вверх» от детей к родителям🔡 если вам для управления зависимостями в
package.json недостаточно dependencies и devDependencies и хочется добавить категории, можно использовать PNPM Catalogs для группировки: хоть фича изначально для монореп, но она помогает разделить пакеты и внутри одного репо по категориям (test, frontend, types, lint…)🔡 рубрика «что хотел сказать автор» от Дэна Абрамова про RSC продолжается: директива
'use client' делает компонент доступным серверу через <script>, чтобы он мог его предвыполнить, а 'use server' экспортирует серверные функции на клиент, чтобы их можно было вызвать асинхронно в RPC-стиле 🔡 все эти ваши сайты — это для людей, а для машин достаточно склеенной текстовой портянки (пример от Bun)
CSS
🔡 как подтюнить анимации, чтобы они из просто хороших стали великолепными:
🔵 не забыть настроить
transform-origin с той стороны, откуда анимация визуально начинается🔵 подобрать более натуральный изинг: хотя бы
ease-out, а лучше кастомную «пружинную» функцию🔡 единица измерения lh хороший (и доступный с 2023 года везде) способ не мучиться с
em для задания межстрочных отступов:
p { margin-block: 1lh; }
🔡 скруглённые углы в CSS есть уже давно, но их по-прежнему может не хватать для непрямоугольных форм, тогда в дело вступает давно забытое искусство подставления скруглённых уголочков на фон блока (только вместо png-картинок выступают радиальные градиенты)
HTML
🔡 для реализации кликабельной картинки-карты с интерактивными областями может подойти древняя пара тегов
<map> и <area>, но могут быть проблемы с респонсивом, поэтому то же можно реализовать в чистом SVG (ведь внутрь групп в качестве обёртки для форм в SVG можно включать ссылки <a>)Платформа
🔡 ещё один тейк, на этот раз от Addy Osmani, про деградацию скиллов при неразумном использовании AI-тулов: самое плохое — отваливается критическое мышление, не менее неприятное — общения между разработчиками становится меньше
🔡 для гита можно настроить глобальный игнор-конфиг для всей системы, на маке/линуксе лежит в
~/.config/git/ignore@web_platform | Поддержать платформу 💙