CODEWITHSUNDEEP
javascriptprerenderintercomreact-snap
James Shiztar
James Shiztar

Reputation: 508

How to exclude Intercom scripts from react-snap prerender

I want to exclude the Intercom scripts (JS and CSS, I think, but is 400KBs of stringified code) from a react-snap prerender build.

All other scripts are already excluded but Intercom cannot be and is disrupting my prerender and SEO and making prerendered scripts far bigger than need to be.

I have set the exclusion parameter in the package.json with:
"reactSnap": { "destination": "build/pre-rendered", "removeScriptTags": true }, and this is exlcuding all other scripts.

Intercom is loaded with either in index.html:

window.intercomSettings = { app_id: 'APP_ID' };

(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + 'APP_ID';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();

or the react-intercom component in the sub-component via: >Intercom appID= 'APP_ID'/>

Any help would be much appreciated - thanks

Upvotes: 1

Views: 1062

Answers (2)

balint
balint

Reputation: 13

@adevine this also works if you want to avoid rendering certain elements, thanks!


const Component = () => {
    const isSnap = navigator.userAgent === 'ReactSnap'

    return (
      <div className="main">
        <>
          { !isSnap && <ComponentToKeepDynamic /> }
        </>
      </div>
    );
  };

export default Component;

Upvotes: 0

adevine
adevine

Reputation: 1102

I had the exact same issue. You can detect pre-rendering by looking at the user agent:

function isPreRendering() {
    return navigator.userAgent === 'ReactSnap';
};

Then just put your entire script above in a if (!isPreRendering) block.

Upvotes: 0

Related Questions