Ремонт, сервис, услуги » Информация » Фронтенд-новости №5. Отказ от React, новые CSS-свойства для адаптивности и JS-контейнеры




Фронтенд-новости №5. Отказ от React, новые CSS-свойства для адаптивности и JS-контейнеры

Автор: addministr от 11-05-2022, 09:00

Категория: Информация



Дайджест новостей из мира фронтенд-разработки за последнюю неделю 2–8 мая.

HTML



Ещё один сайт на HTML. Да, так тоже можно.



Узнайте о главных болях веб-разработчика.

CSS



Если работаете с [/u] попробуйте улучшить взаимодействие с ним.



Используйте max-inline-size для гибкого центрирования контента в адаптивных интерфейсах.



CSS Zen Garden 19 лет.



Знайте, что прогрессивное улучшение дорого, но необходимо вашему пользователю. Рассмотрите примеры прогрессивного улучшения с aspect-ratio, новыми цветовыми функциями, а также focus-visible.



Веб быстро развивается и пора переосмыслить подходы к адаптации интерфейсов. Используйте CSS-свойства, функции и значения: [u]clamp(), min-content, max-content, fit-content, auto-fit, minmax()
.



Научитесь переносить текст на новую строку.



В прошлом выпуске прочитали про inert? Прочитайте.



Пофантазируйте о новых псевдоклассах :removed и :finish для анимаций.



Погрузитесь в :where — ещё один логический способ найти элемент на странице.



Познакомьтесь с тем, как работают алгоритмы компоновки.



Начинайте изучать сабгриды.



Узнайте, почему height: 100vh не самый лучший вариант для адаптации мобильной версии.

jаvascript



За 2 минуты разберитесь оператор или нет?

Узнайте о новом API, которое позволяет получить доступ к сведениям у локально установленных шрифтов пользователя.

Потренируйтесь в создании легковесного компонента на Lit.

Узнайте о jаvascript контейнерах.

Опять эти странные вопросы про jаvascript. Давайте с ними разберёмся.

React

  • Что случится если вы откажетесь от React?

  • Создайте свой блог на Next.js и MDX.

  • Узнайте как работает композиция React-компонентов.

Angular 

  • Пора обновляться до v13.3.3.

  • Вовсю ждём v14 в новой бете v14.0.0-next.16.

Node.js

  • v18.1.0 (Current) уже здесь с улучшенным CLI для тестов и имплементацией WebAssembly Web API.

  • Если используете v14.x.x, то можно обновиться до v14.19.2 (LTS).

  • Кажется Лерна всё. Пытаемся понять, что использовать на замену.

Браузеры

  • Mozilla Firefox 100:

    • Для разработчиков:

      • Субтитры WebVTT для режима картинка-в-картинке.

      • Аппаратное декодирование AV1 в Windows для  (Intel Gen 11+, AMD RDNA 2, кроме Navi 24, GeForce 30).

      • Улучшена производительность глубоко вложенных гридов.

      • Новый индикатор фокуса для ссылок, который заменяет пунктирный.

      • Добавлена поддержка WritableStream API.

      • ReadableStream получил поддержку pipeTo.

    • Для пользователей:

      • Картинка-в-картинке теперь с субтитрами.

      • Мобильная версия с новыми обоями.

      • Упорядоченная версия закладок.

      • Автозаполнение банковской карты (но для некоторых стран).

      • Выбор языка при запуске. Сравнивается с языком установленным в операционной системе.

      • Проверка орфографии на нескольких языках.

      • HDR-видео на Mac. Уже можно проверять на YouTube.

      • Снижение энергопотребления для видео с процессорами Intel.

  • Safari Technology Preview 144

  • Chrome 101

    • Импорт и экспорт записанных сценариев в виде JSON-файла

    • Просмотр каскадных слоёв на панели "Styles".

    • Поддержка цветовой функции hwb().

    • Улучшили отображение приватных свойств класса.

  • Edge обогнал на 0,46% Safari по популярности среди десктопов.

Общее

  • Google иконки с 4 настройками: заливка, вес, градация и размер.

  • "Вариативные" шрифты на коре дерева. Ежегодно фиксируется изменение деформации глифов.

  • Идеальный экспорт SVG дизайнерскими инструментами.

Инструменты

  • ClickToComponent - позволяет переходить в исходный код компонента в VS Code при Option + Click в браузере. Посмотрите наглядный пример в репозитории.



    Форумы на node.js с несколькими хранилищами данных и RESTFul API NodeBB v2.0.0.



    Альтернативный pnpm v5.1.0



    Mocha v10.0.

    Как читать статьи на английском языке

    В дайджесте много статей и видео на английском языке, чтобы это не стало препятствием: в Google Chrome есть функция перевода страницы с любого популярного языка, а видео можно перевести в Яндекс Браузере.

     

    Источник: https://habr.com/ru/company/htmlacademy/blog/664800/





Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

Архив | Связь с админом | Конфиденциальность

RSS канал новостей     Яндекс.Метрика