Frontend Weekly Digest #387 (4 - 10 November 2024)

Web-development

• Less Common HTML Elements and How to Use Them in Your Code
• Front End Debugging Part 1: Not just Console Log
• Why Optimizing Your Lighthouse Score Is Not Enough For A Fast Website
• Mastering Interaction to Next Paint (INP)
• Vercel Makes Changes to Next.js To Simplify Self-Hosting
• How to Create an Organic Text Distortion Effect with Infinite Scrolling

CSS

• Named Scroll & View Timelines
• Benchmarking the performance of CSS @property
• A Friendly Introduction to Container Queries
• The stretch keyword: a better alternative to width: 100% in CSS?
• The Different (and Modern) Ways to Toggle Content
• New CSS that can actually be used in 2024#
• Popping Comments With CSS Anchor Positioning and View-Driven Animations
• Fluid Everything Else
• BRiCSS — A simple and customizable low-level CSS library generator
• Folded rectangle shapes using CSS mask
• What’s the deal with WebKit Font Smoothing?

JavaScript

• JavaScript’s ??= Operator: Default Values Made Simple
• Introducing your new JavaScript package manager: Deno
• Why Alpine is the new jQuery and Why that is an Awesome Thing
• Top 10 JavaScript SEO Tricks Every Developer Should Know
• The ResizeObserver API: A tutorial with examples
• es-toolkit, a Lodash alternative
• 20 TypeScript Tips for Cleaner, More Efficient Code in 2024

• React
  • Build a micro-frontend application with React
  • How to (not) reset a form after a Server Action in React
  • How to Create an AI-Powered Newsletter Aggregator with React and AI Agents
• Vue
  • Building a real-time chat app using Laravel Reverb and Vue
  • defineExpose and <style vars> in Vue 3 for component interaction and theming
• Angular
  • Cracking Angular DI: The Hidden Layers of Injectors