Front-end Digest № 39: 35 років вебу, INP в Core Web Vita і порівняння JavaScript-фреймворків

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

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

Веброзробка

• До 35-річчя інтернету: Відкритий лист
• Скромно розпочавшись 35 років тому, сьогодні інтернет займає центральне місце в повсякденному житті мільярдів людей.
• Фронтенд майбутнього: огляд тенденцій та перспектив

• Продуктивність
  • Interaction to Next Paint офіційно визнана Core Web Vital
  • Привіт, INP! Ось все, що вам потрібно знати про найновіший Core Web Vital
  • Посібник для експертів з вебпродуктивності з освоєння Interaction to Next Paint (INP)
  • Швидкість HTTP
  

• Доступність
  • Думки про вбудовування альтернативних текстових метаданих у зображення
  • Розрізнення атрибутів ARIA та нативних атрибутів HTML
  

• Ефекти
  • Front-end рішення: індикатор прогресу
  • Анімація розкриття елементів сітки при наведенні

CSS

• CSS для друку на папері
• Що таке безпечне вирівнювання в CSS?
• Вам треба border-color: transparent, а не border: none
• Стилі кнопок CSS, про які ви могли не знати
• CVA — маленька але дуже корисна утиліта для роботи з СSS класами компонентів
• Сила CSS-змінних: Гнучке рішення для вертикальних проміжків
• Tailwind CSS v4.0 Alpha: Революція розпочата

JavaScript

• Порівняння JavaScript-фреймворків, частина перша: шаблони
• 5 нових функцій JavaScript у 2024 році
• Обробка форм на стороні клієнта за допомогою JavaScript — пояснення на прикладі коду
• Rolldown — швидкий бандлер на Rust для JavaScript з Rollup-сумісним API

• React
  • Розділення UI та Logic в React: підхід чистого коду з Headless-компонентами
  • Конвенція vs налаштування: адаптація API в React до різних середовищ
  • Як створювати інтерактивні анімації за допомогою React Spring
  • Основні інструменти для реалізації панелей в React
  • Кращі практики написання тестів за допомогою React Testing Library
  • React Compiler & React 19 — скоро забудемо про мемоїзацію?
  • Як створити Task App зі штучним інтелектом за допомогою React та Appwrite
  

• Vue
  • Реактивність Vue — це пастка
  • Розшифровка 14 помилок Vue.js: Посібник з налагодження Vue.js
  

• Angular
  • Управління станом в Angular, які я бачив
  • Розуміння control flow синтаксису в Angular 17
  • Підготовка нашого коду для Zoneless Angular

Браузери

• О, дивіться, боротьба з техногігантами працює. Brave, Firefox, Vivaldi виходять на iOS
• Анонсуємо Speedometer 3.0: Спільний браузерний бенчмарк для оцінки швидкодії вебдодатків