How Timefold and Bryntum work together: An Overview

We recently announced the new Timefold and Bryntum partnership. This post is a high-level overview of the technical aspects of our exciting collaboration.

Whether you’re building a scheduling solution for employee rosters, field services, or machines, it should be visually intuitive and smart enough to handle constraints, preferences, and changes. Don’t settle for building another simple planning tool when you can implement a system that optimizes plans, does more with the same resources, and adapts to shifting scenarios.

This is exactly what we help you achieve with our Timefold x Bryntum partnership.

Timefold is an AI-driven constraint solver for scheduling, shift planning, and routing. Bryntum Scheduler is a high-performance, drag-and-drop timeline UI component that renders interactive schedules. Together, they allow you to build optimized and attractive planners.

How it works: A technical overview

Timefold and Bryntum are both modular and technology-agnostic. You can plug them into any system architecture with minimal friction, whether it’s a monolithic, microservices, or hybrid setup.

Bryntum Scheduler

Bryntum Scheduler is a powerful UI component for intuitive task and resource management.

Fully framework-agnostic, Bryntum Scheduler slots easily into any frontend stack (React, Angular, Vue, or plain JavaScript), allowing developers to build responsive, user-friendly scheduling interfaces with minimal effort.

Timefold

Timefold provides REST APIs that solve complex planning problems such as shift and job scheduling, enabling developers to offload constraint-heavy logic to a dedicated optimization engine.

Once a scheduling request is submitted, Timefold returns an optimized solution in JSON format, making it easy to integrate with any system.

Integration flow

Your backend system serves as the single source of truth, so that you retain full ownership and control of your scheduler. Timefold and Bryntum are powerful tools for visualization and optimization, but they are not intended to function as data stores. Supplying Timefold and Bryntum with the necessary scheduling data from your own system ensures consistency, prevents duplication, and simplifies data management.

Display data in the Bryntum Scheduler using the CrudManager

To display a schedule to your users, the necessary data must be available in your browser.

Bryntum components support various data-loading strategies. You can use the CrudManager or load data directly into a specific store via a URL. This CrudManager is especially handy for loading and saving data to and from your backend. You can also integrate WebSocket connections to enable real-time data exchanges between Bryntum components and your source-of-truth system.

Bryntum manages your data using stores, which are reactive, in-memory data repositories that:

• Load and hold scheduling data (in the form of tasks, resources, and assignments)
• Support sorting, filtering, syncing, and all CRUD operations
• Bind automatically to the UI, so that any changes to the stores are instantly reflected in the interface

Note: These stores are not related to the browser’s local storage. Any unsaved or unsynchronized data will be lost when the browser is closed.

The data loaded by Bryntum Scheduler doesn’t need to be a complete plan. You can add unplanned events to the UI, so users can plan them manually with Bryntum’s drag-and-drop functionality.

Optimize plans with the Timefold APIs

Available as JSON REST APIs, Timefold’s optimization models do the hard planning work for you. No matter the optimization model you use (employee shift scheduling, vehicle routing, or job scheduling), all Timefold APIs follow a similar integration pattern:

1. Gather all relevant planning data: The data you need depends on your chosen optimization model and the constraints you want to enable. Timefold’s APIs only enable certain constraints if you provide the relevant data. The more data points you provide, the more constraints will be active. For example, when scheduling employees, employee costs are only taken into account when you provide the costGroxup of the employees.
2. Send that data to the Timefold API to start an optimization run: The Timefold Platform then optimizes the schedule so that it complies with all activated constraints, such as employee availability and skill matching.
3. Monitor the progress of the optimization run by calling the Timefold API to retrieve its status: A single run can take anything from a few seconds to several hours, depending on the scale of the planning problem. The Timefold API always returns the current best solution found so far, along with the current status of the run.

You can implement long polling to continuously fetch updates until the optimization is complete. Alternatively, you can configure a webhook that is triggered when the optimization run finishes.

Customize your integration

Timefold and Bryntum complement each other perfectly, and you can choose how far you want to integrate with either of them. Consider a basic example of backend integration:

• A user clicks Optimize in the Bryntum Scheduler UI.
• The backend collects relevant scheduling data (such as tasks, resources, or constraints), which it then sends to Timefold.
• Timefold processes the input and returns an optimized schedule.
• The backend stores the result and updates the Bryntum Scheduler with the new data.
• The user reviews the updated schedule in Bryntum, then manually adjusts the plan and persists their changes as needed.
  

Users also benefit from the following optional features:

Manual edits and score analyses: Use Timefold’s scoring API to analyze the impact of manual changes made in the Bryntum UI.

AI-assisted recommendations: Let Timefold suggest the best match for a task, rather than leaving it up to manual guesswork.

Frontend-only integration

An alternative approach is to call Timefold directly from the Bryntum UI. While this may at first seem easier for existing Bryntum users, it comes with some major downsides:

• The UI needs to gather all the data for the Timefold API, which is not always feasible. Sometimes, the dataset is too large to load in one go, or the data required for planning is not exposed to the frontend.
• Optimizations for large-scale planning problems can run for multiple minutes or even hours. Because your users won’t be looking at the Bryntum UI for all that time, you need somewhere to store the component state.
• You would still require a proxy to check your application authorization and to hide the Timefold API keys from your end users.

Frontend-only integration may be okay for demos or prototyping, but it is insufficient for robust systems.

Closing thoughts

The Timefold x Bryntum integration solves a common challenge of building scheduling applications that are both intelligent and user-friendly. Users can make manual changes to the optimized schedule using the Bryntum UI and let Timefold reprocess the schedule with their changes.

The final product is still actively evolving. While the technical foundation outlined above is solid, we’re still working on the product. In the meantime, we welcome you to share your thoughts about the technical overview and your particular use case with us.

• Contact Mats Bryntse: mats@bryntum.com.
• Contact Bartel Van Herreweghe: bartel@timefold.ai.