【问题标题】:How to optimise ram memory consumption by javascript web application如何通过 javascript Web 应用程序优化 ram 内存消耗
【发布时间】:2016-11-08 11:39:41
【问题描述】:

我的 javascript Web 应用程序异常消耗超过 4gb 的 ram 内存,当我启动应用程序时,内存消耗量为 700 到 800MB,而对应用程序执行任何操作一段时间后,ram 内存消耗立即飙升。 什么可能是它的根本原因,我怎样才能让我的应用程序消耗 400 到 500MB 的内存。

【问题讨论】:

  • 您的软件使用内存的方式有无数种。除了你之外,世界上没有人知道它的作用或工作原理。
  • 您可以尝试使用您喜欢的浏览器的内置分析器来分析您的应用程序
  • 欢迎来到 SO。请访问help center 并使用tour 了解询问内容和方法。目前您的问题不在主题范围内,可能会被否决并关闭

标签: javascript memory-management memory-leaks


【解决方案1】:

无法回答您的问题,它很宽泛,而且我们不知道您的代码(出于显而易见的原因,我们不会全部阅读)。但我认为你应该在 Google Chrome 开发者网站上阅读这篇关于 javascript 优化的文章。

您应该分析哪些函数使用的内存最多,并指出问题以找出可能的内存泄漏和/或优化代码。

https://developers.google.com/speed/articles/optimizing-javascript

优化 JavaScript 代码

作者:Gregory Baker,GMail 软件工程师和 Erik Arvidsson, Google Chrome 上的软件工程师

推荐经验:JavaScript 的工作知识

客户端脚本可以使您的应用程序动态和活跃, 但是浏览器对这段代码的解释可以自己引入 效率低下,并且不同构造的性能各不相同 从客户到客户。在这里,我们讨论一些技巧和最佳实践 优化您的 JavaScript 代码。

定义类方法

以下是低效的,因为每次 baz.Bar 的实例 构造,为 foo 创建一个新函数和闭包:

baz.Bar = function() { // 构造函数体 this.foo = function() { // 方法体 }; } 首选方法是:

baz.Bar = function() { // 构造函数体 };

baz.Bar.prototype.foo = function() { // 方法体 };有了这个 方法,无论构建了多少 baz.Bar 实例, 只为 foo 创建了一个函数,并且没有闭包 已创建。

初始化实例变量

在原型上放置实例变量声明/初始化 例如具有值类型(而不是引用类型)的变量 初始化值(即类型 number、Boolean、null、 未定义或字符串)。这样可以避免不必要地运行 每次调用构造函数时的初始化代码。 (这个不能 对初始值取决于的实例变量进行 构造函数的参数,或其他状态 建设。)

例如,而不是:

foo.Bar = function() { this.prop1_ = 4; this.prop2_ = true;
this.prop3_ = []; this.prop4_ = '废话'; };使用:

foo.Bar = function() { this.prop3_ = []; };

foo.Bar.prototype.prop1_ = 4;

foo.Bar.prototype.prop2_ = true;

foo.Bar.prototype.prop4_ = 'blah';使用闭包避免陷阱

闭包是 JavaScript 的一个强大而有用的特性;然而, 它们有几个缺点,包括:

它们是最常见的内存泄漏源。创建一个闭包是 比在没有 a 的情况下创建内部函数要慢得多 闭包,并且比重用静态函数慢得多。例如:

function setupAlertTimeout() { var msg = '消息提醒';
window.setTimeout(function() { alert(msg); }, 100); } 慢于:

函数 setupAlertTimeout() { window.setTimeout(function() { var msg = '要提醒的消息'; 警报(味精); }, 100); } 慢于:

function alertMsg() { var msg = '消息提醒';警报(味精); }

函数 setupAlertTimeout() { window.setTimeout(alertMsg, 100); } 它们为范围链添加了一个级别。当浏览器解析 属性,必须检查范围链的每个级别。在里面 下面的例子:

var a = 'a';

函数 createFunctionWithClosure() { var b = 'b';返回 功能 () { var c = 'c'; 一种; 乙; C; }; }

var f = createFunctionWithClosure(); F();当 f 被调用时, 引用 a 比引用 b 慢,后者慢于 引用 c.请参阅 IE+JScript 性能建议第 3 部分: 关于何时使用闭包的信息的 JavaScript 代码效率低下 用 IE。

避免

避免在代码中使用 with。它对 性能,因为它修改了作用域链,使其更昂贵 在其他范围内查找变量。

避免浏览器内存泄漏

内存泄漏是 Web 应用程序中非常常见的问题,并且 可能会导致巨大的性能损失。由于内存使用 随着浏览器的增长,您的 Web 应用程序以及其他用户的 系统,变慢了。 Web 应用程序最常见的内存泄漏 涉及 JavaScript 脚本引擎和 实现 DOM 的浏览器的 C++ 对象(例如,在 JavaScript 脚本引擎和 Internet Explorer 的 COM 基础结构, 或在 JavaScript 引擎和 Firefox XPCOM 基础架构之间)。

以下是一些避免内存泄漏的经验法则:

使用事件系统附加事件处理程序

最常见的循环引用模式 [ DOM 元素 --> 事件 handler --> 闭包范围 --> DOM ] 元素在这个 MSDN 中讨论 博客文章。为避免此问题,请使用经过充分测试的事件之一 用于附加事件处理程序的系统,例如 Google doctype 中的那些, Dojo 或 JQuery。

此外,使用内联事件处理程序可能会导致另一种 在 IE 中泄漏。这不是常见的循环引用类型泄漏,而是 而是内部临时匿名脚本对象的泄漏。为了 详情请参阅“DOM 插入订单泄漏模型”一节 了解和解决 Internet Explorer 泄漏模式和 本 JavaScript Kit 教程中的示例。

避免展开属性

Expando 属性是 DOM 元素上的任意 JavaScript 属性 并且是循环引用的常见来源。您可以使用扩展 属性而不引入内存泄漏,但很容易 不小心介绍了一个。这里的泄漏模式是 [ DOM element --> 通过expando--> 中间对象--> DOM 元素]。最好的东西 要做的就是避免使用它们。如果您确实使用它们,请仅使用值 与原始类型。如果您确实使用非原始值,请取消 不再需要时扩展属性。请参阅关于 理解和解决 Internet Explorer 中的“循环引用” 泄漏模式。

【讨论】:

  • 这不是解释,而是复制粘贴 - 为什么不在评论中链接到该网站?
  • 我从来没有说过这是转述。我使用引文来引用,甚至包括在帖子的顶部,您可以在其中看到作者。此外,链接可能会消失,而不是引用。使用 Stack Overflow 上的链接回答是一种非常糟糕的做法。
猜你喜欢
  • 1970-01-01
  • 2016-10-08
  • 2014-03-08
  • 2012-04-05
  • 1970-01-01
  • 2011-06-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多