Skip to main content

DHTMLX Scheduler alternatives

· 15 min read
Arsalan Khattak
Computer Science graduate and Developer Advocate at Bryntum, previously at Vercel. Writes about JavaScript UI components and developer tooling.

DHTMLX Scheduler is a JavaScript event scheduler with a GPL-licensed Standard edition covering day, week, month, year, and agenda views. If you're looking for an alternative, you're likely deciding whether your application needs resource timeline views without the Commercial license requirement, GPL constraints, or DHTMLX's global singleton model.

What to know about DHTMLX Scheduler alternatives​

The table below compares licensing, scheduling features, framework support, package access, and MCP support.

FeatureFullCalendarSchedule-XMobiscroll Event CalendarBryntum Scheduler
LicenseMIT (core) / Annual subscription (Premium)MIT (core) / Paid per-project (Premium)CommercialCommercial
Free tierMIT (no watermark)MIT (no watermark)90-day trialTrial only
Resource schedulingPremium onlyPremium only✔️✔️
Drag-and-drop✔️ (free)Premium only✔️✔️
Framework supportReact, Angular, VueReact, Angular, Vue, SvelteReact, Angular, VueReact, Angular, Vue, plain JavaScript
Public npm✔️✔️❌ (CLI auth)Trial packages and wrappers
Agent support (MCP, skills)❌❌❌HTTP MCP server, Claude Code skill

FullCalendar​

FullCalendar is a JavaScript event calendar with an MIT-licensed core covering day, week, month, list, and multi-month views. Drag-and-drop and event resize are free through the @fullcalendar/interaction plugin. Resource scheduling requires the Premium subscription at $480 per developer per year.

Installing FullCalendar​

The standard packages are on the public npm registry under the MIT license:

npm install @fullcalendar/core@6.1.20 @fullcalendar/daygrid@6.1.20 @fullcalendar/timegrid@6.1.20 @fullcalendar/list@6.1.20 @fullcalendar/interaction@6.1.20

The following shows a team calendar week view with events spanning April 27 to May 1:

<!-- index.html -->
<style>
html, body { margin: 0; padding: 0; height: 100%; font-family: Arial, sans-serif; }
#app { padding: 16px; height: 100vh; box-sizing: border-box; }
#calendar { height: calc(100vh - 32px); }
</style>
<div id="app">
<div id="calendar"></div>
</div>
import { Calendar } from '@fullcalendar/core';
import dayGridPlugin from '@fullcalendar/daygrid';
import timeGridPlugin from '@fullcalendar/timegrid';
import listPlugin from '@fullcalendar/list';
import interactionPlugin from '@fullcalendar/interaction';

const calendarEl = document.getElementById('calendar');

const calendar = new Calendar(calendarEl, {
plugins : [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],

initialView : 'timeGridWeek',
initialDate : '2026-04-28',
height : '100%',

headerToolbar : {
left : 'prev,next today',
center : 'title',
right : 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
},

slotMinTime : '08:00:00',
slotMaxTime : '20:00:00',
editable : true,

events : [
{ id : '1', title : 'Team Standup', start : '2026-04-27T09:00', end : '2026-04-27T09:30' },
{ id : '2', title : 'Sprint Planning', start : '2026-04-27T10:00', end : '2026-04-27T12:00' },
{ id : '3', title : 'Design Review', start : '2026-04-27T14:00', end : '2026-04-27T15:00' },
{ id : '4', title : 'Team Standup', start : '2026-04-28T09:00', end : '2026-04-28T09:30' },
{ id : '5', title : 'API Workshop', start : '2026-04-28T11:00', end : '2026-04-28T13:00' },
{ id : '6', title : 'Client Demo Prep', start : '2026-04-28T15:00', end : '2026-04-28T17:00' },
{ id : '7', title : 'Team Standup', start : '2026-04-29T09:00', end : '2026-04-29T09:30' },
{ id : '8', title : 'Regression Testing', start : '2026-04-29T10:00', end : '2026-04-29T13:00' },
{ id : '9', title : 'Product Review', start : '2026-04-29T14:00', end : '2026-04-29T15:30' },
{ id : '10', title : 'Team Standup', start : '2026-04-30T09:00', end : '2026-04-30T09:30' },
{ id : '11', title : 'Release Planning', start : '2026-04-30T14:00', end : '2026-04-30T16:00' },
{ id : '12', title : 'Team Standup', start : '2026-05-01T09:00', end : '2026-05-01T09:30' },
{ id : '13', title : 'Retrospective', start : '2026-05-01T10:30', end : '2026-05-01T12:00' },
{ id : '14', title : 'UX Research Session', start : '2026-05-01T14:00', end : '2026-05-01T17:00' }
]
});

