大致相同的处理，为什么消耗的内存却差很多

Question

现状描述
1.使用了datatable.js,用来表示1.4万条数据。
2.ajax取的数据也大致一样
3.俩个画面表示的时间也基本一样。

为什么画面A要比画面B花的内存多很多
画面A

画面B

想请教占用内存大小的问题，不是时间的问题，画面表示时间没有问题。

Answer 1

特别感谢TensionMax的回复。
现在已经找了导致消耗大量内存的处理地方。
datatable.js有个columnDefs的属性，用来设置表的表示项目。
修改前代码是这样的:

mainCols = [{
            targets: 0,
            data: 'logon',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 1,
            data: 'last_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 2,
            data: 'first_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 3,
            data: 'group_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 4,
            data: 'user_id',
            visible: false,
            searchable: false
        }, {
            targets: 5,
            data: 'group_id',
            visible: false,
            searchable: false
        }, {
            targets: 6,
            data: 'bottom_group_id',
            visible: false,
            searchable: false
        }]

修改以后是这样的

    mainCols = [{
            targets: 0,
            data: 'logon',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 1,
            data: 'last_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 2,
            data: 'first_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }, {
            targets: 3,
            data: 'group_name',
            searchable: true,
            render: function (value, type, row) {
                return sanitize(value);
            },
            className: 'tooltip_div'
        }],

一般的话，从第4-6这三项因为设置了不可见，所以就忽略了。
实际上在表示大量数据的时候（我的项目是2万左右），这些项目都会占用很大的内存开销。
所以如果画面表示不需要的话，最好不要写。

还有就是扩展方法里不写的项目也能正常取到（rowData），不用担心。

    $.fn.dataTable.ext.search.push(
        function (settings, searchData, index, rowData, counter) {

Answer 2

这得看代码是不是新增什么变量，并且没有摧毁，造成内存占用过大，单纯这样看是看不出来的，按F12看看什么原因

Answer 3

这个问题通过“望”我实在是“望”不出来啥。。还得配合“闻问切”才行。。