Using MutationObserver on document.body with subtree: true can have a negative impact on performance as it triggers on every DOM change across the entire page. Additionally, document.querySelector only targets the first matching element, which might miss the social links in the mobile navigation if both desktop and mobile navs are present in the DOM.

Consider using querySelectorAll to update all instances and narrowing the observer's scope to the navigation bar (.VPNav) for better efficiency. The setTimeout is also likely redundant if the observer is correctly configured.

      const addStarCount = () => {
        const githubLinks = document.querySelectorAll(
          '.VPSocialLinks a[href*="github.com/jdx/hk"]',
        )
        githubLinks.forEach((githubLink) => {
          if (!githubLink.querySelector('.star-count')) {
            const starBadge = document.createElement('span')
            starBadge.className = 'star-count'
            starBadge.textContent = starsData.stars
            starBadge.title = 'GitHub Stars'
            githubLink.appendChild(starBadge)
          }
        })
      }

      addStarCount()
      const nav = document.querySelector('.VPNav')
      const observer = new MutationObserver(addStarCount)
      observer.observe(nav || document.body, { childList: true, subtree: true })

MutationObserver runs forever when stars data is empty

Low Severity

When starsData.stars is "" (the common case when no GITHUB_TOKEN or UPDATE_GITHUB_STARS env var is set during build), addStarCount() returns false immediately. The if (addStarCount()) return check at the outer level then falls through and creates a MutationObserver that can never disconnect — because every subsequent call to addStarCount() also returns false. This leaves a subtree observer permanently attached to .VPNav or document.body, firing its callback on every DOM mutation to no effect.

 

^{Reviewed by Cursor Bugbot for commit 7235569. Configure here.}