Question

我有一个自定义浏览器插件（使用FireBreath构建），它将调用用户计算机上的本地进程并将stdout传递回浏览器，为此我正在通过popen（）调用运行该进程，因为我从管道读取数据我触发JSAPI事件并将其发送回浏览器。

在浏览器中，我将输出作为预先格式化的文本附加到div，并告诉div滚动到底部。

浏览器插件中的代码：

FILE* in;
if(!(in = _popen(command_string, "r")))
{
    return NULL;
}

while(fgets(buff, sizeof(buff), in)!=NULL)
{
    send_output_to_browser(buff);
}

HTML＆amp;的JavaScript / jQuery的：

<pre id="sync_status_window" style="overflow:scroll">
    <span id="sync_output"></span>
</pre>


var onPluginTextReceived = function (text)
{
    $('#sync_output').append(text);   
    var objDiv = document.getElementById('sync_status_window');
    objDiv.scrollTop = objDiv.scrollHeight;
}

此方法适用于我需要的浏览器（这是一个有限的使用内部工具），但它令人沮丧地迟滞。我的进程通常在输出窗口完成滚动之前大约30-60秒完成。那么，我该如何提高效率呢？有没有更好的方法将此文本传回浏览器？

Answer 1

我认为有两种可能的优化：

保留对你的前和跨度的参考，你不断重复dom 树搜索，这是非常昂贵的
将输出组合在一起 - 无论是在C侧（首选）还是在JS上侧。

对于快速入侵（不删除对jquery的依赖，应该这样做）可能看起来像

//Higher or global scope
var pluginBuffer=[];
var pluginTimeout=false;
var sync_status_window=document.getElementById('sync_status_window');

function onPluginTextReceived(text)
{
    pluginBuffer[pluginBuffer.length]=text;
    if (!pluginTimeout) pluginTimeout=window.SetTimeout('onPluginTimer();',333);
}

function onPluginTimer()
{
    var txt=pluginBuffer.join('');
    pluginBuffer=[];
    pluginTimeout=false;
    $('#sync_output').append(text);
    sync_status_window.scrollTop = sync_status_window.scrollHeight;
 }

根据您的需求，我选择333ms进行3次更新/秒

在浏览器窗口中高效滚动管道输出

1 个答案: