Uploaded image for project: 'ZABBIX BUGS AND ISSUES'
  1. ZABBIX BUGS AND ISSUES
  2. ZBX-21949

List with too many macros affecting browser performance

XMLWordPrintable

    • Icon: Incident report Incident report
    • Resolution: Unresolved
    • Icon: Trivial Trivial
    • None
    • 6.0.9
    • Frontend (F)
    • None

      Hi.

      We noticed performance issues when listing a large number (150-300+) of host macros in the web frontend, which takes around 30-40 seconds to load when pressing "Inherited and host macros" button (higher values even crash the page just by clicking on the Macros tab, depending on the hardware running the browser). Further analysis on our side revealed that the problem is caused by neither the database, nor by the frontend web server, but actually by the JavaScript code causing excessive layout reflows in the client browser when generating the list of macros, which significantly slows down the page rendering. 

      The culprit appears to be an utility function called textareaFlexible in the file js/textareaflexible.js. After disabling the call to .trigger('input'); in line 83, the browser performance improved greatly.

          var methods = {
              init: function() {
                  return this.each(function() {
                      var $textarea = $(this);                $textarea
                          .off('input keydown paste', update)
                          .on('input keydown paste', update)
      //                                      .trigger('input');
                  });
              },
              clean: function() {
                  return this.each(function() {
                      var $textarea = $(this);                $textarea
                          .val('')
                          .css('height', '');
                  });
              }
          }; 

      (I have commented out the specified line here)

      As a negative side effect, this breaks the automatic sizing of the macro fields, so this is just a temporary workaround that we are using right now.

       

      The test have been done primarily in Zabbix 6.0.9, but it looks like 5.0, 6.2 and 6.4beta3 is affected as well. I did the test on the other versions using a small Python script that creates "250" host macros on the Zabbix host entry and they showed the same behavior.

      I have attached the modified file. Also, creating even more macros with the script, like let's say 1000, makes the difference between the patched and unpatched version very obvious. After the change, even thousands of macros are displayed in just 1-2 seconds on my system.

      Here's the python script used to generate the macros:

      import pyzabbix
      
      zapi = pyzabbix.ZabbixAPI("http://10.50.0.43/")
      zapi.login("Admin", "zabbix")
      
      macros = []
      for i in range(1000):
          macros.append({
              "macro": "{$MACRO_%04d}" % i,
              "value": "value %04d" % i
          })
      
      zapi.host.update(hostid=xxxxxx, macros=macros) 

      Steps to reproduce:

      1. Run the python script to create macros on a host (You need to add the HostID and the correspondent URL of your Zabbix)
      2. Navigate to Configuration > Hosts > Chosen Host
      3. Click on the Macro tab
        On my desktop, it just kills the page, not even listing the Macros at all.
      4. Apply the changes on the textareaflexible.js file
      5. Clear cache of browser to avoid possible false positives

      Result:
      After applying this fix, it instantly shows the Macros on my station. When I click to list Inherited Macros it takes a little while (less than 10 seconds) to list all the 1000 macros there.

      Expected:
      To work natively without any limitations on the amount of Macros.

      Suggestion: 
      Would it be possible to improve the event handling in the frontend JavaScript code, e.g. by calling the input event only once after generating the list of macros to avoid the layout reflow issue?

        1. textareaflexible.js
          2 kB
          Victor Breda Credidio

            zabbix.dev Zabbix Development Team
            vcredidio Victor Breda Credidio
            Votes:
            2 Vote for this issue
            Watchers:
            3 Start watching this issue

              Created:
              Updated: