Milonic provide full featured pull down web menus for some of the worlds largest companies
click here to see what it can do for you

Download Milonic DHTML Menu
Buy Milonic DHTML Menu

Back To Start Of Archive
Taken From The Forum: Help & Support for DHTML Menu Version 5+
Forum Topic: Click to view post
Last Updated: Saturday July 14 2012 - 06:07:47

Performance Problems With Many Menus


Poster: dmcquade
Dated: Monday November 27 2006 - 2:03:34 GMT

Hey everyone,

I have a page that loads a drop-down menu for each record returned. However, I'm seeing a lot of performance problems as the number of records increase. When I get more than 30 or so menus on a single page, the page has a lot of problems with delayed loading and scrolling.

My menus are generated dynamically based on the data returned and there are three possible menu sets.

Has anyone been able to load a large number of menus on a single page without any performance problems? Any comments / suggestions are appreciated.

DJ McQuade


Poster: John
Dated: Monday November 27 2006 - 14:22:02 GMT

We'll need a URL to see how you have things set up.


Poster: dmcquade
Dated: Monday November 27 2006 - 17:01:23 GMT

I create an account for testing purposes:

Username: test __at__ mywineassistant.com
Password: testing

One you logon, you will be in the My Cellar screen. There is an "Action" link next to each wine. When you put the mouse over this link, the menu will appear.

By default the page shows 25 wines, but as the number of wines increases, the page performance decreases. You can see this by changing the "Bottles Per Page" preference at the top to ALL and press Submit.

Below is my code:

My Cellar Page

This page simply chooses a menu set based on the status of a wine. There are three menu sets that can be selected.

<%
if rs("STATUS") = "NOT CONSUMED" then
if rs("BOTTLE_STATE") = "Shipping" or rs("BOTTLE_STATE") = "Future" then
%>

<tr>
<td nowrap align="left" valign="top" bgcolor="<% = vBGColor %>">
<script type="text/javascript" src="mm_my_cellar_full_menu_data.asp?gsearch=<% = vGoogleSearchURL %>&wvid=<% = rs("WINE_VINTAGE_ID") %>&bottle_id=<% = rs("BOTTLE_ID") %>"></script>
<a href="#" name=mmenu<% = rs("BOTTLE_ID") %> id=mmenu<% = rs("BOTTLE_ID") %> onmouseover="popup('WinePopupFullListNotReceived<% = rs("BOTTLE_ID") %>','mmenu<% = rs("BOTTLE_ID") %>')" onmouseout=popdown()><font size="1">
Action</font></a> </td>
<%
else
%>
<tr>
<td nowrap align="left" valign="top" bgcolor="<% = vBGColor %>">
<script type="text/javascript" src="mm_my_cellar_full_menu_data.asp?gsearch=<% = vGoogleSearchURL %>&wvid=<% = rs("WINE_VINTAGE_ID") %>&bottle_id=<% = rs("BOTTLE_ID") %>"></script>
<a href="#" name=mmenu<% = rs("BOTTLE_ID") %> id=mmenu<% = rs("BOTTLE_ID") %> onmouseover="popup('WinePopupFullList<% = rs("BOTTLE_ID") %>','mmenu<% = rs("BOTTLE_ID") %>')" onmouseout=popdown()><font size="1">
Action</font></a> </td>
<%
end if
else
%>
<tr>
<td nowrap align="left" valign="top" bgcolor="<% = vBGColor %>">
<script type="text/javascript" src="mm_my_cellar_full_menu_data.asp?gsearch=<% = vGoogleSearchURL %>&wvid=<% = rs("WINE_VINTAGE_ID") %>&bottle_id=<% = rs("BOTTLE_ID") %>"></script>
<a href="#" name=mmenu<% = rs("BOTTLE_ID") %> id=mmenu<% = rs("BOTTLE_ID") %> onmouseover="popup('WinePopupFullListConsumed<% = rs("BOTTLE_ID") %>','mmenu<% = rs("BOTTLE_ID") %>')" onmouseout=popdown()><font size="1">
Action</font></a> </td>
<%
end if
%>

Menu Data

Below you can see the menu data for the three different menus.

fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;




with(menuStyle=new mm_style()){
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#DCE9F0";
offcolor="#515151";
onbgcolor="#4F8EB6";
oncolor="#ffffff";
outfilter="randomdissolve(duration=0.1)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#777777', Direction=135, Strength=5)";
padding=5;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#2D729D";
separatorsize=1;
subimage="arrow.gif";
subimagepadding=2;
}


