Shopify ScriptTag is slow. How can I load my JS faster?

[FootsieNG]

I've build an embedded app that injects javascript into the product page of a client site. The code generates an icon against each product listing, but it is slow to load, and appears 1-2 seconds after the page has loaded.

Is there a way to optimise the load speed through scriptTag api? or an alternative method to achieve the above?

Thanks in advance.

[Anonymous]

@FootsieNG ,

Don't make an external call simple. Upload your scripts to the Shop theme asset folder and include it in theme.liquid. Remember Shopify is server rendered HTML. So if you can get it in the templates there won't be much delay.

Do a PUT to the theme asset folder with your script. Add two scripts a small one that bootstraps the bigger one. Then update theme.liquid to include your init script. Finally in your init script append to the head the main script at the end of body load, something like that. 

Best,

Sam

[FootsieNG]

Thanks for the reply Sam. Got it - What is the purpose of bootstrapping the main script from the init script? 

[Anonymous]

Init script allows the larger script to load after the HTML body has been parsed. Non-blocking, best practice. RequireJS with BackboneJS works the same way.

[Tenerifekiwi]

Hi,

Can this also be done to improve the loading of paid for Apps or will trying to host them on shopify break them in some way.

Cheers,   Phil