Optimizely implementation in an angular2 single page application (SPA)
What's the best way to implement the optimizely code in a single-page application written with angular2?
At the moment we have the main snippet within GTM, which I now know is not the best way, according to this article: https://help.optimizely.com/Set_Up_Optimizely/How_Optimizely_affects_page_load_speed
So I would like to write a technical brief to my developer to understand how to place the main code properly in a single-page application.
We generally don't recommend implementing our snippet using a tag manager because it doesn't allow you to control when our snippet is loaded to your site. GTM in particular loads all scripts asynchronously, which can cause an issue where the Original page flashes in the browser window before Optimizely applies changes. This can be a confusing experience for users. You can read more about this issue here.
By default, the Optimizely snippet depends on a page reload to activate an experiment. Since Single Page Apps, by nature, don't reload when the user navigates to a new view; Optimizely doesn't get a chance to re-activate when the view changes. More information on this subject is available here.
It looks like you're currently using Optimizely Classic with your site. Optimizely Classic was designed at time when Single Page Apps were less relevant on the web. We do still have some workarounds for using Optimizely with Single Page apps, such as manual and conditional activation— but in general, Optimizely X has more options for users running Single Page Apps.
The best solution is the simplest.