with(milonic=new menuname("WinePopupFullList<% = Request.Querystring("bottle_id") %>")){
style=menuStyle;
aI("text=Edit;url=edit_wine.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Move Bottle;url=move_wine_select_rack.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Add Same;url=add_wine_step_3.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Delete;url=my_cellar.asp?action=delete&bottle_id=<% = Request.Querystring("bottle_id") %>&wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Ratings / Info;url=wine_info.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Google;url=<% = Request.Querystring("gsearch") %>;target=_new;");
aI("text=Wine Labels;url=upload_wine_label.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Consume;url=consume.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Consume & Review;url=consume_and_review.asp?bottle_id=<% = Request.Querystring("bottle_id") %>&wvid=<% = Request.Querystring("wvid") %>&review_id=0;");
}

with(milonic=new menuname("WinePopupFullListConsumed<% = Request.Querystring("bottle_id") %>")){
style=menuStyle;
aI("text=Edit;url=edit_wine.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Move Bottle;url=move_wine_select_rack.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Add Same;url=add_wine_step_3.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Delete;url=my_cellar.asp?action=delete&bottle_id=<% = Request.Querystring("bottle_id") %>&wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Ratings / Info;url=wine_info.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Google;url=<% = Request.Querystring("gsearch") %>;target=_new;");
aI("text=Wine Labels;url=upload_wine_label.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Undo Drink;url=my_cellar.asp?action=undo_drink&bottle_id=<% = Request.Querystring("bottle_id") %>;");
}

with(milonic=new menuname("WinePopupFullListNotReceived<% = Request.Querystring("bottle_id") %>")){
style=menuStyle;
aI("text=Edit;url=edit_wine.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Move Bottle;url=move_wine_select_rack.asp?bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Add Same;url=add_wine_step_3.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Delete;url=my_cellar.asp?action=delete&bottle_id=<% = Request.Querystring("bottle_id") %>&wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Ratings / Info;url=wine_info.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Google;url=<% = Request.Querystring("gsearch") %>;target=_new;");
aI("text=Wine Labels;url=upload_wine_label.asp?wvid=<% = Request.Querystring("wvid") %>;");
aI("text=Mark Received;url=my_cellar.asp?action=markreceived&place=no&bottle_shock=no&bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Mark Received w/Bottle Shock;url=my_cellar.asp?action=markreceived&place=no&bottle_shock=yes&bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Mark Received & Place;url=my_cellar.asp?action=markreceived&place=yes&bottle_shock=no&bottle_id=<% = Request.Querystring("bottle_id") %>;");
aI("text=Mark Received & Place w/Bottle Shock;url=my_cellar.asp?action=markreceived&place=yes&bottle_shock=yes&bottle_id=<% = Request.Querystring("bottle_id") %>;");
}

drawMenus();


Poster: dmcquade
Dated: Monday November 27 2006 - 17:03:40 GMT

By the way, I tried remove the menu code and the page performs a lot better ... so I'm pretty sure that's the issue here.

DJ


Poster: John
Dated: Monday November 27 2006 - 22:10:10 GMT

Your setup is incorrect for placing the menu in a table. Please see http://milonic.com/tablemenu.php.


Poster: dmcquade
Dated: Tuesday November 28 2006 - 16:01:08 GMT

So the menus within tables are causing the performance problems? I re-coded this based on what I found on the page you noted but I'm still seeing a lot of performance problems. I'm not quite sure what I was doing wrong before, but the new code builds the menu in the main page instead of referring to the menu file. The output looks like this:

<td nowrap align="left" valign="top" bgcolor="#F0F0F0">


<SCRIPT TYPE="text/javascript">

with(main=new menuname("submenu160")){
style=menuStyle;
aI("text=Edit;url=edit_wine.asp?bottle_id=160;");
aI("text=Move Bottle;url=move_wine_select_rack.asp?bottle_id=160;");
aI("text=Add Same;url=add_wine_step_3.asp?wvid=384;");
aI("text=Delete;url=my_cellar.asp?action=delete&bottle_id=160&wvid=384;");
aI("text=Ratings / Info;url=wine_info.asp?wvid=384;");
aI("text=Google;url=www.google.com;target=_new;");
aI("text=Wine Labels;url=upload_wine_label.asp?wvid=384;");
aI("text=Consume;url=consume.asp?bottle_id=160;");
aI("text=Consume & Review;url=consume_and_review.asp?bottle_id=160&wvid=384&review_id=0;");
}

with(new menuname("Main Menu160")){
style=menuStyle;
alwaysvisible=1;
position="relative";
aI("text=item1;url=#");
aI("text=Action;showmenu=submenu160;");
}
drawMenus();
</SCRIPT>


</td>

The new ASP code looks like this:

