Fetch / XHR: Параллельно и последовательно (async/await)

Параллельно: Независимые запросы запускаем одновременно через Promise.all — это сокращает время ожидания страницы.

async function loadDashboard() {
	const [profile, notices, orders] = await Promise.all([
		fetchJson('/api/profile'),
		fetchJson('/api/notices'),
		fetchJson('/api/orders?limit=10')
	]);
	return {profile, notices, orders};
}

Последовательно: Если результат первого нужен для второго, выполняем по цепочке — читаемо и безопасно.

// Последовательно (второй зависит от первого)
async function loadUserOrders(userId) {
	if (!userId) throw new Error('userId обязателен');
	const user = await fetchJson(`/api/users/${encodeURIComponent(userId)}`);
	return fetchJson(`/api/orders?owner=${encodeURIComponent(user.id)}`);
}
  • Не смешивайте независимые и зависимые запросы в одну кучу — разделяйте.
  • Добавляйте обработку ошибок и частичный рендер (skeletons), чтобы UI не «прыгал».
1.2 г. Просмотров: 368
Материал помог? Оценка помогает находить устаревшие и спорные решения.

Комментарии

0

Нашли ошибку или хотите дополнить материал?

Комментариев пока нет.Можно первым дополнить материал или сообщить об ошибке.
Telegram