Architecting a Real-Time Resume Optimization Engine

Building CareerKor wasn't just about integrating an LLM; it was about solving the "input lag" problem in complex React states.

The Challenge

When a user types in their resume, we need to:

1. Parse the structure.
2. Send it to our scoring engine.
3. Highlight issues in real-time.

Doing this naively causes the UI to freeze because of intensive React re-renders.

The Solution: State Normalization

We moved away from a deeply nested object to a flat, normalized state using Redux Toolkit.

// Before
const resume = {
  education: [{ school: "RUET", degree: "Mechatronics" }],
  experience: [...]
};

// After (Normalized)
const resume = {
  educationIds: ["edu_1"],
  educationEntities: {
    "edu_1": { school: "RUET", ... }
  }
}

This reduced our render cycle from ~120ms to under 16ms, providing a "zero-lag" experience for the user.

Conclusion

Performance is a feature. In the world of AI-driven tools, the responsiveness of the UI is what builds trust with the user.