如何释放浏览器 js内存的问题？

Question

前后端不分离项目
像这样每个功能模块对应的前端代码大概都是这样的结构，
通过$('#content').html(dom)嵌入

<div>
    <!--视图-->
    ......
</div>
<script>
    // 业务逻辑
    var test = {
        name: 'test'
    }
</script>

每次切换时，上次模块的变量还是存在的，但是我想主动释放的
如何在当前模块切换时，主动释放对应的内存

Answer 1

<div>
    <!--视图-->
    ......
</div>
<script>
    (function(){
        // 业务逻辑
        var test = {
            name: 'test'
        }
    })()
</script>

Answer 2

不用释放，每次执行$('#content').html(dom)，就已经将content中的内容重置了。而且模板数据是发送到客户端的，服务端不占内存。

Answer 3

你考虑的主要是 js对象所占用的内存?
这一块的话,如果你没有大的对象,比如大数组什么的,其实不管也无妨.如果有,替换视图后设为null消除引用,浏览器会在合适的时候回收.
如果你很在意这个问题,然后本身这种模式也可以带来变量命名的各种混乱,可以考虑用类对象来管理每个content
比如A视图,你的代码可能是

let APage=function (){
    //这个content的逻辑全部在这里
 this.data = [];
 this.outHtml=function (){
        return "<h1>XCX</h1>>"
 }
    this.destroy=function (){
        //可能需要解绑的事件,要做的一切 等等
 }
}
let page =new APage();
page.outHtml();
//切换视图后
page.destroy();
page = null;
let b =new BPage();

Answer 4

确保被替换掉的 DOM 没有引用，没有未移除的事件侦听器，即可以被 GC 回收，然后等着 GC 自动回收即可。

Answer 5

JS 中唯一可以手动回收内存的场景，可能只有使用 ArrayBuffer.transfer 缩短 ArrayBuffer 长度。
不过这个方法有两个缺点：

1. 目前没有浏览器支持（caniuse 和 browser-compat-data 都找不到）；
2. 使用受限，不能用 ArrayBuffer 代替任何 BOM 实例。

Answer 6

你要果断些，直接关闭浏览器，就释放内存了！！！（手动滑稽），如果还不会就看上面的回答