Calix

Performance

What Calix computes and how to keep custom UI responsive.

Calix limits its work to the months it displays. A render generates one grid per visible month and memoizes derived selection, constraint, weekday, and grid data inside useCalendar.

Bundle boundaries

  • @alydev/core has no runtime dependencies.
  • Gregorian and Jalali are separate adapters, so importing one does not import the other.
  • The React package is marked side-effect free; optional theme CSS is the intentional side effect of importing a stylesheet.

Keep custom UI efficient

  • Keep adapter stable: use the exported singleton (gregorian or jalali), not a newly created object per render.
  • Memoize expensive renderDay content and callbacks when rendering many months.
  • Use numberOfMonths only for months you intend to show.
  • Put expensive availability lookups outside isDateDisabled; pass resolved dates or a fast predicate to the picker.

Verify in this repository

pnpm size                    # package bundle budgets
pnpm --filter @alydev/core bench # core grid micro-benchmarks

The bench/ directory also contains render-profiler harnesses. Treat results as release checks for this repository rather than universal comparisons: application markup, CSS, React version, and number of displayed months affect real results.

On this page