Interop 2️⃣0️⃣2️⃣5️⃣: функции, на которых разработчики браузеров сосредоточатся в этом году

Interop — это непрерывный процесс, в ходе которого разработчики браузеров совместно работают над улучшением функций, чтобы больше пользователей могли быстрее их использовать.

В этом году основное внимание уделяется Storage Access API, событиям указателя/мыши, отказу от старых событий мутации, событию scrollend, URLPattern и более тесной интеграции JS/WASM.

➡️ Читать

🖼️ Чеклист для tsconfig.json

Перевод гайда Dr. Axel Rauschmayer о настройках TypeScript, определяемых в файле tsconfig.json. Автор затрагивает настройку проектов, в которых все локальные модули являются ESM.

👉 Читать

👩‍💻 Create React App — официально всё, еще в прошлом месяце

Не тащите его в новые проекты. Актуальная документация по началу проекта — на сайте React.

💻Источник

👉 Интенсив «Архитектуры и шаблоны проектирования» для middle и senior-разработчиков

Проверьте свои знания, ответив на 8 вопросов – https://proglib.io/w/54258128

🧐 Кому подойдет?
Разработчикам, которые знают любой объектно-ориентированный язык программирования и хотят углубиться в архитектурные паттерны.

🎮 Как проходит обучение?
В течение всего интенсива вы будете создавать игру «Звездные войны» и применять ключевые архитектурные паттерны. В процессе изучите:
– Как строить гибкую архитектуру, которая не замедляет разработку
– Как применять IoC-контейнеры и писать модульные тесты
– Как использовать SOLID за пределами ООП
– Как внедрять CI/CD и снижать технический долг

👉 Подробная программа обучения

А по промокоду MIDDLE до 28 февраля вы получите дополнительную скидку на обучение

🖼️ Выпущена версия Deno 2.2 с улучшениями качества жизни

Команда Deno сделала перерыв в борьбе с Oracle, чтобы выпустить новую многофункциональную версию своего рантайма JavaScript.

Мы получили встроенную интеграцию с OpenTelemetry, обновления линтера, новый интерактивный способ обновления зависимостей, поддержку node:sqlite, TypeScript 5.7, V8 13.4 и многое другое.

👉 Читать или смотреть анонс

#новости

🔥 Как использовать attr() в CSS для столбцов, цветов и размера шрифта

Автор рассказывает об обновлённой фиче attr(), которая теперь поддерживает указание типов данных для значений атрибутов, что позволяет использовать её не только для свойств содержимого.

Теперь вы можете извлекать значения из HTML-атрибутов, которые на самом деле имеют типы, поэтому, если вы укажете для элемента data-font-size="2,2rem", вы сможете использовать это значение.

👉 Читать гайд

🔎 fuite — CLI-инструмент для поиска утечек в веб-приложениях

Простой CLI для автоматизации тестирования утечек памяти, в первую очередь актуально для SPA. Проверяет объекты, event listeners, узлы DOM и коллекции.

💻 GitHub

🖼️ Способы разделения длительных задач в JavaScript

Легко «уничтожить» пользовательский опыт, позволив длительной дорогой задаче захватить основной поток. Неважно, насколько сложным является приложение, цикл событий может выполнять только одну задачу за раз. Пока выполняется одна задача, другие ждут своей очереди. Как правило, задача выполняется настолько быстро, что пользователь ничего не замечает. Но так бывает не всегда.

Браузер может не успеть перерисовать экран. Обратную связь мы получим только после завершения цикла. Если вы сталкивались с подобной ситуацией, то знайте, что решением является разделение большой задачи на несколько тиков цикла событий. Это позволяет браузеру использовать основной поток для других важных вещей, например, обработки нажатия кнопки и перерисовки.

➡️ Существует удивительно много способов достичь этого. Автор разбирает некоторые из них:

1️⃣ setTimeout() + рекурсия
2️⃣ async/await и setTimeout()
3️⃣ scheduler.postTask()
4️⃣ scheduler.yield()
5️⃣ requestAnimationFrame()
6️⃣ MessageChannel
7️⃣ Worker

🤩 Миллион маленьких секретов

В течение нескольких месяцев Josh Comeau работал над третьим онлайн-курсом Whimsical Animations. Он посвящен созданию анимации и интерактивных элементов страниц.

Под катом он делится множественными интересными наработками, включая уникальные интерактивные элементы, анимации, частицы, SVG-анимации и даже звуковые эффекты.

👉 Читать

💡Использование isolation: isolate помогает избежать неожиданных проблем со слоями (z-index) и позволяет группировать элементы в свой стековый контекст без вмешательства других элементов страницы.

#css #tip by Shripal Soni