Prevent duplicate loading of JS files

[timothycoy]

When doing a build react-helmet is loading js files once in the head and once in the body. React helmet manages the head and thus this script toComponent() should be in the head.

[MoOx]

Hi. Is this really creating an issue? Can you give more details about this?

[timothycoy]

Yes, particularly because of the base head is not part of the template, so the best way to load js files in the head is to use react-helmet. But then, because of this issue it's loading all the scripts twice.

Steps to reproduce:
npm run build
npm install --save-dev http-server
./node_modules/.bin/http-server dist

Here you can see polyfil and google maps are being loaded twice once in the head and once in the body.
Screenshots:

[MoOx]

Did you check if there are options in react-helmet about that?
I am not a fan on pushing by default script into the head as it's not a good practice (slow down the first paint)

[timothycoy]

react-helmet is specifically for managing the head, so there are no options for that. Also, sometimes you want to load scripts in the head. For example, a script that has logic, which sometimes redirects to another page. For example: optimizely. Another example would be new relic, which you want to get accurate page load timings.

Now, with that said there are a number of other react libraries such as react-async-script or ReactScriptLoader that can be used to asynchronously load external scripts in the body. But, these can easily be added as part of the template by the developer as needed.

[arlair]

This change worked for me. My opinion is this commit sounds good as a temporary iterative step because currently the scripts are added to the head and the body. Then open a new enhancement issue to investigate body only script options.

I had a quick look and React-Helmet appears hard coded to the headElement as far as I could tell. headElement being set here.

[MoOx]

I am ok with this changes if it brings more problem than it's supposed to solves. Can you fix the relevant tests please? If you need some help reach us on gitter

[timothycoy]

Done.

[MoOx]

Thanks! I will release this as a minor (not a patch) as some people might get unexpected results.