Front-end Digest № 44: що нового в Tailwind 4, довгий Alt та стилі в React

Усі статті, обговорення, новини про Front-end — в одному місці. Підписуйтеся на телеграм-канал!

Привіт, колеги. Мене звати Олександр і я займаюся фронтендом в компанії Zfort Group. Маю для вас свіжий дайджест із цікавими матеріалами зі світу фронтенда за останній тиждень.

Веброзробка

• Як створити адаптивний HTML-шаблон
• Посібник з впровадження вебкомпонентів: огляд, приклади та альтернативи
• Новий проєкт Wasm переносить вебкомпоненти до мов бекенду
• Деякі анімації виділення тексту під час прокрутки

• Продуктивність
  • Демістифікація нещодавнього переходу Google на INP
  • Як відстежувати та оптимізувати Google Core Web Vitals
  

• Доступність
  • Демістифікація зчитувачів з екрана: доступні форми та найкращі практики
  • Що означає для вас прийняття Мін’юстом США WCAG 2.1 A/AA в Розділі II ADA для веб- та мобільних застосунків
  • Довгий Alt

CSS

• Що нового в Tailwind CSS 4.0
• Основи про каскад і специфічність в CSS
• Що відбувається в Dark Theme/Light Theme
• Речі, які можуть зламати aspect-ratio у CSS
• Layered Toggles: Optional CSS Mixins
• Masonry Layouts в CSS

JavaScript

• Перетворення звичайного тексту в Encoded HTML за допомогою ванільного JavaScript
• Модернізація jQuery: на шляху до здорового інтернету
• Qwik проти Next.js: який фреймворк підійде для вашого наступного вебпроєкту?
• П’ять можливостей JavaScript, які не використовуються повною мірою
• Опановуємо реактивність у JavaScript: вісім потужних патернів
• Layer Cake — графічний фреймворк для Svelte
• Шість найкращих бібліотек JavaScript та NodeJS для вебскрепінгу

• React
  • Як створити динамічний випадний компонент у React — пояснення шаблону складних компонентів React
  • CSS у React Server Components
  • Створюйте швидше з Wedges. Колекція UI-компонентів з відкритим вихідним кодом для React
  • semantic-autocomplete — компонент React, який розширює автодоповнення v5 MUI і виконує пошук семантичної схожості за допомогою невеликої ML-моделі, яка працює на стороні клієнта
  • Як стилізувати React-застосунок
  • Signals щойно з’явилися в React?
  • Створіть React-застосунок за допомогою Wing
  

• Angular
  • Як використання функції inject() в Angular заощадило мені 1000 рядків коду
  • Покращення типізації динамічного лоадера компонентів в Angular з використанням Inputs