calendar.render();

Three setup details require attention:

  • Drag-and-drop and event resize require @fullcalendar/interaction in the plugins array. Setting editable: true alone is insufficient without it.
  • In v6, CSS is injected automatically by the JavaScript bundle. No manual CSS imports are needed.
  • Resource views (@fullcalendar/resource-timeline, @fullcalendar/resource-timegrid) require a Premium license key in schedulerLicenseKey.

FullCalendar rendering a team week view with color-coded events across April 27 to May 1, 2026

FullCalendar is free under MIT with no watermark and no GPL restriction​

The MIT-licensed standard tier carries no evaluation watermark, no per-developer fee, and no restriction on open-source use. Day, week, month, list, and multi-month views are included, along with drag-and-drop and event resize. Framework wrappers for React, Angular, and Vue are first-party and free.

FullCalendar avoids the GPL licensing constraint that affects DHTMLX Scheduler Standard. Teams with standard calendar views and no resource scheduling requirement get a production-ready calendar at no cost. Unlike Schedule-X, which moved drag-and-drop to Premium in v4, FullCalendar keeps drag-and-drop and event resize free in the MIT tier.

FullCalendar Premium required for resource timeline at $480 per developer per year​

Resource scheduling requires the Premium subscription at $480 per developer per year. FullCalendar has no built-in export to PDF, Excel, or ICS, and no undo/redo stack. The library ships no MCP server and no Claude Code skill. FullCalendar and Schedule-X both keep resource scheduling outside the free core, while Mobiscroll and Bryntum Scheduler include it in the base package.

FullCalendar pricing: free MIT core, Premium at $480 per developer per year​

The MIT-licensed core is free. Premium, which includes resource timeline and resource time-grid views, starts at $480 per developer per year for up to ten developers.

Schedule-X​

Schedule-X is an MIT-licensed JavaScript calendar library with six views: day, week, month grid, month agenda, week agenda, and list. It is built on Preact and ships first-party integrations for React, Angular, Vue, and Svelte. Drag-and-drop, event resize, and resource scheduling are paid Premium add-ons in v4.

Installing Schedule-X​

The core package and default theme are on the public npm registry. Schedule-X v4 uses the Temporal API for configuration dates, so the polyfill is a required peer dependency:

npm install @schedule-x/calendar@4.5.0 @schedule-x/theme-default@4.5.0 temporal-polyfill@0.3.2

The temporal-polyfill/global import must come before creating any dates or rendering the calendar:

<!-- index.html -->
<style>
html, body { margin: 0; height: 100%; }
#calendar-container { width: 100%; height: calc(100vh - 32px); }
</style>
<div id="calendar-container"></div>
import 'temporal-polyfill/global';
import {
createCalendar,
createViewDay,
createViewWeek,
createViewMonthGrid,
createViewMonthAgenda
} from '@schedule-x/calendar';
import '@schedule-x/theme-default/dist/index.css';

