#493 – February 16, 2025
New York Times' rich text editor
Why I rebuilt ProseMirror’s renderer in React
28 minutes by Shane Friedman
This article discusses Shane experience rebuilding ProseMirror's renderer in React while working on the New York Times' rich text editor. After an initial attempt that still had subtle bugs, he created a new solution by subclassing ProseMirror's EditorView and reimplementing its rendering engine using React. The final solution successfully resolved the integration issues while maintaining compatibility with existing ProseMirror code. The new implementation supports server-side rendering and offers good performance even with complex documents and custom node views.
Build React Apps with Authentication Pre-Integrated
sponsored by SuperTokens
Skip the hassle of integrating authentication. With SuperTokens, you can start your React or NextJS app with email + password, social logins, and more, ready to go. Just run: npx create-supertokens-app@latest.
What Do We Do with You, Old React?
6 minutes by Manuel Sánchez
In this post Manuel provides a Fun Guide to Upgrading Class-Based React & Redux Stores. Class components and outdated Redux? Discover how to modernize your code with React Hooks and @reduxjs/toolkit, complete with code examples and project structure tips.
How React Router works under the hood
7 minutes by Tiger Abrodi
Tiger provides a deep dive into React Router's internal workings as a full-stack web framework following its merger with Remix. He explains how React Router handles different types of requests, implements Fog of War for performance optimization, manages server-side rendering and hydration, handles client-side navigation with a single-fetch strategy, and deals with state management and race conditions.
Promises across the void: Streaming data with RSC
10 minutes by Edward Spencer
In this blog post Edward explains how React Server Components can send unresolved promises from server to client, enabling better performance through streaming. He demonstrates how to use the React 'use' hook to handle these promises, and shows how the server can start a promise while letting it resolve on the client side.
React How to Add Minimum Loading Delay
2 minutes by Elijah Lopez
In this article Elijah presents a solution for implementing a minimum-duration loading spinner in React applications, specifically addressing the issue of quick-loading states that can create unpleasant UI flickering. He describes a simple approach using throttle hooks that works independently of the data fetching method, doesn't add unnecessary delays beyond the minimum duration, and only delays the transition from loading to complete state, not vice versa.
Meet Harmony
sponsored by bit
Harmony is an open source library for composing consistent and highly performant platforms from independent business features. It empowers React developers to seamlessly integrate API-centric features into shell applications while maintaining optimal user experience, performance, safety, and developer experience.
And the most popular article from the last issue: