Laggy Scroll - IE11 / Sluggish Experience - Chrome

Support
#7

Hi Christian,

We chose the pro theme over the X or other themes because it is marketed toward advanced needs and professional websites.

I know that we have many menu items but it is still a fairly normal amount. I would understand your concern if we had thousands of menu items or more.
I never encountered such browser behavior in any website or any browser that is caused by the number of menu items.

Please see two examples:
Our current website, which is essentially the same but using different technology, same number of menu items but no issue with IE scrolling:

Summary

https://www.lumenis.com/

More relevant example is the exact same website we built with your theme, only using the Twenty Seventeen theme. Same number of menu items also with a sticky menu and a mobile menu, all working fantastically with no issue with IE11 scrolling:

Summary

http://lumenis2.onpressidium.com/

There is no way around the understanding that something in the theme is causing that problem in IE (maybe some script?).
If medium-large structure menus is something that is limited with the pro theme, I must say that the name and description of the theme are very very misleading. Please stand behind your title at: https://theme.co/pro/ “The Most Advanced Website Creator for WordPress.”

Please understand our urgency, we are launching this website very soon with many users that will access it using IE11. We would be more than happy to get paid support if it will expedite the process of fixing it.
We will welcome any creativity that will solve this issue as fast as possible.

Thanks,
Amir.

#8

Hey Amir,

Let me show you the difference. Both the site’s you posted are only using 1 long simple menu. Your site with the issue is using 2 long menus (1 in your Menu Bar and 1 in your Sticky bar). I showed you that in my previous reply. I even posted specific screenshots. I also would like to add that Pro Menu does have additional styling and effects unlike in the sites you posted.

Now, please try removing the menu in the sticky header then test again. If you want to replicate the behavior in this site, simply delete your third bar and make the two top bars sticky. Please try this first and if the issue persists, we can investigate other areas. Scripts are a possibility. But, it was removing 1 long menu that fixed the issue in my test.

Regarding your comment:

That is correct. With all due respect, we understand that you’re frustrated but this issue is not related to the creation of the whole website which is what was meant in the slogan. This does not also mean that adding lots of elements will not have an effect in page performance.

Please also note that we respect each and every customer’s time here. I have spent time investigating this. Otherwise, I would not have come up with the discovery of the 2 long menus in the header.

We do not have premium or paid support but you can contact us for custom projects through this link.

Thanks.

#9

In the following version of the site there is no sticky bar or sticky menu at all, the behavior is not even slightly better on IE11:

Summary

http://lumenis3.onpressidium.com/

Also, I added to the following site, a secondary menu with the same menu items count, it still behaves just fine on IE11 with two mwnus.

Summary

http://lumenis2.onpressidium.com/

These two examples contradicts the differences you mentioned in your last reply.

I already submitted the contact form you sent me and I received a reply to ask in the support forum.
This issue is critical for us and there seems to be lack of understanding of the urgency we have.

#10

Yes, there’s no sticky bar on site because you hid it. I checked the source code and you still have the third bar which contains the 2nd long menu in http://lumenis3.onpressidium.com/

Please remove that first.

This site still has 1 long menu and uses the same menu for desktop and mobile. It’s not the same as I described.

#11

I also just discovered that you have 3 menus in your header and it’s the Navigation Collapsed.

Please note again that we’re here to discover what is causing the issue. We are not competing on what’s right or what’s wrong. With that said, we kindly ask for your cooperation.

Update: I just duplicated your header and removed all menus in the bar and assigned it to a test page I created in your site https://lumenis-staging.com/x-support-test/. The point here is not to show you that you should not have a menu. Far from it. The point here is you should reduce the number of menu items.

You can see the result in this video. As you can see in there, the scroll is very smooth.

The bottom-line here is, you can’t have that lots of menu items in page because it will degrade the performance of your site. IE is an old browser too so it can’t handle that many elements. The site’s you pointed out are simple themes. They are unlike Pro, a feature rich theme.

Thanks.

#12

I’m sincerely sorry if you got the feeling that I’m trying to compete with you, rest assure that my sole goal is to solve this bug ASAP.

I can keep spending time on showing you examples of how it is really doesn’t matter how many menu items or menus we got, as long as the menus iare OK.

Please try to look at this objectively, there is a definite issue with the pro’s header menus and IE11.

Please visit the following page, it contains five of our menus with all of the items and levels inside.
One of them is the default theme’s menu without header attached, and the other 4 were added to the page directly.
The pro theme is being used, so there is no fear the light weight theme is mitigating the issue. All of the content is also added to the page The scrolling is 100% fine in this page using IE11.

Summary

http://lumenis6.onpressidium.com/

I genuinely ask you to provide a fix for that problem in the pro theme which we’ve put all of our efforts in building the website with. If required, we are willing to pay extra to fix this problem as quick as possible.

Best,
Amir.

#13

Hey Amir,

Your sample does not replicate what’s happening in Pro.