const calendar = createCalendar({
views : [createViewWeek(), createViewDay(), createViewMonthGrid(), createViewMonthAgenda()],
defaultView : 'week',
selectedDate : Temporal.PlainDate.from('2026-04-28'),
weekOptions : { gridHeight : 700, scrollToHour : 8 },

events : [
{ id : '1', title : 'Team Standup', start : '2026-04-27 09:00', end : '2026-04-27 09:30' },
{ id : '2', title : 'Sprint Planning', start : '2026-04-27 10:00', end : '2026-04-27 12:00' },
{ id : '3', title : 'Design Review', start : '2026-04-27 14:00', end : '2026-04-27 15:00' },
{ id : '4', title : 'Team Standup', start : '2026-04-28 09:00', end : '2026-04-28 09:30' },
{ id : '5', title : 'API Workshop', start : '2026-04-28 11:00', end : '2026-04-28 13:00' },
{ id : '6', title : 'Client Demo Prep', start : '2026-04-28 15:00', end : '2026-04-28 17:00' },
{ id : '7', title : 'Team Standup', start : '2026-04-29 09:00', end : '2026-04-29 09:30' },
{ id : '8', title : 'Regression Testing', start : '2026-04-29 10:00', end : '2026-04-29 13:00' },
{ id : '9', title : 'Product Review', start : '2026-04-29 14:00', end : '2026-04-29 15:30' },
{ id : '10', title : 'Team Standup', start : '2026-04-30 09:00', end : '2026-04-30 09:30' },
{ id : '11', title : 'Release Planning', start : '2026-04-30 14:00', end : '2026-04-30 16:00' },
{ id : '12', title : 'Team Standup', start : '2026-05-01 09:00', end : '2026-05-01 09:30' },
{ id : '13', title : 'Retrospective', start : '2026-05-01 10:30', end : '2026-05-01 12:00' },
{ id : '14', title : 'UX Research Session', start : '2026-05-01 14:00', end : '2026-05-01 17:00' }
]
});

calendar.render(document.getElementById('calendar-container'));

Three setup details require attention:

  • The temporal-polyfill/global import must come before any call to Temporal.*. Without it, Temporal is undefined at runtime.
  • The selectedDate property accepts a Temporal.PlainDate object, not a plain string.
  • Event start and end use 'YYYY-MM-DD HH:mm' strings for timed events, or 'YYYY-MM-DD' for all-day events.

Schedule-X rendering a week view with color-coded events across April 27 to May 3, 2026

Schedule-X is free under MIT with a tree-shakable functional API and Svelte support​

The MIT-licensed core carries no evaluation watermark, no per-developer fee, and no restriction on open-source use, making it suitable for teams that cannot use GPL. The functional API (createCalendar(), createViewWeek()) is small and tree-shakable. Framework support spans React, Angular, Vue, and Svelte, all with first-party integrations. It is the only option here that includes first-party Svelte support in the free tier.

Schedule-X drag-and-drop and resource scheduling moved to Premium in v4​

Drag-and-drop and event resize are Premium in v4, having moved from the free tier in v3. Resource scheduling is also Premium. The Temporal API polyfill adds a required dependency. LLM training data still contains string-based Schedule-X examples from v2 and v3, so AI agents without current documentation produce code that fails at runtime. This is the only product in this comparison that requires a mandatory peer dependency polyfill, unlike FullCalendar, Mobiscroll, and Bryntum Scheduler, which work with standard JavaScript date handling.

Schedule-X pricing: free MIT core, Premium from €479 per year or €999 lifetime​

The MIT-licensed core is free. Premium add-ons require one license per project:

  • Yearly: from €479 per year for two to three developers
  • Lifetime: from €999 one-time for two to three developers (includes one year of updates)
  • Enterprise: custom quote

Mobiscroll Event Calendar​

Mobiscroll Event Calendar is a commercial JavaScript calendar component that ships four configurable view types: calendar, scheduler, timeline, and agenda. Drag-and-drop, resize, and drag-to-create are included in the base package alongside the resource timeline view.

The Event Calendar is not on the public npm registry and requires CLI authentication before any npm install command works.

Installing Mobiscroll Event Calendar​

Two commands set up Mobiscroll access: the global CLI install and a per-project configuration step.

npm install -g @mobiscroll/cli
mobiscroll config javascript

The mobiscroll config javascript command opens a browser to authenticate with Mobiscroll and configures npm to use the Mobiscroll private registry. A trial account is sufficient for evaluation.

The following shows a resource timeline for four team members across April 2026:

