Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Do not let angular parse the treeview data as it can be 🐢 HUGE 🐌 #5729

Merged
merged 1 commit into from
Jun 21, 2019

Conversation

skateman
Copy link
Member

@skateman skateman commented Jun 20, 2019

I did some profiling around the TreeView with 5 thousand nodes and I realized that the bottleneck is in Angular and not the TreeView code. I asked @himdel about the problem and we realized that this was caused by a bugfix that started sending the tree data as an object instead of a string. The object is being parsed by angular and if it is 5MB, well 🐢 🐌 happens.

The solution is to get the data into the component in an alternative way, so preventing Angular from unnecessarily parsing it. Ideally this could be solved by having separate (UI-)API endpoints for trees, but we're not there yet. So our solution was to utilize the ManageIQ.trees global object by temporarily saving the data into it until the component gets a reference.

After this change the performance increase is significant, the bottleneck now is in the rendering which is totally fine. We can't really make the browser faster 😉

Before:
Screenshot from 2019-06-20 13-57-40

After:
Screenshot from 2019-06-20 13-46-35

@miq-bot add_reviewer @martinpovolny
@miq-bot add_reviewer @himdel
@miq-bot add_label performance, bug, trees, hammer/yes

https://bugzilla.redhat.com/show_bug.cgi?id=1703556

@skateman skateman changed the title Do not let angular parse the treeview data as it can be 🐢 HUGE… Do not let angular parse the treeview data as it can be 🐢 HUGE 🐌 Jun 20, 2019
@miq-bot miq-bot requested review from martinpovolny and himdel June 20, 2019 10:13
@@ -1,10 +1,12 @@
- return if @display == 'generic_objects' || @display == 'main'
= miq_accordion_panel(_("Generic Object Classes"), true, "god") do
:javascript
ManageIQ.tree.data['#{tree.name}'] = #{tree.locals_for_render[:bs_tree]};
Copy link
Contributor

@himdel himdel Jun 20, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ugh, GOD is special, there's no tree, only @tree.

(and that's the only issue I'm seeing 👍)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh GOD WHYYY 😢 I'll fix it

@skateman skateman force-pushed the explorer-tree-init-object branch from 2ba59f4 to 02a4883 Compare June 20, 2019 16:21
@miq-bot
Copy link
Member

miq-bot commented Jun 20, 2019

Checked commit skateman@02a4883 with ruby 2.3.3, rubocop 0.69.0, haml-lint 0.20.0, and yamllint 1.10.0
0 files checked, 0 offenses detected
Everything looks fine. 🍰

@himdel himdel self-assigned this Jun 21, 2019
@himdel himdel added this to the Sprint 114 Ending Jun 24, 2019 milestone Jun 21, 2019
@himdel
Copy link
Contributor

himdel commented Jun 21, 2019

Tested both in GO and in other explorers, LGTM :)
miq_ae_customization still works in french :)

@himdel himdel merged commit 6d088fe into ManageIQ:master Jun 21, 2019
@skateman skateman deleted the explorer-tree-init-object branch June 21, 2019 11:43
simaishi pushed a commit that referenced this pull request Jul 22, 2019
Do not let angular parse the treeview data as it can be 🐢 HUGE 🐌

(cherry picked from commit 6d088fe)

https://bugzilla.redhat.com/show_bug.cgi?id=1727443
@simaishi
Copy link
Contributor

Hammer backport details:

$ git log -1
commit 99c27e15cb74c66888bf513f34e4bd7c55c9a4e3
Author: Martin Hradil <[email protected]>
Date:   Fri Jun 21 11:25:56 2019 +0000

    Merge pull request #5729 from skateman/explorer-tree-init-object
    
    Do not let angular parse the treeview data as it can be 🐢 HUGE 🐌
    
    (cherry picked from commit 6d088fe4db708aad3506d0b097a64f2b3c041ef1)
    
    https://bugzilla.redhat.com/show_bug.cgi?id=1727443

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants