Front-end Digest № 84: реліз Tailwind CSS v4.0, WYSIWYG для React та шрифтовий жаргон

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

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

Веброзробка

• Фреймворки фронтенду, огляд 2024 року
• Підсумки ESLint за 2024 рік
• GitHub показує, як адміністрація Трампа чистить урядові вебсторінки в режимі реального часу
• Оновлення Bun 1.2: що нового
• GenAI допомагає фронтенд-розробникам створювати компоненти
• Розв’язання проблем мікрофронтенду за допомогою Module Federation

• Продуктивність
  • Створення інтелектуального агента для контролю продуктивності сайтів за допомогою Agent.ai
  • Спрощення лінивого завантаження за допомогою Intersection Observer’s ScrollMargin
  • Як провести аудит Core Web Vitals: детальний посібник
  • Уникайте Large Layout Shifts: три практичні приклади
  

💡 Перша конференція DOU Front-end Day 2025

• Ефекти
  • Використання WebGL шейдерів для створення динамічних переходів між зображеннями
  • Подорож до створення 3D-портфоліо
  • VFX-JS: доступний спосіб створення WebGL-ефектів
  • Демки на Codepen, що зібрали найбільше лайків у 2024 році

CSS

• Реліз Tailwind CSS v4.0
• Шрифтовий жаргон
• 6 CSS-сніппів, які повинен знати кожен front-end розробник у 2025 році
• Нові можливості функції attr()
• Непрозорість HEX-коду в CSS
• Настав час відмовитися від BlinkMacSystemFont і -apple-system
• Позиціювання тексту навколо елементів з CSS Offset
• Приховані можливості кастомних стилів для counters
• Реалізація компонента рейтингу з зірок за допомогою одного HTML-елемента
• Створення нахиленого слайдера
• Як зменшити кількість невикористаного CSS і пришвидшити роботу сайту

JavaScript

• Google починає вимагати JavaScript для пошуку в Google
• Mentoss: найкращий інструмент для імітації JavaScript fetch-запитів
• JavaScript Temporal наближається
• Розробка кастомного багаторівневого селекту на чистому JavaScript
• Вичерпний посібник з генераторів JavaScript
• Опанування деструктуризації об’єктів у TypeScript
• Duck-Typing у TypeScript та правило «Always Defaults»

• React
  • Проєктуємо гібридний онлайн WYSIWYG-редактор для React
  • Що потрібно знати про View Transitions в React
  • Опановуємо CRUD в Next.js. Поради для інтеграції та оптимізації
  • Проєктуємо гібридний онлайн WYSIWYG-редактор для React
  

• Vue
  • Як я почав писати юніт-тести для Vue Components
  • Управління станом та гідратація Nuxt з використанням useState

Фронтенд-меми