为什么这段 Javascript 代码这么慢?

2023-12-19

我有这段 Javascript 代码,在 Internet Explorer 中每次调用大约需要 600 毫秒。在其他浏览器中花费的时间可以忽略不计。

var _nvs_currentTab;
var _nvs_zoomfield;
var _nvs_centerfield;
var _nvs_globsearch;
var _nvs_category;
var _nvs_favsonly;
var _nvs_wishonly;
var _nvs_friendfavsonly;
var _nvs_newitemsonly;
var _nvs_globsearchOld;
var _nvs_catOld;
var _nvs_favsonlyOld;
var _nvs_wishonlyOld;
var _nvs_friendFavsonlyOld;
var _nvs_newItemsOnlyOld;

function saveState()
{
    if (!_nvs_currentTab)
    {
        var f = document.getElementById;
        _nvs_currentTab = f('currentTab');
        _nvs_zoomfield = f('zoomfield');
        _nvs_centerfield = f('centerfield');
        _nvs_globsearch = f("globsearch");
        _nvs_category = f("category");
        _nvs_favsonly = f("favsonly");
        _nvs_wishonly = f("wishonly");
        _nvs_friendfavsonly = f("friendfavsonly");
        _nvs_newitemsonly = f("newitemsonly");
        _nvs_globsearchOld = f("globsearchOld");
        _nvs_catOld = f("categoryOld");
        _nvs_favsonlyOld = f("favsonlyOld");
        _nvs_wishonlyOld = f("wishonlyOld");
        _nvs_friendFavsonlyOld = f("friendFavsonlyOld");
        _nvs_newItemsOnlyOld = f("newItemsOnlyOld");
    }

    // get all state vars
    var navState= new Object();
    navState.page = currentPage;
    navState.currentTab = _nvs_currentTab.value;
    navState.zoomfield = _nvs_zoomfield.value;
    navState.centerfield = _nvs_centerfield.value;
    navState.globsearch = _nvs_globsearch.value;
    navState.category = _nvs_category.value;
    navState.favsonly = _nvs_favsonly.checked;
    navState.wishonly = _nvs_wishonly.checked;
    navState.friendfavsonly = _nvs_friendfavsonly.checked;
    navState.newitemsonly = _nvs_newitemsonly.checked;
    navState.globsearchOld = _nvs_globsearchOld.value;
    navState.catOld = _nvs_catOld.value;
    navState.favsonlyOld = _nvs_favsonlyOld.value;
    navState.wishonlyOld = _nvs_wishonlyOld.value;
    navState.friendFavsonlyOld = _nvs_friendFavsonlyOld.value;
    navState.newItemsOnlyOld = _nvs_newItemsOnlyOld.value;
    // build new url with state
    var url = new StringBuffer();
    url.append("#");
    for (var i in navState)
    {
        if (i != "page")
            url.append("&");
        url.append(i).append("=").append(navState[i]);
    }
    // set it
    window.location.href = url.toString();
}

这是 IE8 分析器中的调用树的样子:

saveState               1    615,00 ms
  f                    15      1,00 ms
  String.split          1      0,00 ms
    Array               1      0,00 ms
  Object                1      0,00 ms
  StringBuffer          1      0,00 ms
  append               64      0,00 ms
    Array.push         64      0,00 ms
  toString              1      0,00 ms
    Array.join          1      0,00 ms
  Object.valueOf       63      0,00 ms
  Function.toString    63      0,00 ms

我正在使用的 StringBuffer 实现:

function StringBuffer() { 
    this.buffer = []; 
} 

StringBuffer.prototype.append = function append(string) { 
    this.buffer.push(string); 
    return this; 
}; 

StringBuffer.prototype.toString = function toString() { 
    return this.buffer.join(""); 
}; 

Edit:更新了代码,平均运行时间为 397 毫秒。

var _nvs_currentTab;
var _nvs_zoomfield;
var _nvs_centerfield;
var _nvs_globsearch;
var _nvs_category;
var _nvs_favsonly;
var _nvs_wishonly;
var _nvs_friendfavsonly;
var _nvs_newitemsonly;
var _nvs_globsearchOld;
var _nvs_catOld;
var _nvs_favsonlyOld;
var _nvs_wishonlyOld;
var _nvs_friendFavsonlyOld;
var _nvs_newItemsOnlyOld;

function saveState()
{
    if (!_nvs_currentTab)
    {
        var _f = document.guideForm;
        _nvs_currentTab = _f.currentTab;
        _nvs_zoomfield = _f.zoomfield;
        _nvs_centerfield = _f.centerfield;
        _nvs_globsearch = _f.globsearch;
        _nvs_category = _f.category;
        _nvs_favsonly = _f.favsonly;
        _nvs_wishonly = _f.wishonly;
        _nvs_friendfavsonly = _f.friendfavsonly;
        _nvs_newitemsonly = _f.newitemsonly;
        _nvs_globsearchOld = _f.globsearchOld;
        _nvs_catOld = _f.categoryOld;
        _nvs_favsonlyOld = _f.favsonlyOld;
        _nvs_wishonlyOld = _f.wishonlyOld;
        _nvs_friendFavsonlyOld = _f.friendFavsonlyOld;
        _nvs_newItemsOnlyOld = _f.newItemsOnlyOld;
    }

    // build new url with state
    var url = new StringBuffer();
    url.append("#");
    url.append('currentPage=').append(currentPage);
    url.append('&currentTab=').append(_nvs_currentTab.value);
    url.append('&zoomfield=').append(_nvs_zoomfield.value);
    url.append('&centerfield=').append(_nvs_centerfield.value);
    url.append('&globsearch=').append(_nvs_globsearch.value);
    url.append('&category=').append(_nvs_category.value);
    url.append('&favsonly=').append(_nvs_favsonly.checked);
    url.append('&wishonly=').append(_nvs_wishonly.checked);
    url.append('&friendfavsonly=').append(_nvs_friendfavsonly.checked);
    url.append('&newitemsonly=').append(_nvs_newitemsonly.checked);
    url.append('&globsearchOld=').append(_nvs_globsearchOld.value);
    url.append('&catOld=').append(_nvs_catOld.value);
    url.append('&favsonlyOld=').append(_nvs_favsonlyOld.value);
    url.append('&wishonlyOld=').append(_nvs_wishonlyOld.value);
    url.append('&friendFavsonlyOld=').append(_nvs_friendFavsonlyOld.value);
    url.append('&newItemsOnlyOld=').append(_nvs_newItemsOnlyOld.value);
    // set it
    window.location.href = url.toString();
}

好吧,你不会相信这一点。我刚刚尝试删除以下行:

window.location.href = url.toString();

它将平均运行时间减少到三分之二毫秒。从分析中我知道 toString 调用非常快,因此显然设置 window.location.href 非常慢(几百毫秒!!!)。呸,我讨厌 IE。

注意:这是 Internet Explorer 的全新安装,并且没有任何会拖慢浏览器速度的疯狂工具栏。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为什么这段 Javascript 代码这么慢? 的相关文章

  • 位置特征检测:固定

    我正在尝试找到一个脚本来检测设备是否放置position fixed元素相对于视口而不是整个文档 目前 标准桌面浏览器和 Mobile Safari 适用于 iOS 5 都是这样做的 而 Android 设备则相对于整个文档放置固定元素 我
  • jQuery .push 到 .get 调用中的数组给出空结果

    谁能告诉我为什么下面给我一个空字符串 当我console log contentArray in the get 回调函数它显示数据 但是当我尝试在下面的代码中执行它时 结果为空 sectionArray contentArray func
  • 如何使用javascript确保元素仅在圆上朝一个方向移动?

    好吧 我承认我对三角学真的很糟糕 出于上下文的考虑 我将添加我在这里提到的问题中的内容 参考问题 https stackoverflow com a 39429290 168492 https stackoverflow com a 394
  • 本地推送通知到在应用程序内运行 JS 代码的 Win8 Live Tile

    我正在尝试将更新发送到我的应用程序的磁贴 当应用程序运行时 这可以正常工作 例如 当用户单击按钮时 我可以轻松地将磁贴更新通知发送到磁贴 我无法解决的是当应用程序无法运行时如何更新磁贴 我找到的唯一选择是使用以下命令从远程 Web 服务器拉
  • 导航栏下拉菜单(折叠)在 Bootstrap 5 中不起作用

    我在尝试使用以下命令创建响应式菜单或下拉按钮时遇到问题Bootstrap 5一切似乎都正常 导航图标和下拉图标出现 但它不起作用 当我单击nav图标或dropdown按钮 无dropdown menu apears 我想特别提到的是 我还包
  • javascript 选择自定义光标 (svg)

    我正在动态地将光标更改为悬停时的本地 svg element on mouseover function this css cursor url svgs pointer svg 9 30 auto 工作正常 但我想选择该 svg 来操纵其
  • React autoFocus 将光标设置为输入值的开头

    我有一个受控输入 最初显示一个值 我已将该输入设置为自动聚焦 但当我希望它出现在末尾时 光标出现在输入的开头 我知道这可能是因为自动对焦是在值之前添加的 但我不能 100 确定 在输入字段末尾完成光标初始化的最佳方法是什么 var Test
  • JavaScript 继承;调用和原型

    要在Javascript中实现继承 通常需要执行以下两个步骤 假设我有一个基类 Animal var Animal function name this name name 我现在想从中派生一个子类 Dog 所以我想说 var Dog fu
  • 如何使用 Javascript 设置查询字符串

    有没有办法使用 javascript 设置查询字符串的值 我的页面有一个过滤器列表 单击该列表时 它将更改右侧的页内结果窗格 我正在尝试更新 url 的查询字符串值 因此如果用户离开页面 然后单击 后退 按钮 他们将返回到最后一个过滤器选择
  • 将 Firebase 云消息传递与 Windows 应用程序结合使用

    我在 Android 和 iOS 应用程序中使用 Firebase Cloud Messaging 但是我还有此应用程序的 Windows Mac OS 版本 我想保留相同的逻辑 我知道 Firebase Cloud Messaging 可
  • mongodb 聚合 - 累积字段的不同组值

    如果我有Player表格文件 name String score Int 我有Group文档 其中组代表玩家列表 groupName String players ObjectID 玩家可以属于多个组 我想做一个聚合Player文档 按以下
  • 使用 JavaScript 移动页面上的按钮

    我的按钮可以移动 但奇怪的是 我无法弄清楚偏移是否有问题 我希望我的按钮随着鼠标光标移动 但现在它的移动方式不是我想要的 有时它会消失 另外 创建的新按钮是重叠的 我不知道如何解决这个问题并拥有更好的外观 var coorA var coo
  • 在 nHibernate 关系中使用实体的 Lite 版本?

    在某些情况下 出于性能原因 创建一个实体的轻量级版本 指向同一个表 但映射的列较少 这是一个好主意吗 例如 如果我有一个包含 50 列的联系人表 并且在一些相关实体中 我可能对 FirstName 和 LastName 属性感兴趣 那么创建
  • 改变 JavaScript 中的顶部填充

    以下是我在 css 中设置顶部填充的方法 body font size font size px margin 0 padding 100px 0 20px 0 width 100 important 如何使用最简单的 javascript
  • 如何从浏览器向服务器发送“页面将关闭”消息?

    我想向每个 html 文档添加一个脚本 JavaScript 该脚本向服务器发送两条消息 页面确实打开了 页面将关闭 此消息包含页面打开的时间 打开消息应在文档加载时 或加载完成时 发送 这是简单的部分 The close message
  • 使用 Enzyme 测试 `React.createRef` api

    我想测试下面的类 它使用React createRef api 不过 快速搜索并没有发现任何这样做的例子 有人成功过吗 我该如何嘲笑裁判 理想情况下我想使用shallow class Main extends React Component
  • 将数组从 jquery ajax 传递到代码后面

    我必须将二维数组传递给在asp net网页代码后面编写的页面方法我有一个变量objList作为二维数组 我使用以下代码来实现此目的 但没有成功 并且未调用页面方法 脚本语言 function BindTable objList ajax u
  • 如何通过索引访问 JSON 对象中的字段

    我知道这不是最好的方法 但我别无选择 我必须通过索引访问 JSONObject 中的项目 访问对象的标准方法是只写this objectName or this objectName 我还找到了一种获取 json 对象内所有字段的方法 fo
  • 测量窗口偏移

    有没有一种方法可以测量 jQuery 中窗口的偏移量 以便我可以比较 固定 元素和相对定位元素的位置 我需要能够知道窗口滚动了多远 以便我可以使用该图来计算固定元素的高度 相对于视口顶部 和相对对象的高度 相对于顶部 之间的差异文件的内容
  • 使用velocity.js制作可拖动元素的动画

    我正在使用velocity js 为用户拖动的可拖动 SVG 元素设置动画 然而 velocity js 将先前的 mousemove 坐标排队并通过所有后续的 mousemove 坐标进行动画处理 我想要的是velocity js 不要对

随机推荐

  • Owin SelfHost WebApi - 客户端在响应期间关闭连接会引发异常?

    我正在运行一个基于 Owin Selfhost 的 WebApi 其中我通过以下方式放入了 API 未处理的异常记录器 config Services Add typeof IExceptionLogger apiExceptionLogg
  • rake db:test:prepare 不创建所有表

    注意 使用 Rails 3 0 7 Postgresql 8 4 4 1 rake 0 8 7 尝试让 Rails 测试正常工作 命令 rake db test prepare 似乎工作正常 rake db test prepare t i
  • 如何在html中嵌入图像并通过msdb.dbo.sp_send_dbmail将html作为电子邮件发送?

    我可以使用 msdb dbo sp send dbmail 以 html 格式发送电子邮件 仅就格式而言 它对于文本来说非常好 例如 EXEC msdb dbo sp send dbmail recipients p recipients
  • 使用不同的编码和库解析 CSV 文件

    尽管有很多关于该主题的线程 但我在解析 CSV 时遇到了麻烦 它是从 Adwords 关键字规划器下载的 csv 文件 以前 Adwords 可以选择将数据导出为 纯 CSV 可以使用 Ruby CSV 库进行解析 现在可以选择 Adwor
  • 是否存在不应在 .pch 文件中添加所有导入的原因?

    我主要指的是应用程序级导入 而不是构建库时的导入 在这种情况下 很明显为什么应该避免导入 pch 文件内的标头 要点是 pch文件的优点是它可以预编译一次并且无需处理 如果您将所有应用程序标头导入 pch 每次更改其中任何一个标头时都必须重
  • 如何创建具有多个子行(嵌套表)的 jQuery 数据表?

    问题 我需要创建一个具有嵌套表格式的表 当用户单击加号按钮时 它应该显示嵌套表 如果他们点击减号按钮 它应该隐藏 我已经完成了jquery datatable 它工作正常 但我无法显示子表的多行 我已经尝试了很多次 但无法显示正确的格式 这
  • 如何在每个循环周期更新一步进度条? C#

    使用 C Windows 窗体创建 net 应用程序 如何在 100 个循环的每个循环中更新进度条 1 步 我正在循环中处理 Excel 工作表 进度条控件位于 UI 类中 该类连接到控制器类 该控制器类连接到自定义类 MVC 模式 循环位
  • XSLT:如何通过另一个节点查找该节点的值

    我不确定我是否正确地提出了这个问题 这就是为什么我在任何地方都找不到答案 但基本上我需要将一个节点与另一个节点进行匹配 并使用同级节点作为值 这是一个例子
  • Angular 6 中使用 Typescript 进行 Datalayer.push

    当我点击按钮时 我应该发送到数据层信息 但我不知道该怎么做 因为我使用的是 Angular 6 所以我需要使用 Typescript 和 window dataLayer push 不起作用 给我这个错误 Form
  • 如何检测 iOS 8 中 UITextField 上的删除键?

    我对 UITextField 进行了子类化 并实现了 UIKeyInput 协议的 deleteBackward 方法来检测按下的退格键 这在 iOS 7 上工作正常 但在 iOS 8 上不行 当我按退格键时 UITextField 上不再
  • 删除溢出的内联元素行之间的边距

    我正在创建一个基于图块的游戏 并使用块渲染来更新大量图块 我试图以最简单的方式做到这一点 所以我一直在尝试使用 HTML 的默认布局 现在我正在创建 内联块 省略元素之间的空白以避免它们之间的水平空间 但是当块溢出并创建新行时 会有一些垂直
  • 如何在 Swift 中更改 UIBezierPath 的颜色?

    我有一个实例UIBezierPath我想将描边的颜色更改为黑色以外的颜色 有谁知道如何在 Swift 中做到这一点 有了 Swift 5 UIColor has a setStroke https developer apple com d
  • 过滤 Chrome 控制台消息

    有没有办法在 Chrome 控制台中过滤消息 例如 我不想看到来自 包含 JQMIGRATE 的消息 您可以通过在前面添加来否定过滤器 例如 JQMIGRATE将排除包含字符串 JQMIGRATE 的消息 正则表达式过滤器也可以通过这种方式
  • 自动装配依赖项注入失败

    我在 Java EE 应用程序中使用 Spring 和 Hibernate 该项目托管于这个 GitHub 存储库 http github com whirlwin niths 我通过服务使用 Autowired 时遇到问题 如下所示 pa
  • Django 信号 - kwargs['update_fields'] 在通过 django admin 进行模型更新时始终为 None

    我的 django 应用程序中有一个信号 我想检查模型中的某个字段是否已更新 以便我可以继续执行某些操作 我的模型看起来像这样 class Product models Model name models CharField max len
  • Auth::attempt() 在 Laravel 5.5 中不起作用

    我的注册表单正在运行 它将用户存储到数据库 但是当用户登录时 Auth attempt 返回 false 这是我的登录代码 我将密码以 sha1 加密形式存储在 db 中 Route post login function creds ar
  • 将 Pip 包传输到 conda

    我目前正在使用一台共享的 Ubuntu 机器 其中有蟒蛇2 7以及通过安装的多个软件包pip python version Python 2 7 12 pip version pip 18 0 from usr local lib pyth
  • 验证十进制数

    我正在阅读一些 csv 文件 其中包含表示十进制数的字符串 我的麻烦是 很多时候我接收使用不同区域设置的文件写入 例如 file1 csv的price列的值为129 13 是小数点分隔符 file1 csv的price列值为129 13 为
  • 如何计算密码学中的对数?

    我正在尝试对字节执行非线性函数来实现 SAFER 该算法需要计算字节的以 45 为底的对数 我不明白如何做到这一点 log45 201 1 39316393 当我将其分配给一个字节时 该值被截断为 1 并且我无法恢复确切的结果 我该怎么处理
  • 为什么这段 Javascript 代码这么慢?

    我有这段 Javascript 代码 在 Internet Explorer 中每次调用大约需要 600 毫秒 在其他浏览器中花费的时间可以忽略不计 var nvs currentTab var nvs zoomfield var nvs