TLDR Web Dev 2024-05-10

Why React rerenders πŸ“, the best website ever πŸ’», GraphQL vs REST πŸ€”

πŸ§‘β€πŸ’»
Articles & Tutorials

Why React Re-Renders (17 minute read)

Many developers work professionally with React for years without understanding how its re-rendering process works. This tutorial helps readers build a mental model for when and why React re-renders and how to tell why a specific component re-rendered. Knowing how React's render cycle works can help developers understand when to use React.memo and when to wrap functions in useCallback.

Protobuf Editions are here: don't panic (8 minute read)

Google has introduced Protobuf Editions, a new feature flag system that lets plugin maintainers granularly control the behavior of generated APIs and runtimes. Editions combines existing proto2 and proto3 functionality and is backwards-compatible. It is recommended that developers stick with proto3 for now.
🧠
Opinions & Advice

It's always TCP_NODELAY. Every damn time (5 minute read)

Nagle's algorithm, designed in the 1980s to reduce network overhead from small packets, often causes latency problems in modern distributed systems. This developer argues that TCP_NODELAY (which disables Nagle's algorithm) should be the default behavior on modern systems.

What's the best looking/performing website you've ever seen? (Reddit Thread)

Web devs on Reddit give opinions on the best looking website they've seen and why they're so good. Stripe and GitHub are common winners. Animations are usually done with Lottie and the Web Animations API.
πŸš€
Launches & Tools

Tiny World Map (GitHub Repo)

tinyworldmap is a lightweight map library for web apps that need to function offline or on low-bandwidth connections. It integrates with Leaflet and offers customization options like city labels and borders.

Command-K (GitHub Repo)

Command-K Is a React component for command menus. You render items within the menu and the component will automatically filter and sort them.

CodeHelium (GitHub Repo)

CodeHelium is a React editor component that compiles, executes, and returns the outputs of any user-written Python code using WebAssembly.
🎁
Miscellaneous

I Reviewed 1,000s of GraphQL vs. REST perspectives (10 minute read)

GraphQL has a great developer experience, but also introduces complexity in areas like caching, access control, and performance optimization. REST APIs are usually a better starting point for most teams.

Ruby typing 2024: RBS, Steep, RBS Collections, subjective feelings (7 minute read)

This developer wanted to add static type checking to their Ruby gem but found RBS, the recommended approach, to be inconvenient. RBS requires maintaining separate type definition files and has limited support for tools like RSpec. Sorbet, an alternative approach, might have been a better choice.
⚑️
Quick Links

Postgres Message Queue (GitHub Repo)

Postgres Message Queue is a lightweight, open-source message queue.

Ellipsis (Website)

Ellipsis is an AI dev tool that reviews pull requests and converts GitHub comments into working, tested code.

A/B Testing on the Front-End (6 minute read)

The Split SDK is used for A/B testing the front-end in two ways: 1) loading both variations and using CSS to reveal the correct one (avoiding flicker), and 2) using a loading page and then redirecting the user to the appropriate variation.
Get our free, 5-minute newsletter read by 350,000 frontend, backend, and full stack developers
Join 300,000 readers for