Hackforge Academy

Explanation

Use pagination to load limited rows instead of loading all 1000 records at once. Example: load 20 rows per page.

Code:

GET /users?page=1&limit=20

Explanation

Use lazy loading or infinite scroll to fetch more data only when the user scrolls down.

Code:

window.addEventListener
('scroll', loadMoreData);

Explanation

Use virtualization libraries like react-window or react-virtualized to render only visible rows in the UI.

Code:

import { FixedSizeList as List } 
from 'react-window';

Explanation

Add backend filtering and search to reduce the amount of data sent from the database.

Code:

db.users.find({ name: /john/i }).limit(20)

Explanation

Use database indexing for frequently searched columns to improve query speed.

Code:

db.users.createIndex({ email: 1 })