<tr>
<td nowrap align="left" valign="top" bgcolor="<% = vBGColor %>">


<%
if rs("STATUS") = "NOT CONSUMED" then
if rs("BOTTLE_STATE") = "Shipping" or rs("BOTTLE_STATE") = "Future" then
%>



<SCRIPT TYPE="text/javascript">
with(new menuname("Main Menu<% = rs("BOTTLE_ID") %>")){
style=menuStyle;
alwaysvisible=1;
position="relative";
aI("text=item1;url=#");
aI("text=item2;showmenu=submenu1;");
aI("text=item3;url=#");
aI("text=item4;url=#");
}
drawMenus();
</SCRIPT>
<%
else
%>

<SCRIPT TYPE="text/javascript">

with(main=new menuname("submenu<% = rs("BOTTLE_ID") %>")){
style=menuStyle;
aI("text=Edit;url=edit_wine.asp?bottle_id=<% = rs("BOTTLE_ID") %>;");
aI("text=Move Bottle;url=move_wine_select_rack.asp?bottle_id=<% = rs("BOTTLE_ID") %>;");
aI("text=Add Same;url=add_wine_step_3.asp?wvid=<% = rs("WINE_VINTAGE_ID") %>;");
aI("text=Delete;url=my_cellar.asp?action=delete&bottle_id=<% = rs("BOTTLE_ID") %>&wvid=<% = rs("WINE_VINTAGE_ID") %>;");
aI("text=Ratings / Info;url=wine_info.asp?wvid=<% = rs("WINE_VINTAGE_ID") %>;");
aI("text=Google;url=www.google.com;target=_new;");
aI("text=Wine Labels;url=upload_wine_label.asp?wvid=<% = rs("WINE_VINTAGE_ID") %>;");
aI("text=Consume;url=consume.asp?bottle_id=<% = rs("BOTTLE_ID") %>;");
aI("text=Consume & Review;url=consume_and_review.asp?bottle_id=<% = rs("BOTTLE_ID") %>&wvid=<% = rs("WINE_VINTAGE_ID") %>&review_id=0;");
}

with(new menuname("Main Menu<% = rs("BOTTLE_ID") %>")){
style=menuStyle;
alwaysvisible=1;
position="relative";
aI("text=item1;url=#");
aI("text=Action;showmenu=submenu<% = rs("BOTTLE_ID") %>;");
}
drawMenus();
</SCRIPT>

<%
end if
else
%>

<SCRIPT TYPE="text/javascript">
with(new menuname("Main Menu<% = rs("BOTTLE_ID") %>")){
style=menuStyle;
alwaysvisible=1;
position="relative";
aI("text=item1;url=#");
aI("text=item2;showmenu=submenu1;");
aI("text=item3;url=#");
aI("text=item4;url=#");
}
drawMenus();
</SCRIPT>


<%
end if
%>
</td>


Poster: dmcquade
Dated: Tuesday November 28 2006 - 16:12:12 GMT

Sorry, forgot to mention. If you want to see the new code then you'll have to go to our development site. You can use the same username / password as above ...

http://www.mywineassistant.com/mwa150


Poster: dmcquade
Dated: Wednesday November 29 2006 - 14:36:39 GMT

Any help on this would be really appreciated. I have a code release due in the near future and this is a very important part of my application.

Thanks everyone!

DJ


Poster: Andy
Dated: Sunday December 3 2006 - 12:03:48 GMT

Hi,

You actually have 26 menus and 254 menu items - This in itself is not a lot but will have an impact on performance.

What I suggest is only use 1 menu and 9 items as the menus are effectively the same but with different links. With a little javascript, you can dynamically change the links based on certain criteria, this will definitely speed things up and make your site much more efficient.

Let me know if you need help with this

Cheers,
Andy


Poster: dmcquade
Dated: Sunday December 3 2006 - 18:21:36 GMT

Andy,

I may need a little help with this since I'm not too familar with Java Script. If you can help me with passing variables / values back to a single menu, I would really appreciate it.

DJ


Poster: dmcquade
Dated: Monday December 4 2006 - 18:54:14 GMT

If someone can give me a hand, I would be more than happy to pay a consulting fee. I just need a simple example of how to dynamically change the Java based on data received from a database. I think if I can get my calls down to 3 individual menu items (as opposed to one for each record returned) then I should be good to go.

DJ


Poster: dmcquade
Dated: Monday December 11 2006 - 5:18:46 GMT

Is there anyone available who can show me how I can do the above? I would really like to use the menu system for my site, but I can't figure out how to get it to work on a large number of items. This dynamic java stuff sounds promising, but I don't have a clue how to get it to go.

Thanks,

DJ