Angular, RxJS, and change detection fundamentals

Interview framing: Tenable roles mention Angular heavily, so show that you understand Angular as an architecture: components for UI, services for shared logic/data, and RxJS for async streams.

Core concepts:

1. Components:

• Own template, styles, inputs/outputs, and local UI behavior.
• Prefer presentational components for reusable UI and container components for data orchestration.

2. Services and DI:

• Services hold shared data access, business logic, and integrations.
• Dependency injection makes services testable and replaceable.

3. Observables:

• HTTP, route params, forms, and UI events can be modeled as streams.
• Use async pipe where possible so Angular handles subscription cleanup.

4. RxJS operators:

• map transforms values.
• switchMap cancels stale async work, great for search inputs.
• mergeMap runs concurrent work.
• concatMap preserves order.
• catchError handles stream errors.

5. Change detection:

• Angular checks bindings when async events happen.
• OnPush improves performance by checking components mainly when inputs change, events fire, or observables emit.

6. Performance:

• Use trackBy in ngFor.
• Avoid expensive template functions.
• Split large components.
• Lazy-load feature modules/routes.

Common follow-up: Q: How do you prevent memory leaks? A: Prefer async pipe; otherwise unsubscribe with takeUntilDestroyed, takeUntil, or framework lifecycle helpers.