Realays Logo Realays
← Back to Blog
DevLog 11/5/2025

[Dalendar DevLog 1] Project Inception and Tech Stack Selection

The beginning of our journey toward the perfect calendar app, and why we chose React Native and Expo.

[Dalendar DevLog 1] Project Inception and Tech Stack Selection

Episode 1: Project Inception and Tech Stack Selection

Ideation

1. Introduction: A Personal Journey Toward the Perfect Calendar App

Few tools are as familiar in our daily lives as calendars. From smartphones to computers, even to wristwatches, calendars are a fundamental feature. Yet beneath this ubiquitous tool lies considerable technical complexity. South Korea, in particular, has a unique temporal culture: while officially adopting the solar calendar (Gregorian) in 1896, major holidays like Lunar New Year and Chuseok are still celebrated according to the lunar calendar.

This cultural duality is not merely historical trivia. From a developer’s perspective, it reveals non-trivial

edge cases and computational overhead hidden beneath the seemingly simple surface of calendars. This realization ignited my obsession with finding the most efficient solution possible.

This project began as a personal journey—not just to create another calendar app, but to explore the algorithmic essence underlying calendars and push performance to its limits. Through this series, I aim to share the process of improving calendar calculation inefficiencies and building the highest-performance calendar app using modern technology stacks.

2. Problem Definition: Why Another Calendar App?

Given the abundance of calendar apps, why develop a new one? The answer lies in two core technical motivations: algorithmic inefficiency and painful lessons from past native development experiences.

2.1. Hidden Inefficiencies in Traditional Calendar Algorithms

The core of calendar calculations involves mathematical operations to determine specific dates. Most calendar algorithms heavily rely on division and remainder (modulo) operations. However, according to the research paper “Euclidean Affine Functions and Applications to Calendar Algorithms,” these two operations are the slowest among the four basic arithmetic operations performed by CPUs.

While each division operation is measured in nanoseconds, the accumulated latency becomes significant when users rapidly swipe through calendars, triggering thousands of executions. This can mean the difference between a smooth, fluid user experience and noticeable “jank” or stuttering.

The paper claims their proposed algorithm is “substantially more efficient” than implementations in “widely-used C, C++, C#, and Java open-source libraries.” This suggests that most calendar apps we currently use may harbor potential performance bottlenecks. The core objective of this project is to optimize these inefficient operations and maximize calendar calculation performance.

2.2. Lessons from Previous Development Experience

My past experience developing a calendar app in Android Kotlin provided crucial lessons for directing this new project. I used a nested RecyclerView structure to implement a monthly calendar view.

However, this structure brought numerous technical challenges. For example, to create the illusion of infinitely scrolling monthly calendars, I relied on the common but hacky workaround of setting the RecyclerView’s initial position to Int.MAX_VALUE/2. This made even determining the current month non-trivial, requiring constant error-prone calculations like position - center.

Moreover, each time a monthly view was rendered, the logic had to manually construct and populate a dayList containing 42 items (6x7 grid) to display dates. Filling the grid with dates from previous and next months required nested loops and complex calendar arithmetic. This was not only cumbersome but also created rendering performance bottlenecks during fast scrolling.

These complexities of native UI implementation and wrestling with frameworks instilled a desperate need for a more efficient and flexible development approach, becoming the decisive background for choosing a new tech stack in this project.

3. Tech Stack Selection for High-Performance Apps

Based on the problems defined earlier and previous development experience, I selected the following tech stack for this project.

3.1. Cross-Platform Choice: React Native (Expo)

This choice is a direct response to the pain of wrestling with native UI components like nested RecyclerView and their complex lifecycle management. The ability to support both Android and iOS platforms with a single codebase dramatically improves development productivity. I decided to use the Expo framework alongside React Native to reduce initial project setup hassles and enable rapid development focus.

3.2. Algorithm Precision Choice: TypeScript

Implementing the highly optimized but mathematically dense algorithms proposed in the “Euclidean Affine Functions” paper in pure JavaScript would be inviting disaster. A single subtle type coercion bug could silently nullify all performance gains. TypeScript’s robust static type system providesessential guardrails for work requiring this level of precision, significantly enhancing code stability and maintainability.

3.3. Future Scalability Choice: Node.js

This goes beyond future-proofing to an overall architectural philosophy. Considering potential long-term needs like user account integration or cloud synchronization, choosing Node.js as the backend allows us to maintain a unified TypeScript/JavaScript ecosystem from frontend to backend. This is a strategic decision that maximizes code reusability and enhances the development team’s cognitive efficiency.

##4. Technical Architecture Overview

Rendering Strategy

Unlike traditional native RecyclerView approaches with hacky infinite scroll workarounds, we employ a virtualized list with intelligent prefetching:

// Efficient calendar rendering
const Calendar = () => {
  const [visibleRange, setVisibleRange] = useState({
    start: currentMonth - 1,
    end: currentMonth + 1
  });

  // Only render visible + adjacent months
  return (
    <VirtualizedList
      data={generateMonths(visibleRange)}
      renderItem={({ item }) => <MonthView month={item} />}
      onViewableItemsChanged={updateVisibleRange}
    />
  );
};

Algorithm Optimization

Implementing the Euclidean affine function approach:

// Traditional: Uses expensive division
function getDayOfWeek_traditional(
  year: number,
  month: number,
  day: number,
): number {
  const totalDays = calculateTotalDays(year, month, day);
  return totalDays % 7; // Modulo operation - slow!
}

// Optimized: Uses affine transformation
function getDayOfWeek_optimized(
  year: number,
  month: number,
  day: number,
): number {
  const m = (month + 9) % 12;
  const y = year - Math.floor(m / 10);
  return (
    (Math.floor((13 * m - 1) / 5) +
      y +
      Math.floor(y / 4) -
      Math.floor(y / 100) +
      Math.floor(y / 400) +
      day +
      1) %
    7
  );
}

The optimized version reduces division operations and precalculates constants.

5. Development Philosophy

Performance First

Every millisecond counts. Our benchmarks target:

  • < 16ms frame time (60 FPS)
  • < 100ms calendar navigation
  • < 50ms date calculation

Developer Experience

Clean, maintainable code is as important as performance:

  • Strong typing with TypeScript
  • Comprehensive unit tests
  • Clear documentation
  • Modular architecture

User-Centric Design

Technical excellence means nothing without great UX:

  • Smooth animations
  • Intuitive gestures
  • Accessible design
  • Offline-first approach

6. Looking Ahead

This project is more than just creating another calendar app. It’s a challenge to improve traditional calendar algorithm inefficiencies, overcome native UI implementation complexity, and build the highest-performance calendar app using modern cross-platform tech stacks. My obsession with performance and technical curiosity drive this journey.

In the next episode, I’ll dive into actually setting up the project’s basic structure using Expo and TypeScript, and taking the first steps toward implementing an efficient calendar algorithm. Stay tuned!

Coming Up Next:

  • Expo project initialization
  • TypeScript configuration for optimal performance
  • First algorithm implementation and benchmarks
  • UI component architecture decisions

Follow along as we build a calendar app that doesn’t compromise on performance or developer experience.

Related Posts