skip to Main Content

I hired a freelancer to optimize the speed of my site. She did it pretty quickly and it was scoring in the mid 90s when she was done. The only thing that seemed off at the time was I was getting a bug in the product page but only on linux desktop. Windows, android, ios, all loaded the page bug free and fast. I can comment out this minified line of code which is javascript and everything works as it should. However, the site speed drops to low 50s and upper 40s. I also get new errors about monorail failing to load, shopify storefront inbox v2 or something like that and a couple 404 errors concerning something like produce/v2 or something along those lines. The code is rendered in the theme.liquid file via snippet file meta-tags. Inside the meta-tags file is your original meta-tags file with the following javascript minified line of code added to the very bottom:

const observer=new MutationObserver(e=>{e.forEach(({addedNodes:e})=>{e.forEach(e=>{1===e.nodeType&&”IFRAME”===e.tagName&&(e.src.includes(“youtube.com”)||e.src.includes(“vimeo.com”))&&(e.setAttribute(“loading”,”lazy”),e.setAttribute(“data-src”,e.src),e.removeAttribute(“src”)),1===e.nodeType&&”LINK”===e.tagName&&(e.href.includes(“place”)||e.href.includes(“vimo.com”))&&(e.setAttribute(“data-href”,e.href),e.removeAttribute(“href”)),1!==e.nodeType||”IMG”!==e.tagName||e.src.includes(“data:image”)||e.setAttribute(“loading”,”lazy”),1===e.nodeType&&”SCRIPT”===e.tagName&&(“boomerang”)==e.className&&(e.type=”text/lazyload”),e.innerHTML.includes(“asyncLoad”)&&(e.innerHTML=e.innerHTML.replace(“if(window.attachEvent)”,”document.addEventListener(‘asyncLazyLoad’,function(event){asyncLoad();});if(window.attachEvent)”).replaceAll(“, asyncLoad”,”, function(){}”)),(e.innerHTML.includes(“PreviewBarInjector”)||e.innerHTML.includes(“adminBarInjector”))&&(e.innerHTML=e.innerHTML.replace(“DOMContentLoaded”,”asyncLazyLoad”)),(e.src.includes(“assets/storefront”)||e.src.includes(“assets/shopify_pay/”)||e.src.includes(“cdn.judge.me”))&&(e.setAttribute(“data-src”,e.src),e.removeAttribute(“src”)),(e.innerText.includes(“gtm.start”)||e.innerText.includes(“webPixelsManager”)||e.innerText.includes(“cdn.judge.me”)||e.innerText.includes(“boosterapps”))&&(e.type=”text/lazyload”))})})});observer.observe(document.documentElement,{childList:!0,subtree:!0}); (()=>{var e=class extends HTMLElement{constructor(){super();this._shadowRoot=this.attachShadow({mode:”open”}),this._shadowRoot.innerHTML=’:host img { pointer-events: none; position: absolute; top: 0; left: 0; width: 99vw; height: 99vh; max-width: 99vw; max-height: 99vh;’}connectedCallback(){this._fullImageEl=this._shadowRoot.querySelector(“#hell”),this._fullImageEl.src=”data:image/svg+xml,%3Csvg xmlns=’http://www.w3.org/2000/svg’ viewBox=’0 0 8000 8000’%3E%3C/svg%3E”}};customElements.define(“live-55”,e);})();document.head.insertAdjacentHTML(‘afterend’, “); {{ ‘boldapps.js’ | asset_url | script_tag }}

I tried removing and adding parenthesis and brackets in the place it was giving the syntax. I tried to add conditonal statements to make the code more reliable. I tried having a marketer look over it. I tried multiple chat events with shopify support. I tried to paste the code in v.s. code editor and debug it there. I was expecting that a ‘)’ could simply be removed to fix the error. I actually spent hours trying differnt tools to help debug the code.

2

Answers


  1. Chosen as BEST ANSWER

    I would like to follow up on this. I am unsure exactly what she did to fix the syntax error, but I finally got in contact with speedy and she took care of it. Thanks for all of the advice everyone has given on this issue.


  2. Use this un-minified version of the code in place of the above code.

    const observer = new MutationObserver((e) => {
      e.forEach(({ addedNodes: e }) => {
        e.forEach((e) => {
          1 === e.nodeType &&
            "IFRAME" === e.tagName &&
            (e.src.includes("youtube.com") || e.src.includes("vimeo.com")) &&
            (e.setAttribute("loading", "lazy"),
            e.setAttribute("data-src", e.src),
            e.removeAttribute("src")),
            1 === e.nodeType &&
              "LINK" === e.tagName &&
              (e.href.includes("place") || e.href.includes("vimo.com")) &&
              (e.setAttribute("data-href", e.href), e.removeAttribute("href")),
            1 !== e.nodeType ||
              "IMG" !== e.tagName ||
              e.src.includes("data:image") ||
              e.setAttribute("loading", "lazy"),
            1 === e.nodeType &&
              "SCRIPT" === e.tagName &&
              "boomerang" == e.className &&
              (e.type = "text/lazyload"),
            e.innerHTML.includes("asyncLoad") &&
              (e.innerHTML = e.innerHTML
                .replace(
                  "if(window.attachEvent)",
                  "document.addEventListener('asyncLazyLoad',function(event){asyncLoad();});if(window.attachEvent)"
                )
                .replaceAll(", asyncLoad", ", function(){}")),
            (e.innerHTML.includes("PreviewBarInjector") ||
              e.innerHTML.includes("adminBarInjector")) &&
              (e.innerHTML = e.innerHTML.replace(
                "DOMContentLoaded",
                "asyncLazyLoad"
              )),
            (e.src.includes("assets/storefront") ||
              e.src.includes("assets/shopify_pay/") ||
              e.src.includes("cdn.judge.me")) &&
              (e.setAttribute("data-src", e.src), e.removeAttribute("src")),
            (e.innerText.includes("gtm.start") ||
              e.innerText.includes("webPixelsManager") ||
              e.innerText.includes("cdn.judge.me") ||
              e.innerText.includes("boosterapps")) &&
              (e.type = "text/lazyload");
        });
      });
    });
    observer.observe(document.documentElement, { childList: !0, subtree: !0 });
    (() => {
      var e = class extends HTMLElement {
        constructor() {
          super();
          (this._shadowRoot = this.attachShadow({ mode: "open" })),
            (this._shadowRoot.innerHTML =
              ":host img { pointer-events: none; position: absolute; top: 0; left: 0; width: 99vw; height: 99vh; max-width: 99vw; max-height: 99vh;");
        }
        connectedCallback() {
          (this._fullImageEl = this._shadowRoot.querySelector("#hell")),
            (this._fullImageEl.src =
              "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8000 8000'%3E%3C/svg%3E");
        }
      };
      customElements.define("live-55", e);
    })();
    document.head.insertAdjacentHTML("afterend", ``);
    {{ 'boldapps.js' | asset_url | script_tag }}
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search