Frontend Development Weekly Digest 🎍 - Week 31

📢 News & Trends

• 🔮 Exploring the magic of runes in Svelte 5

  • Covers the new runes system in Svelte 5 for declaring reactive states, comparing it to previous methods and explaining its benefits and drawbacks.

• 🚀 What’s New for JavaScript Developers in ECMAScript 2024

  • An overview of the new features and updates in ECMAScript 2024, providing insights into how they will impact JavaScript development.

🆕 Releases & Updates

• 💡 We Can Finally Animate height: auto; in CSS!

  • Describes the new calc-size() function in CSS, which allows animating height: auto smoothly without JavaScript, available in Chrome Canary.

• 🔧 What’s new in DevTools, Chrome 127

  • Details the latest features and updates in Chrome DevTools version 127, highlighting improvements for developers and debugging tools.

🛠 Tools & Resources

• 🛠️ Feature detect CSS @starting-style support

  • Discusses how to detect support for the CSS @starting-style rule, which defines styles for elements’ initial state in animations.

• 🔗 Event Delegation vs Event Propagation in JavaScript

  • Explains the differences between event delegation and event propagation in JavaScript, highlighting how delegation improves performance and simplifies dynamic element handling.

• 📦 What’s the Difference Between the useMemo and useCallback Hooks?

  • Clarifies the differences between React’s useMemo and useCallback hooks, detailing their usage and benefits in optimizing performance.

• 🧰 8 Must-have Websites to Master UI/UX Skills

  • Lists essential websites for mastering UI/UX design skills, offering resources and tools for designers to improve their craft.

• 🧼 Clean Code: 7 tips to write clean functions

  • Provides seven practical tips for writing clean, maintainable functions in code, emphasizing clarity and simplicity.

🔍 Explore More

• ⚛️ React Components Demystified: Your Ultimate Guide from Newbie to Ninja

  • A comprehensive guide to understanding and using React components, aimed at helping developers of all levels improve their React skills.

• 📝 Histoire: A new way to write stories

  • Introduces Histoire, a tool for writing and managing stories, detailing its features and benefits for storytellers and writers.

• 📊 Structured Data: What It Is and Why You Need It

  • Explains the concept of structured data, its importance for SEO, and how it helps search engines understand and index content better.

💻 CSS for Dummies

When you try to center a div but accidentally send your surfer to the stratosphere:

.surfer {
  position: absolute;
  top: -9999px;
  left: 50%;
}

---

Cited Sources:

• logrocket.com
• thenewstack.io
• webdevsimplified.com
• developer.chrome.com
• bram.us
• dev.to
• freecodecamp.org
• uxplanet.org
• craftbettersoftware.com
• histoire.dev
• builder.io

💡 Stay updated with the latest in frontend development. Follow the links for more insights.

✨ Explore More:

• Frontend Development Weekly Digest 💮 - Week 32
• Frontend Development Weekly Digest 🧘 - Weeks 29-30
• Frontend Development Weekly Digest 🎍 - Week 41-42