【问题标题】:Is console unnecessary Error Message slowing the webpage?控制台不必要的错误消息是否会减慢网页速度?
【发布时间】:2021-05-26 16:52:45
【问题描述】:

我正在使用 Handsontable 在我的网页中显示一些表格,它工作正常,但随着时间的推移,当客户端离开页面时,页面挂起会累积错误,例如

(我无法上传图片,但消息是这样的)

387 handsontable.full.min.js:34 Uncaught TypeError: Cannot read property 'querySelector' of null
    at t.overlayContainsElement (handsontable.full.min.js:34)
    at n.value (handsontable.full.min.js:34)
    at n.value (handsontable.full.min.js:40)
    at n.value (handsontable.full.min.js:40)
    at HTMLDivElement.<anonymous> (handsontable.full.min.js:40)
    at HTMLDivElement.i (handsontable.full.min.js:34)

它是否会导致页面变得比初始速度慢?

这是我的代码中的handsontable部分


function table(data){
try {
    document.getElementById('data_view').innerHTML = null;
    const container = document.getElementById('data_view');
    hot = new Handsontable(container, {
    licenseKey: 'non-commercial-and-evaluation',
    data: data,
    //rowHeaders: true,
    colHeaders: 
 ['Area','WorkStation','Stepname','Commit','TechNode','Moves','WIP','Running','Hold','MTAS','Delta to Commit','Remarks','Delta to Commit'],
    //editor: false,
    columns: function(column) {
    var columnMeta = {};
    if (column === 0) {
      columnMeta.data = 'AreaName';
    } else if (column === 1) {
      columnMeta.data = 'workstation';
    } else if (column === 2) {
      columnMeta.data = 'Stepname';
    } else if (column === 3) {
      columnMeta.data = 'Commit';
    } else if (column === 4) {
      columnMeta.data = 'TechNode';
    } else if (column === 5) {
      columnMeta.data = 'Moves';
    } else if (column === 6) {
      columnMeta.data = 'Wip';
    } else if (column === 7) {
      columnMeta.data = 'Running';
    } else if (column === 8) {
      columnMeta.data = 'Hold';
    } else if (column === 9) {
      columnMeta.data = 'MTAS';     
    } else if (column === 10) {
      columnMeta.data = 'Delta to Commit';
    } else if (column === 11) {
      columnMeta.data = 'Remark';
      columnMeta.readOnly = false;
    }
    return columnMeta;
    },
    readOnly: false,
    overflow: 'hidden',
    contextMenu: true,
    afterSelection: function(r,c){
    selection = this.getDataAtRow(r);
    //localStorage.setItem("selection", selection);
    //sessionStorage.setItem("selection2", selection);
    //onsole.log(data)
    },
    contextMenu: {
    items: {
        'row_above': {},
        'row_below': {},
        'col_left': {},
        'col_right': {},
        'remove_row': {},
        'remove_col': {},
        'undo': {},
        'redo': {},
        'make_read_only': {},
        'alignment': {},
        'copy': {},
        'export': {
            name: 'Export to CSV',
            callback: function(key, options) {
            hot.getPlugin('exportFile').downloadFile('csv', {
            columnHeaders: true,
            overflow: 'hidden',
            filename: 'Commit_Download_' + JSON.stringify(sqlrefresh[0].last_refresh)
            })}
        },
        'lot_id_list': {
          name: 'Check Lot',
          callback: function() {
window.open("http://mfgrpa2:4000/lot_list?"+"Step="+selection[2].toString()+"Technode="+selection[4].toString(), "lot_list", "width=1500");
          }
        }
    }},
    dropdownMenu: true,
    filters: true,
    manualColumnResize: true,
    manualRowResize: true,
    columnSorting: true,
    formulas: true,
    minRows: 2,
    minCols: 12,
    minSpareRows: 1,
    //maxCols: 3,
    //colWidths: '100',
    //height: 320,
    //afterGetColHeader: addInput,
    cells: function (row, col) {
    var cellProperties = {};
    const cellValue = this.instance.getDataAtCell(row, col);
    if (col === 10){
        if ( cellValue > 0 ) {
          cellProperties.renderer = function (instance, td, row, col, prop, value, cellProperties) {
              Handsontable.renderers.TextRenderer.apply(this, arguments);
              td.style.fontWeight = 'bold';
              td.style.color = 'black';
              td.style.background = '#4FF635';
          }
        }
        else if ( cellValue < 0 ) {
          cellProperties.renderer = function (instance, td, row, col, prop, value, cellProperties) {
              Handsontable.renderers.TextRenderer.apply(this, arguments);
              td.style.fontWeight = 'bold';
              td.style.color = 'black';
              td.style.background = '#C84321';
          }
        }
        else {
        }
    }
    return cellProperties;
    }
    });
    }
    catch(e){
    }}

谢谢。

【问题讨论】:

  • querySelector 似乎没有在提供的代码中的任何地方使用。
  • 没有“不必要的错误信息”,它们都表明在JS执行过程中发生了错误。错误消息也不会减慢网页速度。您的代码中的错误消息来自 handsontable 库,可能的原因是您没有将库所需的所有信息传递给它的某些函数。

标签: javascript html node.js handsontable


【解决方案1】:

通常这对网站的性能来说不是问题,只是它不美观或不专业。您应该尝试修复错误或寻找其他解决方案。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-10-03
    • 1970-01-01
    • 1970-01-01
    • 2022-06-10
    • 1970-01-01
    • 2020-10-20
    • 1970-01-01
    相关资源
    最近更新 更多