promise.allsettled

Promise.allSettled 是 JavaScript 中的一个函数，它接收一组 Promise 并等待它们全部完成（无论是 resolved 或是 rejected），然后返回一个包含每个 Promise 结果的数组。这个函数本身并不直接提高页面加载速度，但它可以在某些情况下帮助我们优化代码逻辑，间接地提升性能。以下是一些使用 Promise.allSettled 可能有助于提高页面加载速度的场景：

1. 并行加载资源：如果你的页面加载依赖于多个异步操作，比如从多个服务器加载数据或资源，使用 Promise.allSettled 可以同时开始这些操作，而不是顺序执行，这样可以减少总的等待时间。

2. 错误处理：使用 Promise.allSettled 可以在所有 Promise 完成后统一处理错误，而不是在每个 Promise 中单独处理，这可以减少代码的复杂性并可能提高性能。

3. 优化依赖关系：如果某些异步操作之间存在依赖关系，但并非所有操作都依赖于前一个操作的结果，使用 Promise.allSettled 可以同时开始这些操作，而不是等待前一个操作完成后才开始下一个。

4. 提高代码的可读性和维护性：通过将多个异步操作封装在 Promise.allSettled 中，可以使代码更加清晰，更易于维护，间接地提高开发效率和减少错误，从而可能提高页面的整体性能。

5. 避免不必要的等待：如果你需要加载多个资源，但只有部分资源是首屏必需的，你可以先加载首屏必需的资源，其他资源可以在后台通过 Promise.allSettled 异步加载，这样用户可以更快地看到页面的首屏内容。

6. 资源加载策略：在某些情况下，你可能需要根据某些条件动态地决定是否加载某些资源。使用 Promise.allSettled 可以在这些条件满足后并行地加载资源，而不是顺序加载。

使用 Promise.allSettled 的示例代码如下：

Promise.allSettled([
  fetch('/api/data1'),
  fetch('/api/data2'),
  fetch('/api/data3')
]).then(results => {
  results.forEach((result, index) => {
    if (result.status === 'fulfilled') {
      console.log(`Data ${index + 1} loaded successfully`);
      // 处理加载的数据
    } else {
      console.error(`Data ${index + 1} failed to load`);
      // 处理错误情况
    }
  });
});

在这个例子中，我们并行地加载了三个 API 数据，然后统一处理每个请求的结果。这种方法可以减少等待时间，并允许你统一处理所有请求的结果，无论它们是成功还是失败。