Question

假设我正在使用domain.com/1/?nick=lili

加载网络

现在，我要在html中添加多个文件，其中一个是我要做的：

$(document).ready(function(){

         let path = window.location.href ;
         let nick = path.split('=')[1];
         getData(nick,loadUI);

});

使用快速服务器（Google's Firebase）仍然会有相当长的延迟，大约1-2秒，而此时页面装有占位符，因此没有数据，因此体验是不好。

我不想放一个加载程序UI元素，但要加载得更快。

代码中是否还有其他地方可以用来加快处理速度？（假设我还需要在主体上加载Google的服务器API）。

将所有这些都删除到head上会更好吗？

Answer 1

window.location.href将在页面加载时填充-无需等待检查。由于getData不需要页面上的任何数据即可启动请求，因此您可以将其移至$(document).ready(之外，甚至将其移至顶部。 <head>中的文档，在运行任何其他脚本或加载元素之前。这样可以确保尽快发送请求。

但是

当有人打开页面时，所有html占位符（文本和照片）均已加载，然后我需要用数据库中的数据填充它们

由于您需要在请求返回时加载页面，因此不能仅单独调用getData，在极少数情况下，页面到那时还没有完成加载。因此，如果您更改getData以返回可解析为所需数据的Promise，则可以使用Promise.all等待数据和加载页面，之后，您可以填充页面元素：

Promise.all([
  getData(nick,loadUI),
  new Promise(res => window.addEventListener('DOMContentLoaded', res))
])
  .then(([data]) => {
    // Populate page with data from request
  });

从URL参数更快地加载数据

1 个答案: