802: Tree Shaking × useMemo vs useCallback × JavaScript Event Loop - STUMP'd

Syntax - Tasty Web Development Treats

Scott and Wes serve up a gameshow-style quiz with STUMP’d, challenging each other on web development trivia. From the differences between useMemo and useCallback to the intricacies of the JavaScript event loop, join them for a fun and informative session packed with web dev insights!

Show Notes

• 00:00 Welcome to Syntax!
• 01:17 Brought to you by Sentry.io.
• 02:03 The longest game of Rock, Paper, Scissors.
• Round 1
• 03:22 In React, what is the difference between useMemo and useCallback hooks, and in what scenarios would you choose one over the other?
• 05:56 Explain the concept of “tree shaking” in modern JavaScript build tools. How does it work, and what are its benefits?
• Round 2
• 09:11 In the context of CSS Grid, explain the difference between grid-template-areas and grid-area.
• 11:34 What is the “Temporal Dead Zone” in JavaScript, and how does it relate to variables declared with let and const
• Round 3
• 13:29 Describe the inner workings of the JavaScript event loop, including the roles of the call stack, callback queue, and microtask queue.
• 17:10 What is the “Shadow DOM” in web components, and how does it differ from the regular DOM?
• Round 4
• 20:05 Explain the process of Critical Rendering Path optimization in modern web browsers
• 26:14 Describe the purpose and functionality of the Intl.Segmenter API in JavaScript.
• Round 5
• 30:03 Explain the concept of Web Assembly (WASM) and its role in modern web development.
• 32:11 Explain the concept of Svelte stores, particularly focusing on the differences between writable, readable, and derived stores.
• Round 6
• 35:26 Explain the concept of “code splitting” in modern JavaScript applications.
• 37:00 Describe advanced techniques for maintaining an accessible focus order in web accessibility.
• Round 7
• 45:15 Explain the concept of “Server-Sent Events” (SSE) in web development.
• 47:37 What’s the difference between contain layout and contain paint?
• 49:30 Sick Picks & Shameless Plugs.

Sick Picks

• Scott: diskprices.
• Wes: Slime Tire Sealant.

Shameless Plugs

• Scott: Syntax on YouTube.

Hit us up on Socials!

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott: X Instagram Tiktok LinkedIn Threads

Randy: X Instagram YouTube Threads