Randika

Sometimes, after 24 hours or more, I need to clear the CSS/JS cache to restore the cart icon. This is frustrating, especially since I don’t enable any CSS or JS optimization.

I’ve further investigated the issue regarding the cart icon and have gathered some insights based on the HTML structure. I’d like to share my observations with you:

When the Cart Icon Appears:

• The HTML block for the cart icon is present.
• Comments indicate that this part is not cached by LiteSpeed Cache (Block uncached by LiteSpeed Cache 5.6).
• The X-LiteSpeed-Cache-Control is set to no-cache, meaning it isn’t stored in cache.

<div class="menu-bar-items"><a  class="cart-contents shopping-cart has-svg-icon" title="View your shopping cart"><span class="gp-icon shopping-cart">
                <svg xmlns="https://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-bag" viewBox="0 0 16 16">
  <path d="M8 1a2.5 2.5 0 0 1 2.5 2.5V4h-5v-.5A2.5 2.5 0 0 1 8 1zm3.5 3v-.5a3.5 3.5 0 1 0-7 0V4H1v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4h-3.5zM2 5h12v9a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5z"></path>
</svg>
            </span><span class="number-of-items ">2</span><span class="amount">Rp360.000</span></a>
<!-- Block uncached by LiteSpeed Cache 5.6 on 2023-08-26 04:06:48 -->
<!-- X-LiteSpeed-Cache-Control: no-cache -->
<!-- Full varies: +webp --></div>

When the Cart Icon Disappears (after about 24 hours):

• The entire cart icon block is missing from the HTML structure.
• Comments indicate this section has been cached by LiteSpeed Cache (Block cached by LiteSpeed Cache 5.6).
• The X-LiteSpeed-Cache-Control is set to public,max-age=604800, meaning it’s cached and has a cache lifespan of 604800 seconds (7 days).

<div class="menu-bar-items">
<!-- Block cached by LiteSpeed Cache 5.6 on 2023-08-25 17:15:32 -->
<!-- X-LiteSpeed-Cache-Control: public,max-age=604800 -->
<!-- Full varies: +webp -->
<!-- X-LiteSpeed-Tag: 189_HTTP.200,189_HTTP.301,189_ --></div>

Given these observations, it seems there’s an inconsistency in how LiteSpeed Cache handles the cart icon portion. While initially, it seems not to be cached, after some time it looks like it gets cached and subsequently disappears.

I’d appreciate any insights or recommendations you have regarding these observations.

I believe I have done a hard refresh in inspect and indeed I did not see any errors. Can you suggest something or are you sure there is an error causing the cart icon to disappear?

Okay, this is my report number: KJSAVFKG

When it disappeared, I remember that I had inspected and checked the console tab, but I didn’t see any errors, but maybe I need to double-check.

Currently, I have disabled the ESI Block and replaced the cart with the default theme / non ESI block.

I apologize for writing a confusing review. What I meant was that I used Debloat to optimize JS and CSS, while caching, HTML optimization, and Image + Lazy Load were all handled by LiteSpeed. This is a good combination.

I don’t use LiteSpeed because Debloat is better at handling CSS and JS and also has many configuration options, as you may already know.

Updated: I’ve successfully fixed it by adding this code:

#mega-menu-wrap-main-nav {
z-index: 99999;
}

Thanks for your support!

• This reply was modified 2 years ago by Randika. Reason: I fixed the issue myself

Thank you so much! Really appreciated it. Now the menu has appeared. However, there is something strange, as the menu doesn’t appear on mobile devices after I clicked the hamburger menu (Max Mega Menu is hidden under my theme’s default hamburger menu). Can you also help me with this issue? I have checked it on my phone using Safari and Edge browsers but it doesn’t appear.

• This reply was modified 2 years ago by Randika.

Oh, I can fix it. There is a problem with the Asset CleanUp plugin.

Hi,

No problem. Thanks for adding it to your list of ideas.
I thought about using a method like this:

Inside the cell, I’ll use this code for example:
<span class=”green”>500</span>

And the CSS code:
.green {color: green}

What do you think? is the method above the most effective or is the method using highlight cell extensions better in terms of performance?

Kind regards,
Willya