Optimizing Performance in Angular with C# Web API Backend

[carljames5]

We’re facing performance issues with our Angular frontend and C# backend as data grows. The UI is sluggish with large datasets, and backend API calls are slow due to inefficient queries.

Questions:

1. Angular Frontend:

• How can I optimize large data handling in Angular? Should I use virtual scrolling or pagination?
• What are the best practices for improving change detection with large data sets?

2. C# Backend:

• How can I optimize SQL queries and improve API response times for large datasets?
• What’s the best way to implement caching and pagination in the backend?

3. General Architecture:

• Should I move data processing to the backend or use GraphQL for more efficient data fetching?

[blockcharming]

1. Angular Frontend:

• Large Data Handling: Use virtual scrolling or pagination (Angular CDK) to improve performance.
• Change Detection: Apply OnPush change detection and use trackBy for ngFor to optimize rendering.

2. C# Backend:

• SQL Optimization: Avoid N+1 queries. For large datasets, consider raw SQL or stored procedures.
• Caching & Pagination: Implement Redis for caching and use skip/limit or keyset pagination for efficient data retrieval.

3. General Architecture:

• Offload heavy processing to the backend and consider GraphQL if you need precise data fetching.

[carljames5]

Solved