From the OpenReplay Blog
A Beginner's Guide to Remote Functions in SvelteKit
SvelteKit remote functions replace manual API endpoints with type-safe server calls. Compare query, form, command, and prerender types to choose correctly.
Refs Explained: How Frameworks Handle DOM Direct Access
DOM refs in React, Vue, Angular, and Svelte give you direct DOM access without breaking framework guarantees when declarative patterns fall short.
Why Devs Are Moving to TanStack Start from Next.js
Compare TanStack Start and Next.js across routing, server functions, and Vite integration to decide which React framework fits your team best.
How to Spot Database Queries That Hurt Your App's Performance
Trace slow database queries using query plans, slow query logs, and OpenTelemetry spans to identify N+1 problems, lock contention, and missing indexes.
Building a Custom File Upload Component for React
Build a custom React file upload component with drag and drop, validation, previews, and XHR progress tracking while keeping file inputs uncontrolled.
Tables Not Divs: A Simple API for Real Tabular Data
Build real data tables using the HTML table DOM API with native methods that avoid XSS risks and produce semantic, accessible markup by default.
How to Add Search to Your Website Without a Backend
Add client-side search to static and JAMstack sites using Pagefind, Lunr, Fuse.js, or Algolia without maintaining a backend server or database.
Practical Memoization Patterns in JavaScript
Memoize JavaScript functions safely by handling object references, async edge cases, cache eviction, and React useMemo without causing memory leaks or bugs.
Embedding YouTube Videos Without Slowing Down Your Site
YouTube iframes damage LCP and INP scores. The facade pattern loads click-to-play placeholders instead, cutting main thread work before user interaction occurs.
When Your Form Needs to Talk Back, Use the Output Element
The HTML output element displays live form results by linking inputs via the for attribute, the name attribute, and the HTMLOutputElement value property.
Checklist for Choosing a Web Form Builder
Evaluate form builders by integration model, WCAG support, GDPR data residency, webhook security, and validation rules to avoid costly migrations.
Smarter Package Updates With npm-check-updates
npm-check-updates helps you update package.json ranges, respect semver boundaries, and keep lockfiles in sync without breaking CI pipelines.
How to Find Security Gaps in Your App Using Strix
Strix uses autonomous AI agents to probe your application for broken access control, injection flaws, and business logic bugs before they reach production.
How to Get the Last Matching Array Value in JavaScript
Array findLast and findLastIndex methods let you retrieve the last matching element or its index without mutating your data or writing manual loops.
How to Build an Angular App via Google AI Studio
Build Angular apps fast using Google AI Studio Build mode, export to GitHub, and handle API key security with a proper backend proxy architecture.
What's New in Preact for 2026?
Evaluate Preact security patches, the Preact 11 beta changes, and updated tooling including Vite and preact-iso to make informed production decisions.
Building Scroll-Aware Components in React
Avoid scroll jank by using Intersection Observer, refs, and useSyncExternalStore for React scroll position tracking without unnecessary re-renders.
Useful Color Tools for Frontend Developers
Compare OKLCH color tools, browser DevTools, and accessibility checkers to build perceptually uniform palettes that meet WCAG contrast ratios in CSS.
Building Documentation Sites with Docusaurus
Build a static documentation site with Docusaurus v3 using MDX, versioning, Algolia search, and React-based theming for fast, maintainable developer docs.
TSX and the Rise of Typed Frontend Components
Type React TSX components with confidence by mastering props typing, event handling, children patterns, and the server and client component split in React 19.
REST vs RPC: Two Ways to Think About API Design
Compare REST and RPC API design across caching, type safety, and streaming to decide when to use gRPC, Connect, or HTTP resource-oriented endpoints.
An Introduction to Ember.js
Ember.js offers conventions, Glimmer components, and Embroider with Vite for large-scale apps. See how routing, services, and tracked state work together.
How to Build a Simple CRUD App in Appsmith
Build a simple CRUD app in Appsmith by connecting a database, displaying records in a Table widget, and wiring forms for create, update, and delete operations.
How to Quickly Spin Up a Local Web Server
Fix CORS errors and broken paths by running a local web server using VS Code Live Server, npx serve, Python, or Vite for frontend development.