<!-- index.html -->
<style>
html, body { margin: 0; padding: 0; height: 100%; font-family: Arial, sans-serif; }
#app { padding: 16px; height: 100vh; box-sizing: border-box; }
#calendar { height: calc(100vh - 32px); }
</style>
<div id="app">
<div id="calendar"></div>
</div>
import * as mobiscroll from '@mobiscroll/javascript';
import '@mobiscroll/javascript/dist/css/mobiscroll.min.css';

mobiscroll.setOptions({ theme: 'material', themeVariant: 'light' });

mobiscroll.eventcalendar('#calendar', {
view : {
timeline : { type : 'month' }
},
selectedDate : new Date(2026, 3, 1).getTime(),
dragToCreate : true,
dragToMove : true,
dragToResize : true,
resources : [
{ id : 1, name : 'Alice (Frontend)', color : '#4f46e5' },
{ id : 2, name : 'Bob (Backend)', color : '#0ea5e9' },
{ id : 3, name : 'Carol (Design)', color : '#10b981' },
{ id : 4, name : 'Dave (QA)', color : '#f59e0b' }
],
data : [
{ id : '1', resource : 1, title : 'UI Component Library', start : new Date(2026, 3, 6), end : new Date(2026, 3, 11) },
{ id : '2', resource : 2, title : 'REST API Development', start : new Date(2026, 3, 6), end : new Date(2026, 3, 11) },
{ id : '3', resource : 3, title : 'Wireframes v2', start : new Date(2026, 3, 6), end : new Date(2026, 3, 9) },
{ id : '4', resource : 4, title : 'Regression Suite', start : new Date(2026, 3, 6), end : new Date(2026, 3, 8) }
]
});

Four setup details require attention:

  • The selectedDate property uses a timestamp. Calling .getTime() avoids string parsing and timezone ambiguity.
  • Events use the data property, not events.
  • The resource field on each event is resource, not resourceId.
  • Calling mobiscroll.setOptions() before any component mount applies the theme globally.

Mobiscroll Event Calendar showing a resource timeline with four team members and color-coded task bars across April 2026

Mobiscroll Event Calendar includes resource timeline and drag-and-drop in the base package​

The timeline view, drag-and-drop, drag-to-create, and resize ship in the same package as the time-grid scheduler, calendar, and agenda views. Switching between view types requires only a view config change. Resource scheduling does not require a separate purchase or upgrade.

Mobiscroll avoids the GPL licensing constraint of DHTMLX Scheduler Standard and includes the resource timeline in the base $995 package, while DHTMLX requires a Commercial license at $1,299 to run multiple instances alongside Pro for the timeline view. Mobiscroll is the only option here where every scheduling feature, including resource timeline, drag-and-drop, and resize, ships in a single package with no tier-based gating.

Mobiscroll Event Calendar requires CLI authentication before npm install in every environment​

Every developer and CI/CD environment must complete the CLI authentication step before npm install works. This adds friction at onboarding and in automated pipelines, and any agent that runs npm install @mobiscroll/javascript without prior authentication fails. This is the only product in this comparison that requires CLI authentication before npm install, unlike FullCalendar and Schedule-X, which install directly from the public registry without credentials.

Event dependencies, undo/redo, and Excel export are not supported. Mobiscroll ships no MCP server, no Claude Code skill, and no AI tooling.

Mobiscroll Event Calendar pricing: $995 perpetual license for a single internal project​

Mobiscroll uses a per-project perpetual licensing model for internal applications:

  • Scheduling and Calendaring: $995 (includes Event Calendar, single internal project)
  • Complete: $1,955 (includes source code and priority support)
  • Complete Company: $8,955 (multiple internal projects within one organization)

SaaS and multi-customer product licensing uses a subscription model with custom pricing based on customer count. Mobiscroll offers a 90-day trial and a 30-day money-back guarantee on purchases.

Bryntum Scheduler​

Bryntum Scheduler is a commercial JavaScript component for resource scheduling interfaces. Its default view is a horizontal timeline: resources (people, machines, rooms) appear as rows, and events are draggable bars across a configurable time axis. The component sits on Bryntum Grid, so the resource panel inherits full sorting, filtering, grouping, and column configuration without extra setup.

