<p>I am trying to implement blue/green deployment for my application. I am using istio <code>VirtuaService</code> for navigating to blue environment or green environment based on clientId in request header. Backends are working fine.</p>
<p>My concern is the frontend. How can I implement blue green for Angular ui at frontend? Since it’s a single page application, entire ui loads up during initial load.</p>
<p>What should be the strategy for angular blue/green deployment?</p>

<p>It's hard for you to get an unambiguous answer about</p>
<blockquote>
<p>What should be the strategy for angular blue / green deployment?</p>
</blockquote>
<p>It may all depend on how you set up the cluster, what your application configuration looks like, what your network settings are, and much more. However, you can use many guides on how to correctly create a blue / green deployment:</p>
<ul>
<li><a href="https://medium.com/geekculture/simple-yet-scalable-blue-green-deployments-in-aws-eks-87815aa37c03" rel="nofollow noreferrer">simple blue/green deployment in AWS EKS</a></li>
<li><a href="https://semaphoreci.com/blog/continuous-blue-green-deployments-with-kubernetes" rel="nofollow noreferrer">continuous blue/green deployments</a></li>
<li><a href="http://blog.itaysk.com/2017/11/20/deployment-strategies-defined" rel="nofollow noreferrer">blue/green deployment strategies defined</a></li>
<li><a href="https://codefresh.io/blue-green-deployments-kubernetes/" rel="nofollow noreferrer">how work blue/green deployment</a></li>
</ul>
<p>One more point to consider. You will need two separate complete environments to be able to create a blue / green update. Look at the <a href="https://stackoverflow.com/questions/42358118/blue-green-deployments-vs-rolling-deployments">differences</a> between blue/green deployments and <a href="https://kubernetes.io/docs/tutorials/kubernetes-basics/update/update-intro/" rel="nofollow noreferrer">rolling update</a>:</p>
<blockquote>
<p>In  <strong>Blue Green Deployment</strong>, you have  <strong>TWO</strong>  complete environments.
One is Blue environment which is running and the Green environment to which you want to upgrade. Once you swap the environment from blue to green, the traffic is directed to your new green environment. You can delete or save your old blue environment for backup until the green environment is stable.
In  <strong>Rolling Deployment</strong>, you have only  <strong>ONE</strong>  complete environment.
Once you start upgrading your environment. The code is deployed in the subset of instances of the same environment and moves to another subset after completion</p>
</blockquote>
<p>So if you decide to blue/green update, you need to create 2 separate, equivalent environments, then modify the environment with Angular UI, and then update.</p>
