Front-end Digest № 119: DevTools MCP, арифметика в CSS та витоки пам’яті в React

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

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

Веброзробка

• Аргументи на користь мікрофронтендів і вихід за межі одного фреймворку.
• Міграція до TanStack Start
• Заспокійливі міфи: у полоні ревізіоністських історій про веброзробку Apple, погляд на докази
• JSON відрізняється у різних мовах програмування
• Ваші зображення, найімовірніше, завеликі
• Відтворення анімації Google Gemini з Gmail
• Чого я навчився про справжню вебдоступність, використовуючи зчитувач екрана

• Інструменти
  • Chrome DevTools (MCP) для вашого AI-агента
  • Netscape Navigator 2.0 випущено 30 років тому
  • Як Vite став основою сучасних фреймворків для фронтенду
  • Кращі практики безпеки NPM
  • Плани GitHub щодо підвищення безпеки ланцюга постачання npm

CSS

• CSS-мрія: внутрішні брейкпоінти
• Як обійти обмеження використання CSS-змінних у медіа-запитах
• CSS-фігури з використанням corner-shape
• Стартовий набір CSS від Кріса Койера
• Типізована арифметика в CSS
• Найкраща одиниця CSS може бути комбінацією
• Головний нюанс @starting-style
• Як запобігти обрізанню (та іншим проблемам) у View Transitions: використання вкладених груп View Transition
• Найбільш толерована особливість веброзробки (zoom)
• CSS @function: динамічна логіка без Sass або JavaScript
• Чому :is(::before,::after) не працює?

JavaScript

• Nuxt UI v4
• Пояснення паралелізму в Node.js: один потік, безліч подій
• Паралельна і рекурсивна генерація роутів
• Web Codegen Scorer — інструмент для оцінки якості вебкоду, згенерованого LLM
• Припиніть використовувати .reverse().find(): познайомтеся з findLast()
• Використання проксі-об’єкта для керування станом

• React
  • Вибір правильного режиму React Router v7 для вашого проєкту
  • Можливо, вам потрібен `useSyncExternalStore`
  • Як виправити витоки пам’яті в застосунках React

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