Installing Bryntum Scheduler​

The trial package is on the public npm registry without authentication:

npm install @bryntum/scheduler@npm:@bryntum/scheduler-trial@7.3.0

The following shows four team members across a two-week sprint. Three CSS imports are required in order before instantiation:

<!-- index.html -->
<style>
html, body { margin: 0; height: 100%; }
#container { height: 100vh; }
</style>
<div id="container"></div>
import '@bryntum/scheduler/fontawesome/css/fontawesome.css';
import '@bryntum/scheduler/fontawesome/css/solid.css';
import '@bryntum/scheduler/scheduler.css';
import '@bryntum/scheduler/svalbard-light.css';
import { Scheduler } from '@bryntum/scheduler';

new Scheduler({
appendTo : 'container',
startDate : '2025-05-07',
endDate : '2025-05-26',
viewPreset : 'weekAndDay',

columns : [{ text : 'Team member', field : 'name', width : 160 }],

resources : [
{ id : 1, name : 'Celia', title : 'Sales' },
{ id : 11, name : 'Fancy law firm', eventColor : 'teal' },
{ id : 12, name : 'Small boutique', eventColor : 'blue' },
{ id : 13, name : 'Grocery store', eventColor : 'lime' }
],

events : [
{ id : 1, resourceId : 1, name : 'Busy', startDate : '2025-05-07', endDate : '2025-05-09', eventColor : 'red' },
{ id : 2, resourceId : 11, name : 'Meeting', startDate : '2025-05-07', endDate : '2025-05-09', location : 'clients office' },
{ id : 3, resourceId : 12, name : 'Phone', startDate : '2025-05-07', endDate : '2025-05-08', location : 'office' },
{ id : 4, resourceId : 13, name : 'Suggested meeting', startDate : '2025-05-09', endDate : '2025-05-11', location : 'grocery store' }
]
});

The three imports cover FontAwesome icons, the structural scheduler.css, and a theme file. Bryntum ships ten themes across five light/dark pairs, all switchable at runtime via DomHelper.setTheme().

Bryntum Scheduler showing four team members across a two-week resource timeline with color-coded task bars

Timeline view, event dependencies, and export in the base license​

The timeline view is the default. The base license also includes:

  • Event dependencies (finish-to-start, start-to-start, and others)
  • Resource grouping and capacity summaries
  • Undo/redo
  • Client-side export to PDF, PNG, and Excel with no server dependency
  • Virtual rendering for large datasets without pagination
  • 45 built-in locales

The theming system is consistent across the Bryntum product suite (Gantt, Calendar, Grid, Task Board), so visual consistency comes without extra work when the application uses more than one component.

Bryntum Scheduler: large bundle and event-store configuration separate from component props​

The trial watermark persists during evaluation, which complicates stakeholder demos before a license purchase. The API surface is large: Scheduler, ResourceStore, EventStore, and AssignmentStore are separate objects with distinct responsibilities. The uncompressed bundle exceeds 4 MB, which matters for applications where initial load time is a constraint.

Bryntum Scheduler pricing: perpetual license from $680 per developer, three-developer minimum​

Per-developer licensing starts at $680 for a small team, with a minimum of three developers ($2,040 entry). All licenses are perpetual and include 12 months of updates. OEM licensing for SaaS applications requires a separate quote.

MCP server and Claude Code skill​

Bryntum ships two complementary AI tools: an MCP server and a Claude Code skill. The MCP server at mcp.bryntum.com exposes a search_bryntum_docs tool that returns version-specific documentation, source code examples, and API references for Scheduler and the rest of the Bryntum suite. The Claude Code skill covers CSS import order, store separation (ResourceStore vs AssignmentStore), and the correct dark mode pattern via DomHelper.setTheme().

Bryntum also ships an experimental, disabled-by-default AI assistant that accepts natural language instructions from end users.

Teams that need a resource timeline with event dependencies, export, and AI tooling without GPL licensing can start with the Bryntum Scheduler free trial.