0

我有一次机会在页面的 DOM被设置样式、渲染和显示给用户之前对其进行操作。显然,我很乐意在这个窗口中做所有的动态有趣的事情,因为在页面呈现之后 DOM 操作非常昂贵。由于这主要针对移动设备,因此这种优化对我来说很有价值。

这是一个基本概述/时间表:

function CalledBeforePageRendered(){
    DoAsyncDataBaseWorkWithCallBack(AsyncDataBaseCallBack);
    DoLocalizationsAndOtherSYNCRONOUSActions();
}


function AsyncDataBaseCallBack(results){
    // code that processes the results element
    // code that manipulates the DOM *before* it's styled.
}

问题是DoAsyncDataBaseWorkWithCallBackDoLocalizationsAndOtherSYNCRONOUSActions 快速完成然后CalledBeforePageRendered返回并应用后续样式。

应用样式后,页面将显示给用户......然后AsyncDataBaseCallBack被调用,然后应用 div 标签和其他 DOM 修改。只是,我需要在风格化之前进行这些修改

有什么办法可以让' CalledBeforePageRendered'等待' AsyncDataBaseCallBack'完成后再返回?我知道闭包通常可以在这里工作,但我不知道如何使闭包与在CalledBeforePageRendered函数外部定义的回调一起工作。

4

1 回答 1

1

如果您尝试执行同步 JavaScript XmlHttpRequest (XHR) 调用 - 这是非常可能的,但假设您尝试在呈现页面之前在客户端操作 DOM - 为什么不在服务器端执行此操作(因为它首先生成 HTML)。如果不能,我强烈建议您不要在页面呈现之前执行同步 JavaScript XHR 来更新页面。这样做会在 XHR 运行时锁定浏览器窗口,这不仅会显着增加页面加载延迟 - 它还会让最终用户感到沮丧(因为他们遇到了看似硬“锁定”的情况)。在渲染之前操作 DOM 并没有那么昂贵。它'

再次 - 我只想强调 - 尝试在服务器端(而不是客户端)完成这项工作。如果您不能并且需要将其作为辅助调用执行 - 添加加载图像并让 XHR 像大多数 JavaScript 库一样异步运行,无论如何都会强制执行。如果我误解了你的目标,请告诉我。

于 2012-07-12T19:11:46.177 回答