Аккуратная подборка готовых CSS-анимаций, разложенных по категориям. Просто копируешь код в один клик и используешь в своём веб-проекте

Ссылка: AnimatiSS

➡️ @FrontendPortal | #resourse

Новая эра для React: React больше не принадлежит Meta

Теперь он переходит под управление Linux Foundation, где будет развиваться в рамках новой организации React Foundation.

Meta заключает 5-летнее партнёрство и выделяет более $3 млн, чтобы поддержать следующий этап развития и инноваций

Это также касается React Native и JSX

➡️ @FrontendPortal

Улучшите производительность рендера с помощью content-visibility: auto в CSS

Это может быть полезно при рендеринге:

– Длинных списков
– Длинных веб-страниц
– Дашбордов с множеством панелей

Это работает во всех современных браузерах, начиная с сентября 2024 года. Но в Safari v18 нерендеренное содержимое не попадало в поиск. Эта проблема уже исправлена в актуальной версии Safari v26 (сентябрь 2025).

➡️ @FrontendPortal | #tip by Shripal Soni

давай, бро, ещё один хук, бро. ещё один хук и мы всё пофиксим, бро

➡️ @FrontendPortal

Знал ли ты про суффиксы -block и -inline в CSS?

Они относятся к «логическим» свойствам, которые противопоставляются привычным «физическим» свойствам и лучше подходят для интерфейсов на разных языках — ведь не все пишутся слева направо и сверху вниз

Например, арабский читается справа налево. И если ты делаешь UI с мультиязычной поддержкой, тебе пришлось бы вручную менять все свойства с *-left на *-right 🤕

Логические свойства решают эту проблему, автоматически подстраиваясь под направление письма текущего языка.

- block-start — аналог top
- block-end — аналог bottom
- inline-start — аналог left
- inline-end — аналог right

Их можно использовать с padding, margin и border. Например: margin-block-end, padding-inline-start.

Есть и приятный бонус: логические свойства дают удобные шорткаты для выбора сразу двух сторон: левой+правой или верхней+нижней.

Нужно применить паддинги и к верху, и к низу? Используй padding-block
Нужно применить паддинги и к левой, и к правой стороне? Используй padding-inline

Крутая фича ✌️

➡️ @FrontendPortal | #CSS

Парсите HTML-ввод с новым методом parseHTMLUnsafe()

Теперь этот статический метод входит в Baseline. Он создаёт новый экземпляр Document из HTML-строки и при необходимости позволяет выполнить дополнительную санитизацию

Подробнее тут

➡️ @FrontendPortal

Кто до сих пор использует useEffect для фетчинга данных?

➡️ @FrontendPortal

Chrome DevTools недавно получил крутое обновление для CSS

Теперь при наведении на любое CSS-свойство в DevTools отображается не только описание, но и Baseline-информация о том, насколько хорошо это свойство поддерживается в браузерах.

Вы увидите лейблы вроде “Widely available”, “Limited availability” или “Newly available”.

Мелочь, а приятно ✌️

➡️ @FrontendPortal

Лайк, если было

➡️ @FrontendPortal