topic Re: Mashup Object renders slowly in Integration, Extension & APIs

Mashup Object renders slowly

rizaster — Thu, 08 Aug 2019 22:54:16 GMT

Hi all,

As I continue to add more objects to my mashup, the rendering times are increasing. Currently, when I click on a tab, it takes about 3-4 seconds for all of the objects to appear. This isnt too bad, but I am only a quarter of the way done in terms of adding objects to other sections of the site, so I expect this to increase. These are very simple objects, that do not have complex calculations.

I have tried using approach, but it did not help, if anything it slowed it down.

app.visualization.get('xGhjKl').then(function(vis){ vis.show("QV01"); });

Below is my actualJS code, perhaps I am doing something incorrectly? Maybe it has something to do with the object resize method slowing things down, not sure, but any help would be appreciated, thanks!

$(document).ready(function(){ $('[data-toggle="tooltip"]').tooltip(); }); $(document).ready(function(){ $("body").scrollspy({target: "#"}) }); function flipcard1() { $("#firstcard").toggleClass("flip"); } function flipcard2() { $("#secondcard").toggleClass("flip"); } function flipcard3() { $("#thirdcard").toggleClass("flip"); } function flipcard4() { $("#fourthcard").toggleClass("flip"); } /* * Basic responsive mashup template * @owner Enter you name here (xxx) */ /* * Fill in host and port for Qlik engine */ var prefix = window.location.pathname.substr( 0, window.location.pathname.toLowerCase().lastIndexOf( "/extensions" ) + 1 ); var config = { host: window.location.hostname, prefix: prefix, port: window.location.port, isSecure: window.location.protocol === "https:" }; require.config( { baseUrl: ( config.isSecure ? "https://" : "http://" ) + config.host + (config.port ? ":" + config.port : "") + config.prefix + "resources" } ); require( ["js/qlik"], function ( qlik ) { qlik.setOnError( function ( error ) { $( '#popupText' ).append( error.message + " " ); $( '#popup' ).fadeIn( 100 ); } ); $( "#closePopup" ).click( function () { $( '#popup' ).hide(); } ); // Function to toggle hidden objects in a bootstrap popup modal $.fn.extend({ toggleResize: function() { return this.toggle(1, function() { qlik.resize(); }); } }); // IDs for showing up on toggleResize function $(document).ready(function(){ $('.btn').on('click', function(event) { qlik.resize(); }); $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { qlik.resize(); } ); }); //callbacks -- inserted here -- //open apps -- inserted here -- var app1 = qlik.openApp('org analysis cost savings _V3.qvf', config); //get objects -- inserted here -- app1.visualization.get('362485c5-ae22-45ad-b71d-0495db5bf853').then(function(vis){vis.show("vSP_SVP_adj_4");}); app1.visualization.get('d7d7a6c9-8468-4da8-a67f-95f765ca5ee0').then(function(vis){vis.show("vSP_to_adj_8");}); app1.visualization.get('62e38075-3d4d-420c-9c33-46c2af8b8be4').then(function(vis){vis.show("vSP_TL_table");}); app1.visualization.get('0098a10a-06dc-458a-b9da-b1e34683fd25').then(function(vis){vis.show("vSP_TL_reset");}); app1.visualization.get('20d4ed2c-9201-4b74-8a4a-124b1750afba').then(function(vis){vis.show("vSP_TL_adj_8");}); app1.visualization.get('9c6e1765-c9e9-4655-8bfa-aaabfcda463c').then(function(vis){vis.show("vSP_TL_adj_7");}); app1.visualization.get('afaadcfd-8ab5-4662-ab52-a54efb4462fa').then(function(vis){vis.show("vSP_TL_adj_6");}); app1.visualization.get('94323e91-b5b8-4070-bf31-24477ae7e517').then(function(vis){vis.show("vSP_TL_adj_5");}); app1.visualization.get('c8c10a04-2527-417e-9d54-f4ad33d79fc7').then(function(vis){vis.show("vSP_TL_adj_4");}); app1.visualization.get('3a3734ce-749e-43e4-b1ec-17da01e18e5f').then(function(vis){vis.show("vSP_TL_adj_3");}); app1.visualization.get('2a147de7-0411-46d3-9b5b-e8ad78490537').then(function(vis){vis.show("vSP_TL_adj_2");}); app1.visualization.get('80cfc1d8-e4b6-44de-83ef-7ea986473a60').then(function(vis){vis.show("vSP_TL_adj_1");}); app1.visualization.get('636937b6-5330-4f11-ad98-38a38ae4f022').then(function(vis){vis.show("SP_TL_1");}); app1.visualization.get('743cdb5c-5cf2-4f4a-bffb-dcb3b5cf4037').then(function(vis){vis.show("SP_TL_4");}); app1.visualization.get('9a5356c1-bc69-41ed-9afd-c72f9d0a01ff').then(function(vis){vis.show("SP_TL_3");}); app1.visualization.get('e95fa751-e5ee-4e78-94f4-9a7d181d421e').then(function(vis){vis.show("SP_TL_2");}); app1.visualization.get('shcXWAr').then(function(vis){vis.show("SP_TL_count3");}); app1.visualization.get('HRULJT').then(function(vis){vis.show("SP_TL_count4");}); app1.visualization.get('PSeF').then(function(vis){vis.show("SP_TL_cost");}); app1.visualization.get('mMYCuv').then(function(vis){vis.show("SP_TL_count2");}); app1.visualization.get('aAeKCpL').then(function(vis){vis.show("SP_TL_count1");}); app1.visualization.get('6acc269a-dab0-4e85-a00c-04ee72cd7a95').then(function(vis){vis.show("vSP_engineer_reset");}); app1.visualization.get('29aabe25-4aea-4864-83f2-baeeea5ab8a4').then(function(vis){vis.show("vSP_engineer_adj_8");}); app1.visualization.get('2ddfbcae-c8bb-428c-8c0e-6e13adaa18e7').then(function(vis){vis.show("vSP_engineer_adj_7");}); app1.visualization.get('4c7d5439-d485-43f0-8852-f48c172235fd').then(function(vis){vis.show("vSP_engineer_adj_6");}); app1.visualization.get('3098d761-720e-4f34-a4f8-bf09eef3f4d4').then(function(vis){vis.show("vSP_engineer_adj_5");}); app1.visualization.get('929c8990-13b4-453f-a6fc-eb9de61d2458').then(function(vis){vis.show("vSP_engineer_adj_4");}); app1.visualization.get('97302087-12c2-42c1-badb-644830d1094b').then(function(vis){vis.show("vSP_engineer_adj_3");}); app1.visualization.get('ab366be6-abe7-4a13-8c7f-a747b1fbedd2').then(function(vis){vis.show("vSP_engineer_adj_2");}); app1.visualization.get('858607b6-1c4c-453e-8f3a-9c8640fccdfa').then(function(vis){vis.show("vSP_engineer_adj_1");}); app1.visualization.get('d15072c6-ce70-4d40-8118-cdc7c1dd825a').then(function(vis){vis.show("SP_engineer_1");}); app1.visualization.get('fe0f5d41-f7c7-4021-b798-382bcbd496c9').then(function(vis){vis.show("vSP_engineer_table");}); app1.visualization.get('cd4c7a0c-c6de-4a0a-b189-04eef8350f1c').then(function(vis){vis.show("SP_engineer_4");}); app1.visualization.get('0b0171d7-2653-46c3-9031-bac209daea9d').then(function(vis){vis.show("SP_engineer_3");}); app1.visualization.get('c0c4910a-adcc-40cd-aa5a-91c14cbb8e9d').then(function(vis){vis.show("SP_engineer_2");}); app1.visualization.get('TJeYDQ').then(function(vis){vis.show("SP_engineer_count4");}); app1.visualization.get('CwXFXs').then(function(vis){vis.show("SP_engineer_count3");}); app1.visualization.get('acFRwJR').then(function(vis){vis.show("SP_engineer_count2");}); app1.visualization.get('RmREsY').then(function(vis){vis.show("SP_engineer_count1");}); app1.visualization.get('jPZUbp').then(function(vis){vis.show("SP_engineer_cost");}); app1.visualization.get('cLsXbXy').then(function(vis){vis.show("vSP_to_reset");}); app1.visualization.get('9b86d67d-fe40-41f7-881c-6763772bcc95').then(function(vis){vis.show("vSP_to_adj_7");}); app1.visualization.get('7073c375-da09-421e-9b5e-26adf48a4d2b').then(function(vis){vis.show("vSP_to_adj_6");}); app1.visualization.get('c5232ad7-831b-4140-a1b5-0ca299809781').then(function(vis){vis.show("vSP_to_adj_5");}); app1.visualization.get('aa67b74a-014a-42d3-8d4c-850a10ca426e').then(function(vis){vis.show("vSP_to_adj_4");}); app1.visualization.get('fe6854fe-1760-44bb-b7e1-6b936934988d').then(function(vis){vis.show("vSP_to_adj_3");}); app1.visualization.get('5c7a679e-dd03-4802-9418-8a6f8eb35043').then(function(vis){vis.show("vSP_to_adj_2");}); app1.visualization.get('e8fb5b2f-e2fc-4794-b8fc-a6596ade9627').then(function(vis){vis.show("vSP_to_adj_1");}); app1.visualization.get('5ac5a938-9247-4468-b7e8-51749e5d5753').then(function(vis){vis.show("SP_to_1");}); app1.visualization.get('35a0b7cf-0055-4a48-8889-a0d62f6f8f28').then(function(vis){vis.show("SP_to_4");}); app1.visualization.get('11f6f23e-beb7-4bac-a3f1-1257a0eba154').then(function(vis){vis.show("SP_to_3");}); app1.visualization.get('80c7f865-be47-47f6-8bf0-57b5b83d8d3c').then(function(vis){vis.show("SP_to_2");}); app1.visualization.get('bsMrT').then(function(vis){vis.show("vSP_to_table");}); app1.visualization.get('eYajyVp').then(function(vis){vis.show("SP_to_cost");}); app1.visualization.get('XUgAFkT').then(function(vis){vis.show("SP_to_count4");}); app1.visualization.get('JprntLP').then(function(vis){vis.show("SP_to_count3");}); app1.visualization.get('kbBrJz').then(function(vis){vis.show("SP_to_count2");}); app1.visualization.get('DNpweJD').then(function(vis){vis.show("SP_to_count1");}); app1.visualization.get('5a021a31-b932-4942-9723-cc0544028f37').then(function(vis){vis.show("vSP_intern_reset");}); app1.visualization.get('79b028b7-d58c-421a-8ef7-da182517e6c5').then(function(vis){vis.show("vSP_intern_adj_8");}); app1.visualization.get('e5c8f0c8-c8b9-4a6e-b95e-59706c890f0d').then(function(vis){vis.show("vSP_intern_adj_7");}); app1.visualization.get('0ee0e255-accd-4c42-ad55-490e2130e3ce').then(function(vis){vis.show("vSP_intern_adj_6");}); app1.visualization.get('71f9f193-3f3a-4247-80f2-7f5e14511d72').then(function(vis){vis.show("vSP_intern_adj_5");}); app1.visualization.get('05274617-d0a7-4d1c-9e7e-9d39f3f78ea6').then(function(vis){vis.show("vSP_intern_adj_4");}); app1.visualization.get('0232eba8-f4a5-4ddd-bf9e-72212778e685').then(function(vis){vis.show("vSP_intern_adj_3");}); app1.visualization.get('4c7580d3-69cc-4af7-a093-7fd53cca6b3d').then(function(vis){vis.show("vSP_intern_adj_2");}); app1.visualization.get('acda6660-9c85-40bb-aaf3-197ed6e1e1b8').then(function(vis){vis.show("vSP_intern_adj_1");}); app1.visualization.get('a27493d8-cc2d-49a2-9149-2ede51f665f7').then(function(vis){vis.show("vSP_intern_table");}); app1.visualization.get('mPCpd').then(function(vis){vis.show("SP_intern_cost");}); app1.visualization.get('c46ff78b-2423-4bff-b106-aa7623972448').then(function(vis){vis.show("SP_intern_1");}); app1.visualization.get('ecf691e6-e8be-45bd-8946-578eb3afdcff').then(function(vis){vis.show("SP_intern_4");}); app1.visualization.get('9e3690ee-f06d-4b6c-ba6a-807b9d91288a').then(function(vis){vis.show("SP_intern_3");}); app1.visualization.get('ceb08f27-6069-4b75-9a61-5a8242a72300').then(function(vis){vis.show("SP_intern_2");}); app1.visualization.get('XjsPAJ').then(function(vis){vis.show("SP_intern_count4");}); app1.visualization.get('jhExFB').then(function(vis){vis.show("SP_intern_count3");}); app1.visualization.get('XpBnE').then(function(vis){vis.show("SP_intern_count2");}); app1.visualization.get('GExezw').then(function(vis){vis.show("SP_intern_count1");}); app1.visualization.get('d4be23bc-46e4-4568-aa61-5b89399b5eb1').then(function(vis){vis.show("vSP_SVP_adj_8");}); app1.visualization.get('89e94679-c863-44c6-8543-45600f6e6175').then(function(vis){vis.show("vSP_SVP_adj_7");}); app1.visualization.get('3c7078aa-7449-4b6b-ae4d-af7ad2ebc57e').then(function(vis){vis.show("vSP_SVP_adj_6");}); app1.visualization.get('c20dfb47-4aef-4554-b930-30ce870929f1').then(function(vis){vis.show("vSP_SVP_adj_5");}); app1.visualization.get('a09a996f-6398-4d25-b5b5-1c40e7567cf6').then(function(vis){vis.show("vSP_SVP_adj_3");}); app1.visualization.get('cfd0d6b5-94e9-493d-ae8d-ef940d3b3985').then(function(vis){vis.show("vSP_SVP_adj_2");}); app1.visualization.get('9f7b1a56-ba4a-4d96-bc96-2a84c427b612').then(function(vis){vis.show("vSP_SVP_adj_1");}); app1.visualization.get('XHpSBr').then(function(vis){vis.show("SP_SVP_count4");}); app1.visualization.get('RFpjM').then(function(vis){vis.show("SP_SVP_count3");}); app1.visualization.get('FUGNh').then(function(vis){vis.show("SP_SVP_count2");}); app1.visualization.get('GzXR').then(function(vis){vis.show("SP_SVP_count1");}); app1.visualization.get('rkphU').then(function(vis){vis.show("cont_castsav");}); app1.visualization.get('a425ff2f-1620-4973-a5bf-9cc49b2a4058').then(function(vis){vis.show("tot_costsav");}); app1.visualization.get('80f94180-b4d8-48a6-b68c-845c7d375837').then(function(vis){vis.show("SP_VP_1");}); app1.visualization.get('CDu').then(function(vis){vis.show("US_costsav");}); app1.visualization.get('gHSjSar').then(function(vis){vis.show("US_char_tot");}); app1.visualization.get('594ca953-0111-47d7-9c4b-fdad8d0743bc').then(function(vis){vis.show("vSP_SVP_reset");}); app1.visualization.get('45973928-fc5b-460f-882c-c062680ee436').then(function(vis){vis.show("vSP_VP_reset");}); app1.visualization.get('ceabbb49-5bec-4adb-b42d-5fc25f108512').then(function(vis){vis.show("SP_SVP_1");}); app1.visualization.get('fb4a4266-ba4a-4749-b71e-2a0e9b902188').then(function(vis){vis.show("SP_SVP_4");}); app1.visualization.get('9bb16c58-5649-49ce-9f51-94e1a9b9f09b').then(function(vis){vis.show("SP_SVP_3");}); app1.visualization.get('69737cc1-97e8-4bb9-b928-ff53b9e9f070').then(function(vis){vis.show("SP_SVP_2");}); app1.visualization.get('ed4984ff-289f-4f1d-8648-f54694401ef7').then(function(vis){vis.show("SP_VP_4");}); app1.visualization.get('0f9eca39-a770-4a56-8781-fc783234086f').then(function(vis){vis.show("SP_VP_3");}); app1.visualization.get('ea6e2877-c500-4a99-bdeb-75177076da71').then(function(vis){vis.show("SP_VP_2");}); app1.visualization.get('37c47ecc-c2f0-47ae-8b8b-e817102da3de').then(function(vis){vis.show("vSP_VP_table");}); app1.visualization.get('8eec4c0d-f683-490c-ae28-a3fb0e0c4274').then(function(vis){vis.show("vSP_SVP_table");}); app1.visualization.get('sLzXzYc').then(function(vis){vis.show("SP_SVP_cost");}); app1.visualization.get('FmqjPnd').then(function(vis){vis.show("SP_VP_cost");}); app1.visualization.get('2448870c-c61a-4250-b86e-01d868b1ac4c').then(function(vis){vis.show("vSP_VP_adj_8");}); app1.visualization.get('9c989bdb-2b4f-4276-bae5-cb7b93bf7314').then(function(vis){vis.show("vSP_VP_adj_7");}); app1.visualization.get('efc556f0-6540-4cfa-9424-ca22b566b113').then(function(vis){vis.show("vSP_VP_adj_6");}); app1.visualization.get('92961cf1-c1be-4d15-8838-dbea76cac74f').then(function(vis){vis.show("vSP_VP_adj_5");}); app1.visualization.get('3062b333-ed2f-453d-80ca-971c43a3d997').then(function(vis){vis.show("vSP_VP_adj_4");}); app1.visualization.get('05e95926-73ba-4013-b316-f8e62cdb71ba').then(function(vis){vis.show("vSP_VP_adj_3");}); app1.visualization.get('7f6d6f3e-a5a4-49a4-aeeb-fd7877228152').then(function(vis){vis.show("vSP_VP_adj_2");}); app1.visualization.get('8e82f95b-4022-454b-841a-3b1aa09c820a').then(function(vis){vis.show("vSP_VP_adj_1");}); app1.visualization.get('PKKmzt').then(function(vis){vis.show("SP_VP_count4");}); app1.visualization.get('ejWru').then(function(vis){vis.show("SP_VP_count3");}); app1.visualization.get('nkEJcze').then(function(vis){vis.show("SP_VP_count2");}); app1.visualization.get('VxHxyru').then(function(vis){vis.show("SP_VP_count1");}); app1.visualization.get('fe7a55f1-71bb-4de0-984e-8849c64fd51d').then(function(vis){vis.show("vSP_director_adj_8");}); app1.visualization.get('c5243739-39cc-40bb-867c-f1f650f4630c').then(function(vis){vis.show("vSP_director_adj_7");}); app1.visualization.get('a7f36d31-d050-473b-896b-4a89fe21c660').then(function(vis){vis.show("vSP_director_adj_6");}); app1.visualization.get('7a393b70-5658-4256-85f1-82307ac7f30e').then(function(vis){vis.show("vSP_director_adj_5");}); app1.visualization.get('22b5081b-362e-4395-adf8-816b7701bb64').then(function(vis){vis.show("vSP_director_adj_4");}); app1.visualization.get('00c3152f-4781-4acb-b0e1-81abed19708d').then(function(vis){vis.show("vSP_director_adj_3");}); app1.visualization.get('e5ecf583-ea73-4820-9afa-c77f16054269').then(function(vis){vis.show("vSP_director_adj_2");}); app1.visualization.get('0bc79e0d-b176-48ff-9069-3e86cd5fe75b').then(function(vis){vis.show("vSP_director_adj_1");}); app1.visualization.get('0b50289c-6afe-4b6e-bbd5-b9a9fc651fa9').then(function(vis){vis.show("vSP_director_reset");}); app1.visualization.get('91bd9bc5-39a4-42a7-9482-a7e982675a67').then(function(vis){vis.show("vSP_director_table");}); app1.visualization.get('481c83a2-2d08-449d-a829-6456ddefefae').then(function(vis){vis.show("SP_director_1");}); app1.visualization.get('0fccd254-45c7-4190-aa85-957112f9f40b').then(function(vis){vis.show("SP_director_4");}); app1.visualization.get('cd263bec-2901-4bf6-9cf0-cb9754fa07bf').then(function(vis){vis.show("SP_director_3");}); app1.visualization.get('71196011-fc91-4098-8dfc-2ea1608bf5da').then(function(vis){vis.show("SP_director_2");}); app1.visualization.get('jCsxnU').then(function(vis){vis.show("SP_director_cost");}); app1.visualization.get('jhJWYgu').then(function(vis){vis.show("SP_director_count4");}); app1.visualization.get('HTvmM').then(function(vis){vis.show("SP_director_count3");}); app1.visualization.get('PxzDjLU').then(function(vis){vis.show("SP_director_count2");}); app1.visualization.get('mFPMts').then(function(vis){vis.show("SP_director_count1");}); app1.visualization.get('a5a02323-8301-4acb-958c-78bea6d097cc').then(function(vis){vis.show("SP_manager_1");}); app1.visualization.get('qpCgkj').then(function(vis){vis.show("SP_manager_count4");}); app1.visualization.get('Tzqtur').then(function(vis){vis.show("SP_manager_count3");}); app1.visualization.get('ZdcjHsc').then(function(vis){vis.show("SP_manager_count2");}); app1.visualization.get('wgjWjh').then(function(vis){vis.show("SP_manager_count1");}); app1.visualization.get('a67ffdce-7464-4a77-8a6b-7ea9b40c731c').then(function(vis){vis.show("vSP_manager_adj_8");}); app1.visualization.get('d560285e-33f6-4297-9377-b37e08c4aa19').then(function(vis){vis.show("vSP_manager_adj_7");}); app1.visualization.get('a46a967e-6070-4c07-9c10-c00668f55d5c').then(function(vis){vis.show("vSP_manager_adj_6");}); app1.visualization.get('9927d380-37c2-40e4-98e9-fd542977ab67').then(function(vis){vis.show("vSP_manager_adj_5");}); app1.visualization.get('a0b83c85-f2a5-4507-9bb2-051d81f9528a').then(function(vis){vis.show("vSP_manager_adj_4");}); app1.visualization.get('c585d73c-d4d7-44fc-837a-aa8172c1a0c5').then(function(vis){vis.show("vSP_manager_adj_3");}); app1.visualization.get('9eadf1e1-f0d3-4e55-bb52-ea4d5b579f73').then(function(vis){vis.show("vSP_manager_adj_2");}); app1.visualization.get('9aab9038-4a74-41a7-ab36-34639d3bd86e').then(function(vis){vis.show("vSP_manager_adj_1");}); app1.visualization.get('901ffb99-1bbc-492d-817b-e8a4bbe21511').then(function(vis){vis.show("vSP_manager_table");}); app1.visualization.get('3edbbcef-0194-4b37-ab57-0639a1ad1850').then(function(vis){vis.show("vSP_manager_reset");}); app1.visualization.get('d08f6b65-ac79-40ec-9cb3-2d03d5aa4526').then(function(vis){vis.show("SP_manager_4");}); app1.visualization.get('aa03a72f-10b5-41b5-b7eb-5699a6ab265b').then(function(vis){vis.show("SP_manager_3");}); app1.visualization.get('463f6f25-8e0c-461f-926d-c30568bdc681').then(function(vis){vis.show("SP_manager_2");}); app1.visualization.get('ghChnp').then(function(vis){vis.show("SP_manager_cost");}); app1.visualization.get('f73cb713-05f3-4b98-9a17-ad92b244c7c0').then(function(vis){vis.show("SP_sranalyst_1");}); app1.visualization.get('13b704e8-3dca-48b5-9d8d-a45685c75291').then(function(vis){vis.show("vSP_sranalyst_reset");}); app1.visualization.get('NqLmHm').then(function(vis){vis.show("SP_sranalyst_count4");}); app1.visualization.get('bxrtmtv').then(function(vis){vis.show("SP_sranalyst_count3");}); app1.visualization.get('nbfqkbt').then(function(vis){vis.show("SP_sranalyst_count2");}); app1.visualization.get('mzJARfE').then(function(vis){vis.show("SP_sranalyst_count1");}); app1.visualization.get('cJNfYx').then(function(vis){vis.show("SP_sranalyst_cost");}); app1.visualization.get('f82f9341-ca44-4fc7-a5a3-66223da63984').then(function(vis){vis.show("vSP_sranalyst_table");}); app1.visualization.get('eceec0e1-e53f-48aa-b939-eb256d97d1a7').then(function(vis){vis.show("SP_sranalyst_4");}); app1.visualization.get('b35143b7-f765-4beb-a22f-a5e917fd4aa6').then(function(vis){vis.show("SP_sranalyst_3");}); app1.visualization.get('59f5df0c-84f4-4af4-a307-6347d116c8e2').then(function(vis){vis.show("SP_sranalyst_2");}); app1.visualization.get('5414a4e4-2179-4641-9f1f-13ec4ee91feb').then(function(vis){vis.show("vSP_sranalyst_adj_8");}); app1.visualization.get('351053d8-e4b7-4909-9ec1-50b53fb1c4ab').then(function(vis){vis.show("vSP_sranalyst_adj_7");}); app1.visualization.get('dca3b99a-f471-4f40-ae52-1a3a96aa2e2c').then(function(vis){vis.show("vSP_sranalyst_adj_6");}); app1.visualization.get('bc63d6d1-f635-4e1e-90d9-4d7ee0996023').then(function(vis){vis.show("vSP_sranalyst_adj_5");}); app1.visualization.get('adc11e12-5ce0-4fc2-99bb-13838c3bef47').then(function(vis){vis.show("vSP_sranalyst_adj_4");}); app1.visualization.get('8e8b6a60-2d82-43aa-9fc3-c127852b42c8').then(function(vis){vis.show("vSP_sranalyst_adj_3");}); app1.visualization.get('e7979249-2a69-46bf-8f4d-7e739711b5ef').then(function(vis){vis.show("vSP_sranalyst_adj_2");}); app1.visualization.get('5c6e2585-0939-4407-8891-5543a1c0f8dc').then(function(vis){vis.show("vSP_sranalyst_adj_1");}); app1.visualization.get('MqC').then(function(vis){vis.show("SP_analyst_cost");}); app1.visualization.get('8aee3e1a-eda6-4008-9bcb-13f8b4986799').then(function(vis){vis.show("SP_analyst_1");}); app1.visualization.get('084f1816-94ea-476b-93f9-201750c26c4f').then(function(vis){vis.show("vSP_analyst_reset");}); app1.visualization.get('55975f96-b5bf-4031-8595-98690f445f13').then(function(vis){vis.show("vSP_analyst_table");}); app1.visualization.get('799c47e9-0e60-4d13-b40c-31e5618fdc95').then(function(vis){vis.show("SP_analyst_4");}); app1.visualization.get('f46568b5-c7d9-4f59-af43-c98a5e56d384').then(function(vis){vis.show("SP_analyst_3");}); app1.visualization.get('742e3f3c-b984-4f21-9247-efaebd532a3f').then(function(vis){vis.show("SP_analyst_2");}); app1.visualization.get('032ef02e-86b6-4457-aa9f-4407ace799be').then(function(vis){vis.show("vSP_analyst_adj_8");}); app1.visualization.get('ae6d8c54-746e-466f-af97-a96b265f8e12').then(function(vis){vis.show("vSP_analyst_adj_7");}); app1.visualization.get('622edc76-69eb-4ce2-8f22-60c57af48103').then(function(vis){vis.show("vSP_analyst_adj_6");}); app1.visualization.get('60250eb6-c69b-4128-a76d-2938d27ea03a').then(function(vis){vis.show("vSP_analyst_adj_5");}); app1.visualization.get('50550181-afe9-43b4-ad0f-26f7d091ff71').then(function(vis){vis.show("vSP_analyst_adj_4");}); app1.visualization.get('335c8e98-6fe9-4c7a-9be0-8945323e7b6a').then(function(vis){vis.show("vSP_analyst_adj_3");}); app1.visualization.get('82c394c4-de2b-4b00-89a9-42d1068c2812').then(function(vis){vis.show("vSP_analyst_adj_2");}); app1.visualization.get('b3421804-1e7b-4bda-8b06-3ce471ea1854').then(function(vis){vis.show("vSP_analyst_adj_1");}); app1.visualization.get('UWNPuRW').then(function(vis){vis.show("SP_analyst_count4");}); app1.visualization.get('VjXVsP').then(function(vis){vis.show("SP_analyst_count3");}); app1.visualization.get('Xjeptd').then(function(vis){vis.show("SP_analyst_count2");}); app1.visualization.get('ZDJmgkz').then(function(vis){vis.show("SP_analyst_count1");}); app1.visualization.get('jCJJCTy').then(function(vis){vis.show("SP_reset");}); app1.visualization.get('0896fcc6-b59e-4921-b5f0-20df72fb691f').then(function(vis){vis.show("SP_assistant_1");}); app1.visualization.get('bcf4f3d6-d250-44c9-84a0-7ab022034a7a').then(function(vis){vis.show("vSP_assistant_reset");}); app1.visualization.get('nDwZctB').then(function(vis){vis.show("SP_assistant_cost");}); app1.visualization.get('2cba2bac-316f-4b45-91cb-1ca5e0e01411').then(function(vis){vis.show("vSP_assistant_table");}); app1.visualization.get('6c4762f3-89ad-4efd-b90b-af02c9682439').then(function(vis){vis.show("vSP_assistant_adj_8");}); app1.visualization.get('0948e835-6af6-48e5-bc51-d4a72c7b2dd5').then(function(vis){vis.show("vSP_assistant_adj_6");}); app1.visualization.get('aa80812f-8a56-45d5-b9ff-c5e42491dc51').then(function(vis){vis.show("vSP_assistant_adj_7");}); app1.visualization.get('7622fc10-fe54-4b35-a18b-8285ff865ac7').then(function(vis){vis.show("vSP_assistant_adj_5");}); app1.visualization.get('d5ca180d-4a98-4c20-b277-3296485279dd').then(function(vis){vis.show("vSP_assistant_adj_4");}); app1.visualization.get('d87b49f4-58d7-403c-83ab-d2cb9fe7f420').then(function(vis){vis.show("vSP_assistant_adj_3");}); app1.visualization.get('4da09c27-1290-4a68-9229-a76e3cf729df').then(function(vis){vis.show("vSP_assistant_adj_2");}); app1.visualization.get('ee33cb72-0522-4211-bbab-35a2d6728fc5').then(function(vis){vis.show("vSP_assistant_adj_1");}); app1.visualization.get('00b7fdeb-2173-4b5c-a8f8-1e313dedba3c').then(function(vis){vis.show("SP_assistant_3");}); app1.visualization.get('3f65f76c-d6b9-4aa6-9da0-2ed2a65dbca2').then(function(vis){vis.show("SP_assistant_4");}); app1.visualization.get('342f6f1e-7e34-4884-ac6a-255589b06af3').then(function(vis){vis.show("SP_assistant_2");}); app1.visualization.get('fnLdy').then(function(vis){vis.show("SP_assistant_count4");}); app1.visualization.get('YnGm').then(function(vis){vis.show("SP_assistant_count3");}); app1.visualization.get('PPzNVrX').then(function(vis){vis.show("SP_assistant_count2");}); app1.visualization.get('KJbVJ').then(function(vis){vis.show("SP_assistant_count1");}); app1.visualization.get('DSSZrAs').then(function(vis){vis.show("SP_overall_count4");}); app1.visualization.get('PLDpdD').then(function(vis){vis.show("SP_overall_count3");}); app1.visualization.get('mWQfDgK').then(function(vis){vis.show("SP_overall_count2");}); app1.visualization.get('SUpGuN').then(function(vis){vis.show("SP_overall_count1");}); app1.visualization.get('e9638eea-ab29-4623-8005-a6d2b14a2184').then(function(vis){vis.show("vSP_overall_table");}); app1.visualization.get('405115ee-7f13-40f4-a646-b0a82886d27f').then(function(vis){vis.show("SP_overall_1");}); app1.visualization.get('8a605e6a-f50a-47a3-9106-c9cccbd6f782').then(function(vis){vis.show("SP_overall_4");}); app1.visualization.get('52e92a4c-dde6-410b-a306-764d6b824613').then(function(vis){vis.show("SP_overall_3");}); app1.visualization.get('1dee5172-3823-4bb7-97eb-633f8e59384b').then(function(vis){vis.show("SP_overall_2");}); app1.visualization.get('aCwrPU').then(function(vis){vis.show("SP_overall_cost");}); app1.visualization.get('pCPVVya').then(function(vis){vis.show("SP_costsav");}); app1.visualization.get('EzPbsZ').then(function(vis){vis.show("SP_graph");}); //create cubes and lists -- inserted here -- } );

Re: Mashup Object renders slowly

ErikWetterberg — Fri, 09 Aug 2019 05:30:18 GMT

Hi,

Looks like a lot of objects. Try not getting them until the users opens the tab where they are shown.

Re: Mashup Object renders slowly

rizaster — Fri, 09 Aug 2019 15:34:23 GMT

Thanks, this is what I was thinking, but unsure how that would be implemented. Any ideas or examples? Thanks!

Re: Mashup Object renders slowly

rizaster — Thu, 12 Sep 2019 22:12:36 GMT

Bump, any guidance would be appreciated.

Re: Mashup Object renders slowly

oz_moyal — Thu, 12 Sep 2019 22:39:10 GMT

Hi,
First load ONLY the visualizations that needs to be visible when page loads, do not load ALL the visualizations.

Now, what action leads to show different vis ?
if it is tab switch, then only when user OPEN the tab, load the visualizations that are visible in the new tab

Also u should consider closing the visualizations that are no longer visible (vis. close (u will need to keep reference of the visualizations)

If u need more help u need to share what is that u show, when do u need to show different visualizations, it is not enough just to show code, we need to understand how the UI works to optimize it.

Re: Mashup Object renders slowly

rizaster — Mon, 16 Sep 2019 15:08:44 GMT

Hi,

Thanks for the response. To give an overview of the UI, there are 4 sections of the page, each with their own modal (bootstrap). When you click on the modal, the modal contains bootstrap tabs, each tab has different objects.

A specific example of loading when opening a tab would be helpful to get me in the right direction. Thanks!

Re: Mashup Object renders slowly

cpomeren003 — Tue, 17 Sep 2019 08:09:57 GMT

Hi,

What I would do is:
- When bootstrap tab gets clicked only get and show these visualizations;
- All other visualizations are closed so they don't slow everything down;

So first you need to figure out when people go to a specific tab. Use this a a starting point (found here: https://getbootstrap.com/docs/4.0/components/navs/😞

$('#myTab a').on('click', function (e) { e.preventDefault() $(this).tab('show') })

In this function (e) you should probably call something like this:

qlikVisualizations.forEach(qlikVisualization => { app.visualization.get(qlikVisualization.id).then(vis => { vis.show(qlikVisualization.elementId); qlikVisualization.QVisualization = vis; }); });

Where qlikVisualizations looks like this (id is objectID and elementId is the HTML id):

qlikVisualizations: [ { id: "awe32", elementId: "element1", QVisualization: undefined }, { id: "brwe2", elementId: "element2", QVisualization: undefined } ];

And when you try to close the visualizations you use this code, so first find the event that happens when you close a tab (see: https://getbootstrap.com/docs/3.4/javascript/#tabs-events) and then basically call this close function:

qlikVisualizations.forEach(({ QVisualization }) => { QVisualization.close(); QVisualization = undefined; });

You could also use the following logic (it's easier I think):
- Create a global array called activeVizs that starts off as an empty array, so:
activeVizs: [];
- When I open a tab I check if there are any visualizations in the array called activeVizs, if there are I will close them with the above close function;
- After that I get and show all the needed visualizations of the current active tab (same as before) and I will add all these visualizations to the array activeVizs;

This way there will only be one tab worth of visualizations active.

Hope this helps.

Re: Mashup Object renders slowly

rizaster — Tue, 17 Sep 2019 15:42:18 GMT

This is extremely helpful, especially for someone who is fairly new to JS. Thanks for the well thought out walk through!

Re: Mashup Object renders slowly

rizaster — Fri, 04 Oct 2019 20:07:27 GMT

In case anyone needed the specific code i used, below is an example. Although Cpomeren003's code worked (with slight tweaks), the objects were still rendering slowly. Since my app has over 400 objects, two things were needed to speed it up:1) use a multi dimensional array and 2) the for loop should only activate when the tab name matches the appropriate part in the array. This is a little different from the original for loop (according to my understanding anyways) because in the original for loop, any tab you click on will make you run through the whole array of 400 items, hence why it didnt really improve speed. Additionally, I didnt need to use the close function since this is a scenario planning tool, and the adjustments made in each tab need to stay even after navigating away from the tab.

Long story short, the dashboard is really fast now, stake holders are happy, and hopefully this explanation helps anyone in a similar situation. Thanks again for all the help!

Re: Mashup Object renders slowly

cpomeren003 — Fri, 04 Oct 2019 20:55:39 GMT

Rizaster, just to clarify, I never meant for you to load all the 400 objects at the same time, because as you found out it will still be super slow. In my example I used an array called "qlikVisualizations" but it would only have the current active objects, so for example 20 of the 400 objects. The reason I could do this was that my original code was based on a vue.js app and every page/component in it had its own list of objects(qlikVisualizations array) to render when active and to remove when deactivated.

Some tips:

You mention the term multi dimensional array, another good term for this is "nested arrays". I generally find that an easier term to remember.
I see that you use a standard for loop instead of the forEach method. There isn't really anything wrong with this, but just make sure you understand how the forEach method works, since it is such a powerful and easy method to use.
Instead of:

var target = $(e.target).attr("href"); target = target.replace('#','')

I would use:

let target = $(e.target).attr("href").substring(1);

Instead of:

for (var key1 in objects[key]) { app1.getObject(objects[key][key1][0],objects[key][key1][1]); };

I would use:

objects[key].forEach(function(element) { app1.getObject(element[0], element[1]) });

You currently use the getObject method. Have you tried swapping between all the tabs back and forth? In my experience, since you never close these objects it will lag after a while since you never close these objects. For example, first tab opens 10 objects, second tab opens 20 objects and third tab opens 10 objects, this results in a total of 40 objects being 'active' / in memory. In an ideal scenario there should only be 10 objects in memory (those of the last opened tab).

Hope it helps!

Re: Mashup Object renders slowly

rizaster — Fri, 04 Oct 2019 22:32:30 GMT

ahh ok yes that makes more sense knowing you are using vue.js

This is really helpful, thanks for suggestions on cleaning up the code! I have gone through all tabs, and it doesnt seem to slow down the dashboard at all, which I was surprised about as well. I can't use close object because each tab contains slider input variables where the user can make adjustments, and so any adjustment that is made must remain as users go back and forth between tabs.