Loading React scripts as "defer"

[AlexxEG]

Could the React scripts be loaded with "defer" attributes to shave off a few ms on loading time? Since server rendering is used I believe it should have a positive impact on the initial load.

[madyke]

Hi @AlexxEG - I passed this onto our team's React SME, who informed me that we load extension dependencies as modules with a library called SystemJS. SystemJS already loads modules with a "deferred execution" mode, so extension dependencies should already be loaded with "defer" by default.

[AlexxEG]

Hey @madyke - I was referring to the "react.production.min.js" and "react-dom.production.min.js" scripts that are at the bottom of the body. Could it be beneficial to move these to the head and add the "defer" attribute to them instead so that they're loaded async while the HTML is parsed?

Unless of course there is a specific reason it's done the way it is now.

[madyke]

Hi @AlexxEG - what product are you referring to? Is this for an E-commerce site? None of the Store commerce or HWS applications are using those scripts as far as I'm aware

[AlexxEG]

Yeah correct, I was directed here to create a discussion thread from support to get input on this change. Maybe this is the wrong place for that?

[madyke]

Hi @AlexxEG - e-commerce questions are fine here. Store Commerce is going through a React upgrade now, so without any context specified, I assumed it was related to that.

If this is e-commerce related, then @bradyd or someone on his team should be able to review your suggestion.

[AlexxEG]

@madyke Got it, thank you!

[bradyd]

Hey @AlexxEG,
We are looking at using defer for the react scripts in the near future. We just need to make sure it doesn't cause any other interesting issues when we enable it. Currently put the react scripts at the bottom of the body to let the render happen before loading the script.

Brady

[AlexxEG]

Hey @bradyd
Ok sounds good, thanks for answering!