А теперь серьёзно.

Какого цвета будет текст с таким набором стилей?

Если ответили неправильно или не уверены, почему ответ такой — загляните в свежую статью о специфичности селекторов.

Мы там подробненько расписали, как её считать, как не ошибаться в стилях, и даже несколько заданий для самопроверки приложили.

👉 https://tml.io/selectors

Опубликовали огромную шпаргалку по цветовым форматам в CSS

Там всё от color: red до hex-кодов, RGB, HSL, LCH и даже немного OKLCH.

Ну и советы, что использовать в реальной работе в 2023. Чтение небыстрое, зато точно разберётесь под кофеёк.

👉 https://tml.io/colors

Ну и раз вы здесь, то главный опрос вторника:

Тут такое дело

топ 10 май экскюэл фанкшнс зет эверебоди шуд ноу ин 2023*

тотали оусом энд эмэйзинх ридинг фор нью мак про м2 ультра

👉 https://tml.io/sql-functions

* и не говорите, что я с вами не консультировался насчёт этого анонса

Посмотрите на эту картинку и на меня. Снова на эту картинку и снова на меня

Фронтенд-новости #40 уже в блоге.

Без лишних слов:
👉 https://tml.io/frontend-40

Говорят, что фронтендеры должны хорошо работать в команде. Давайте тренироваться:

Фронтенд-новости 41. Дайджест новостей и полезных статей о фронтенде.

💫 Что нового

Safari 16.3. Ну Сафари и Сафари.

Astro 2.0 — в новой версии добавили гибридный рендеринг позволяющий смешивать входные данные SSR и SSG.

Nut.js 3.0: используйте Node.js для автоматизации рабочего стола. Управляйте средой своего рабочего стола (Windows, macOS или Linux) из кода с управлением клавиатурой и указателем.

Первая бета-версия Eleventy v2.0. Eleventy — это популярный генератор статических сайтов на базе Node.js.

TypeScript 5.0 Beta. Совсем взросленький стал.

🖌️ HTML и CSS

Ещё больше про использование :has(). Рассмотрите как и с какими селекторами можно комбинировать :has()

Список желаний на 2023 год для CSS от Дэйва Руперта.

И от Пола Амстронга, который составил список на 2023 для фронтенда.

Два способа разделить длинное слово в HTML.

Статус SVG-движка в Webkit.

Доступные гамбургер-меню без JavaScript.

🏗️ JavaScript

Глубокое клонирование объектов в JavaScript, современный способ. Если вы полагались на что-то вроде Lodash для глубокого клонирования, возможно, вам это больше не нужно.

scrollend — новое JavaScript-событие и новый способ определения завершения операции прокрутки в браузере.

Лекарство от useState ада — useReducer.

Сделайте жесты в React Native более естественными.

Начните работать со SvelteKIT — маршрутизация, данные, пропсы и другое.

🦦 Всякое ещё

Как перейти на Manifest V3 для расширений Chrome.

Оптимизация времени до первого байта. Это базовая и основная метрика производительности.

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

Мы тут провели одно исследование, но сначала проголосуйте:

Так вот, исследование.

Наш прекрасный Коля Шабалин собрал в кучу 55 тысяч сайтов и такой ррррраз их и все распарсил. Оказалось, что <div> везде и всюду, а вот самый непопулярный тег, например, <wbr>. Помните, был такой?

И вот первая часть про 15 популярных тегов.

👉 https://tml.io/tags

Кстати, Коля Шабалин очень любит спецификацию HTML и даже где-то говорил, что читает её каждый день.

В связи с этим аж два самых важных вопроса выходных: