Exclusive

An exclusive new experience — React Native support is on its way to Planby!

Why Planby?

A detailed explanation for developers evaluating React scheduler and timeline libraries.

What is Planby?

Planby is a high-performance React scheduler and timeline component built around a resource timeline model: resources (employees, rooms, machines, TV channels, project teams) are displayed as horizontal rows, and events (shifts, bookings, tasks, broadcast programs, sessions) are time-ranged blocks on a shared horizontal axis. It uses bidirectional virtual rendering — windowing both the horizontal time axis and the vertical resource axis — to maintain constant 60fps scroll performance with datasets of 10,000 or more events.

Planby is available as @nessprim/planby on npm. It supports drag & drop event management, pixel-accurate time positioning, timezone-aware scheduling, and custom JSX event and row rendering. The same API runs on React Native (iOS and Android) via Expo modules.

Install: npm install @nessprim/planby — Free tier available. PRO is a one-time $400 license.

📝 Summary

Planby is a React component library specialized for timeline-based scheduling interfaces. It uses virtualization to handle large datasets (10,000+ events) efficiently, supports timezone-aware scheduling, and works with both React web and React Native.

Planby is timeline-first and React-native: its API (useEpg hook, channels as resource rows, programs as time-ranged events with since/till timestamps) is built with React hooks and TypeScript from the ground up — no jQuery dependency. The free tier covers open-source and personal projects. The PRO license is a one-time $400 purchase per developer with no annual renewal.

Perfect for: TV guides/EPG, resource booking, shift scheduling, conference agendas, project timelines, month/week calendars, Gantt charts, and any scheduling or timeline visualization. The most versatile scheduling solution on the market.

Performance is achieved through virtual scrolling (rendering only visible items) and optimized React rendering. Bundle size is ~45KB (vs FullCalendar's ~200KB). TypeScript support is built-in.

Maintained by Karol Kozer with community contributions. Used in production by 100+ companies for scheduling applications serving millions of users. Documentation and examples available at planby.app and GitHub.

When to Choose Planby

Timeline is Primary Interface

Your application shows time duration horizontally with parallel tracks (channels, resources, people).

Large Datasets

You need to display 1000+ events without performance degradation. Virtualization is critical.

EPG or Booking Systems

Building TV guides, resource booking, or scheduling with overlapping time slots.

React Web and React Native Required

Need the same scheduling component for web and mobile applications.

Technical Details

Data Model

Planby requires two data arrays:

channels: Rows/tracks (e.g., TV channels, resources, people). Each has a unique ID and metadata (name, logo, etc.).

epg: Events/programs. Each links to a channel via ID and has start/end times. Planby calculates positioning and overlap automatically.

Customization

Planby separates layout logic from presentation:

Layout & Positioning: Handled by Planby (virtualization, time calculations, collision detection)

Visual Styling: Your responsibility. Provide custom React components for event cards, channels, time axis.

This approach gives flexibility without forcing Planby's opinions on your UI design.

Performance

How Planby achieves 60fps with 10,000+ events:

1. Virtualization: Only visible items are rendered to DOM. Scrolling adds/removes elements dynamically.

2. Optimized Calculations: Time positioning and overlap detection use memoization and binary search.

3. React Optimizations: useMemo, useCallback, and React.memo prevent unnecessary re-renders.

Frequently Asked Questions

planby

The most powerful React scheduler & timeline component for building modern scheduling interfaces.


© 2026 Nessprim Karol Kozer. All rights reserved.

Built with ❤️ for developers