In Pro, 1 menu item has 7 elements and that is not to mention the scripts that come along with the menu. There might be another factor contributing to this but the number of elements or nodes alone is a significant factor (at least in my test).

A menu item in X and the menus you’ve added in your page through Visual Composer has 3.

Anyway though, since your adamant that you’re not going to reduce your menus, I’ll post this in our issue tracker so our development team would be made aware of this situation once they go through the list of reports. Just note that there’s no guarantee that an immediate solution would be provided.

And, since you already tried our contact form, there’s is no way we could provide a paid support. This will need to undergo the process like other reported issues.

Your patience and understanding would be very much appreciated.

#14

Please understand that this is a professional website, it means that we cannot change the whole menu structure one day just because a buggy menu is standing in our way. Saying that, I went ahead and reduced the menu items drastically and also removed the sticky header. The clunky behavior remains, I tried it on:

Summary

http://lumenis6.onpressidium.com/aesthetic/

You also mentioned that the sample does not replicate whats happening in pro, of course not, the whole point was to show that it is not related to the number of menu items but to something else in pro.

Although having 7 elements for each menu item seems like a problematic thing, I also don’t think it what causes the issue. In the following test I added 2 more none-pro menus to a total of 7 full menus. These 7 non-pro menus should have the same number of elements as 3 pro menus. The scrolling behavior in IE11 is still very smooth.

Summary

http://lumenis6.onpressidium.com/

You mentioned something about scripts that are related to menu items, that may be the source of the issue.
I would be grateful if you could provide us with some outside-the-box-thinking solution to this problem, or expedite the issue in your process.
P.S, I tried the contact form again but didn’t get any response, maybe you can check about that too?

Thanks,
Amir.

#15

Hey Amir,

I see you reduced the menus in this page from 187 to 75.

Would you mind completely removing the Sticky bar instead of hiding it only? You are only hiding it using the Hide During Breakpoints. That does not remove the menu in the page.

I have posted this in our issue tracker. Though we understand that you’re frustrated because of your project deadline. But, depending on the complexity of the issue, providing an immediate solution is not guaranteed.

Please stay tuned.

Update: Alternatively, you can try using UberMenu. For more details, please see https://theme.co/apex/forum/t/extension-ubermenu/75

Thanks.

#17

That is a great direction Christian, I would go ahead and try it right away. What would be the best practice to add the ubermenu to the pros’s header builder? Taking into account we need to use several menus with completely different styles on different headers?
Should that be with a shortcode in a content block?
How will we use the single ubermenu control panel to style multiple menus with different look and feel?

Thanks!

#18

Hi,

Yes, that is correct. You need to use the shortcode in a conten block.

For multiple menus kind refer to the link below

Hope this helps

#19

Thanks for the info Paul.
It basically solved the IE11 sluggish scroll issue that was caused by the pro menus, which I’m very happy about!
It also led me to discover two more points:

  • The collapsed mobile menu that comes with pro is not responsible for the issue at all so we will probably continue using it and disable the ubermenu responsive mode which is not that great out of the box.

  • The sticky functionality of the header builder also creates a sluggish scroll in IE11, but only when revealed/hidden - We still need to solve that, any ideas how can we fix it?

I tested the ubermenu solution on this page:

Summary

http://lumenis8.onpressidium.com/

P.S. We are treating this solution as a workaround which is temporary. We would still prefer to have the native header menus working properly in IE11.

Thanks!

#20

Hi @Amir.Caspi,

I have tried and there is no temporary workaround as of this moment as it’s all done through javascript. Though, I can confirm the sluggish behavior of the header upon scrolling.

Could you try installing Smooth Scroll extension bundled to the theme?

Thanks!

#21

Hi Rad, I tried it but it did not improve the situation. To my understanding Christian passed it to the tracker for a fix. Is that correct?

#22

Hi @Amir.Caspi,

It’s added to our issue tracker but there is no immediate fix. I tried some but no luck.

What I just requested is just another way to minimize the sluggish transition. If not possible, then we’ll have to wait for the fixes of the issues added to our issue tracker.

Thanks!

#23

Hi,

We encountered more issue that originates from the menu that came in the pro header builder.
This time it seems to happen in Chrome. In our contact form (embedded HubSpot form), the input fields typing is laggy and not smooth as it should be, especially right after the page’s load.
A troubleshooting I did led me to load the form without different elements in the page, and the only way to fix this is to eliminate the pro’s menu. Exactly as with the IE scroll issue.

I also would like to mention that we are using the HubSpot forms in 20+ different websites of the company and we have never encountered such behavior.

Thanks.

#24

Hi Amir,

Thank you for the additional information.

Have a nice day! :slight_smile:

#25

Thanks Paul! Have a nice day as well. Are there any updates regarding this problem?

#26

Hi @Amir.Caspi,

There is no update as of this moment, but yes, it’s javascript related as all effects and animation are done through that. Adding more features like content and items that uses javascript could slow it more.

Thanks!

#27

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.