Front-end Digest № 48: htmx vs. React, ReScript vs. TypeScript та Eleventy vs. Next.js

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

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

Веброзробка

• Коли зникає онлайн-контент: 38% вебсторінок, які існували у 2013 році, через десять років вже не доступні
• Який найпростіший спосіб розгорнути вебсайт, щоб поділитися ним з іншими людьми?
• Використання WebRTC для реалізації потокового P2P-відео
• Попереднє завантаження (Prefetching), коли завантаження на сервері не дає результату
• Multi-page application View Transitions вже тут (відео з Google I/O 2024)

• Інструменти
  • Новий вигляд GTmetrix
  • Статичні сайти масштабуються: Eleveny проти Next.js на 11ty Event
  • П’ять корисних функцій Chrome DevTools, про які більшість розробників не знають
  • Розуміння новітніх можливостей Webkit в Safari 17.4

• Доступність
  • Переосмислення зміни розміру тексту в вебі
  • Робимо веб доступнішим: меню та лоадери

CSS

• Коли вам потрібна custom @property замість CSS-змінної
• Anchor Positioning та Popover API для створення меню сайту без JS
• Створення гри в хрестики-нулики з «випадковістю» за допомогою чистого HTML і CSS. Без JavaScript!
• За межами CSS Media Queries
• Про відповідність та читабельність: генерація кольорів тексту за допомогою CSS
• CSS-анімації на основі часу
• Класична порада щодо Border Radius, плюс незвичний трюк
• Мене більше турбує поведінка табуляції, ніж синтаксис і іменування в CSS masonry

JavaScript

• Як документувати свій JavaScript-пакет
• 29 відео з Vuejs Amsterdam 2024
• htmx проти React: Вибір правильної бібліотеки для вашого проєкту

• TypeScript
  • Пригоди з TypeScript: пірнання в кролячу нору за допомогою Prop Drilling
  • Динамічний профіль Github з Bun та Typescript
  • ReScript vs. TypeScript: Огляд та порівняння
  

• React
  • Огляд найпопулярніших React-бойлерплейтів у 2024 році
  • Meta випустила Open Source React Compiler
  • Шаблони Data Fetching в Single-Page Applications
  • Швидка оптимізація інтерфейсу з використанням useDeferredValue
  • Bulletproof React — проста, масштабована та потужна архітектура для створення готових до продакшена React-застосунків
  • П’ять порад та підказок, які полегшать вам життя з Next.js 14
  • Це не тільки ви, Next.js стає все складнішим у використанні
  • Що нового на React Conf 2024
  

• Angular
  • Angular 18 вийде наступного тижня
  • Angular 18: Революція у веброзробці завдяки передовим функціям
  • Спрощення логіки на стороні клієнта: Стратегічне використання View Models
  • Шаблони локальних змінних за допомогою @let в Angular