JSX Over The Wire (59 minute read)
An alternative approach to traditional REST APIs is having APIs return UI components as JSON using React Server Components (RSC). By composing ViewModels, the code generating props is directly linked with the code consuming those props. This ends up with self-contained UI pieces that handle their data dependencies, are rendered in a single client-server roundtrip, and maintain client-side state.
|
How I Reduced My React Bundle Size by 30% (With Real Examples) (5 minute read)
Reducing React bundle sizes leads to faster load times and a better user experience. There are a few practical tips to do this, including removing side effects, deleting unused code, avoiding barrel files, and using lighter libraries. Applying multiple of these strategies allowed this developer to reduce his app's bundle size by over 30%.
|
A flowing WebGL gradient, deconstructed (47 minute read)
A flowing WebGL gradient effect is a great tutorial for teaching basic shader concepts while creating the final product. This post goes over how to write shaders, color mapping, gradient noise, and use WebGL to improve performance. It also goes over creative rendering techniques, like creating animated waves using stacked sine waves and simplex noise, implementing dynamic blur, and using gradient textures for more flexible color mapping.
|
|
The systemic failure of implementing CSS principles (8 minute read)
Modern approaches to CSS architecture fail to uphold the principle of separating structure (HTML) from presentation (CSS). Utility classes in frameworks like Bootstrap lead to verbose HTML with styling information embedded within it, making the code harder to both read and maintain.
|
This is why you're not shipping (7 minute read)
Many companies unknowingly slow themselves down with excessive meetings, rigid team structures, and unnecessary approval processes. PostHog avoids these traps by having transparency, giving engineers the power to make final decisions, and maintaining a flexible team structure.
|
|
Scalar (GitHub Repo)
Scalar is an open-source API platform with a modern REST API client, API references, and first-class OpenAPI/Swagger support.
|
TipTap UI Components (GitHub Repo)
Tiptap UI Components is a library of React components, templates, and primitives for building rich text editors easily on top of the Tiptap editor framework.
|
Fumadocs (GitHub Repo)
FumaDocs is a documentation framework built on Next.js that uses TypeScript, MDX, and Tailwind CSS. It provides utilities, a UI, and features of Next.js App Router. FumaDocs includes built-in components and integrations, focusing on a user-friendly mobile responsive experience.
|
|
The case of the UI thread that hung in a kernel call (9 minute read)
A customer's UI thread was hanging due to a deadlock involving a watchdog thread. The watchdog thread was suspending the UI thread to capture a stack trace, but the UI thread held a lock needed by the watchdog to complete the stack capture, resulting in a deadlock. To avoid this, thread suspension for debugging should be done from a separate process.
|
Hacking the Postgres wire protocol (11 minute read)
PgDog is a network proxy that understands the Postgres wire protocol, allowing it to route queries to multiple databases without application code changes. It parses SQL queries using a Rust library extracted from Postgres itself to identify sharding keys and determine where to send the query. It also manages cross-shard queries by handling and manipulating messages to combine results from multiple shards, including rewriting row counts and managing data types.
|
|
Notion Mail (Website)
Notion Mail is an AI-powered inbox that organizes, drafts, and schedules emails with features like auto-filtering, custom views, and built-in scheduling.
|
MCPify.ai (Website)
MCPify is a no-code tool for building MCP servers that can be used by Claude, Cursor, and other AI tools.
|
protobuf-ts-types (GitHub Repo)
protobuf-ts-types is a TypeScript library that infers types from protobuf message definitions without code generation or compilation using TypeScript's template literal types.
|
|
|
Love TLDR? Tell your friends and get rewards!
|
|
Share your referral link below with friends to get free TLDR swag!
|
|
|
|
|
Track your referrals here.
|
|
Want to advertise in TLDR? 📰
If your company is interested in reaching an audience of web developers and engineering decision makers, you may want to advertise with us.
Want to work at TLDR? 💼
Apply here or send a friend's resume to jobs@tldr.tech and get $1k if we hire them!
If you have any comments or feedback, just respond to this email!
Thanks for reading,
Priyam Mohanty, Jenny Xu & Ceora Ford
|
|
|
|