我刚刚开始进行Web开发,特别是Reactjs,它引入了"客户端渲染".我想我理解客户端与服务器端渲染的概念,但我并不完全知道如何务实地理解这些概念.
例如,当我有<img src="airplane.png" />,这个图像是加载客户端还是服务器端？IE,服务器是否将图像作为原始请求的一部分返回,或者是否在服务HTML之后通过向服务器发出另一个请求来从客户端加载图像？如果我正在加载大量图像,我是否希望它们被加载到客户端或服务器端？
谢谢!
我想在序言中说，我已经查看了很多有关该主题的 stackoverflow 问题，但我本身没有发现任何“重复项”，因为它们都不包含可以解决此特定情况的解决方案。
我主要研究了如何从异步调用返回响应？，关于“异步/等待的承诺”部分将在异步函数内工作，但我正在处理的函数不是异步的，并且是我无法轻易更改的现有代码库的一部分。我无法将函数更改为异步。
关于回调的部分也不起作用，这将在下面进一步解释。无论如何，我会直接回答我的问题：
我正在通过添加异步函数调用来编辑 JavaScript 中的函数（标准函数，而不是异步函数）。我想等到异步调用完成后再从函数返回（因为异步调用的结果需要包含在返回值中）。我该怎么做呢？
我研究了使用回调，这将允许我编写保证仅在异步调用完成后运行的代码。但是，这不会中断原始函数中的程序流程，并且原始函数仍然可以在回调运行之前返回。回调允许我在异步函数之后按顺序执行某些操作，但它不允许我等待异步调用在最高级别完成。
示例代码，不会返回所需的结果：
function getPlayers() {
... other code ...
let outfieldPlayers = asyncGetOutfieldPlayersCall()
... other code ...
allPlayers.add(outfieldPlayers)
return allPlayers // the returned value may or may not include outfield players
}
我面临的实际问题有点复杂 - 我在 for 循环的每次迭代中调用异步函数，并且需要等到所有调用完成后再返回。但是，我想如果我能解决这个更简单的问题，我可以用 for 循环来解决问题。
我正在开发一个使用 Array.reduce 的函数，并且需要在 reduce 函数内添加异步 API 调用。这要求我对传入的回调使用异步函数reduce，因为我await在函数内部使用它来等待异步 API 调用。
我在正确编写归约时遇到一些问题。这是目前的情况（工作）：
const result = records.reduce((array, currValue) => {
//do stuff
return array
}, [])
这是我尝试将其更改为：
const result = records.reduce(async(array, currentValue) => {
// do stuff
someValue = await asyncCall(currentValue)
array.add(someValue)
return array
}, [])
我收到的错误是“没有与此调用匹配的重载”。
这对我来说似乎很有意义，因为reduce接受返回数组的回调，而异步函数返回回调，而不是数组。但是当我阅读如何将异步函数传递到 .reduce 的其他示例时，它们似乎都只是将异步函数传递到 reduce 中，没有任何问题。
以下是我查看的几个链接：
https://advancedweb.hu/how-to-use-async-functions-with-array-reduce-in-javascript/
JavaScript 数组 .reduce 与 async/await
https://gyandeeps.com/array-reduce-async-await/
当我将归约函数声明为异步时，我得到了不匹配重载错误，这对我来说是有意义的。我不确定这对其他人来说是否有效。