控制台不必要的错误消息是不是会减慢网页速度？

Posted 2023-03-07

【中文标题】控制台不必要的错误消息是不是会减慢网页速度？

【英文标题】：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 库，可能的原因是您没有将库所需的所有信息传递给它的某些函数。

【参考方案1】：

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