Front-end Digest № 52: Як хакнути Lighthouse, :if() в CSS та покращення модулів в JavaScript

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

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

Веброзробка

• Новини з WWDC24: WebKit у бета-версії Safari 18
• Опитування State of Frontend 2024
• Чому через шість років я закинув GraphQL
• Швидкий і простий посібник з Markdown
• Потоковий HTML — асинхронні оновлення DOM без JavaScript
• Тестування нового HTML-елементу
• 11 дивовижних способів використання Wasm розробниками
• Мінімальна SVG Favicon

• Інструменти
  • NestJS в Deno?
  • Як запустити DIY node-сервер у 2024 році
  • Чи роблять IDE вас тупими?
  

• Продуктивність
  • Швидкі вебсайти зі спекулятивними правилами (Speculation Rules)
  • Як хакнути свої бали в Google Lighthouse у 2024 році
  

• Доступність
  • World Wide Accessibility — переваги стандартизації
  • Як використовувати одиниці rem в CSS для доступного дизайну
  • Методи приховування контенту та їхні наслідки для доступності
  

• Ефекти
  • Ефект розмиття об’єктива за допомогою SDF та WebGL
  • Морфінг довільних шляхів у SVG

CSS

• Для чого потрібні CSS Container Style Queries?
• Останні новини про CSS та UI: Підсумки I/O 2024
• Одну з битв з босами в CSS майже виграно! Анімація для Auto
• :if() для Custom Properties в CSS
• Ще одна демонстрація позиціювання якорів: кілька анкерів

JavaScript

• TC39 просуває ключові пропозиції: Deferred Import Evaluation, Error.isError(), RegExp Escaping, Promise.try
• Як складати JavaScript-функції, що приймають декілька параметрів (епічний посібник)
• Як одна уразливість може зруйнувати екосистему JavaScript
• Як JavaScript нарешті покращує роботу з модулями
• Node.js з нами надовго

• TypeScript
  • Анонс TypeScript 5.5 RC
  • Я писав TypeScript, не розуміючи його
  • TypeScript додає підтримку методів Set з ECMAScript
  

• React
  • Сьогодні я спробував React Compiler, і вгадайте що... 😉.
  • Найкращі інструменти для реалізації ecommerce search в React
  • Класні розширення VSCode, які я відкрив для себе
  • Next.js security checklist
  • Створення реюзабельної кнопки SubmitButton з використанням UseFormStatus
  • Need for Speed: швидкий спосіб покращити час тестування React
  

• Vue
  • Як освоїти Vue Router у Vue.js 3 за допомогою Composition API
  

• Angular
  • Як використовувати Rust (Wasm) в Angular
  • Створіть мікрофронтенд з Module Federation — вертикальний застосунок на Angular