Tips
開発Tips(2025-09-06)
JavaScriptにおける非同期処理は、パフォーマンスに大きな影響を与えます。本Tipsでは、`Promise.all`を用いた効率的な非同期処理の方法を紹介します。複数の非同期操作を並列に実行し、処理時間を短縮することで、ユーザー体験を向上させることができます。
今日の開発Tips:JavaScriptにおける非同期処理の最適化
JavaScriptにおける非同期処理は、パフォーマンスに大きな影響を与えます。本Tipsでは、Promise.allを用いた効率的な非同期処理の方法を紹介します。複数の非同期操作を並列に実行し、処理時間を短縮することで、ユーザー体験を向上させることができます。
並列処理による非同期APIコールの高速化
複数のAPIコールを同時に実行することで、レスポンス時間を短縮できます。Promise.allを使用すると、複数のPromiseを同時に実行し、全てが完了した後に結果を取得できます。
async function fetchData() {
const urls = [
'https://api.example.com/data1',
'https://api.example.com/data2',
'https://api.example.com/data3',
];
try {
const results = await Promise.all(urls.map(url => fetch(url).then(res => res.json())));
console.log(results); // 各APIからのレスポンスが配列として格納される
} catch (error) {
console.error('Error fetching data:', error);
}
}
fetchData();
注意点:Promise.allは、全てのPromiseが解決するか、または1つでも拒否された時点で処理が完了します。エラー処理を適切に行うことが重要です。 また、API側が同時アクセスに耐えられない場合は、適切なレート制限やエラーハンドリングが必要です。 Promise.allSettledを使うことで、全てのPromiseの結果(成功、失敗問わず)を取得できます。状況に応じて使い分けることをお勧めします。