Iterative Migration Tutorial

• Gradual Roll Out: This approach gradually shifts traffic for a specific change or improvement from the legacy site to the new site. This gradual approach balances risk with efficiency by allowing you to verify functionality as you switch a feature or a page to the new site.
• Gradual Site Buildout: This approach shifts all traffic for a specific change or improvement from the legacy site to the new site. This approach is ideal for small changes, vetted changes, or if you value efficiency over an occassional issue.

• An entry environment through which traffic will be routed.
• A destination environment to which traffic for the current website will be routed.
• A destination environment to which traffic for the new website will be routed.

Quick Start #

1. Set up an environment for the current website.
2. Set up an environment for the new website.
   If you are using Edgio Sites, Cloud Functions, or Edge Functions, then you should set up this environment within a different property’s production environment.
3. Set up an environment that will split traffic between the above environments.
   1. Remove all rules.
   2. Create an origin configuration for each environment to which traffic will be split.
   3. Create an experiment.
4. If you are using Edgio Sites, Cloud Functions, or Edge Functions, then you should set the environment defined in step 1 as the production environment.
5. Test and monitor the experiment.
6. Adjust traffic splitting.
7. Conclude the experiment

Assumptions #

• Your website is already hosted on Edgio.
• You are familiar with the following concepts:
  • Edgio Console: If you deploy changes through the Edgio Console, then you should be familiar with the following concepts:
    • Properties and environments.
    • Setting up origin configurations.
    • Deploying through the Edgio Console.
  • CDN-as-Code: If you deploy changes through the Edgio CLI, then you should be familiar with the:
    • edgio.config.js file
    • routes.[js|ts] file
    • Deploying through the Edgio CLI.

Identifying the Entry Environment #

1. Create or identify the entry environment.
2. Register the desired hostname(s) within the entry environment.
3. Set up TLS for each registered hostname.

Setting Up the Current Website’s Environment #

1. Create an environment.
   1. Navigate to the Environments page and click + New Environment.
   2. Set the Name option to current-site.
   3. From the Copy settings from environment option, select your production environment.
   4. Click Create.

   

2. Deploy your changes.
3. Verify your website’s functionality using a URL generated by the deployment.

   

1. Run the following command from your project’s root directory:
   Bash

   Copy

   1edgio deploy --environment current-site

2. Verify your website’s functionality using a URL generated by the deployment.

Setting Up the New Website’s Environment #

1. Create an environment called new-site.
   1. Navigate to the Environments page and then click + New Environment.
   2. Set the Name option to new-site.
   3. From the Copy settings from environment option, select your production environment.
   4. Click Create.
2. Optional. Adjust your rules to reflect any changes required by your new site.
3. Optional. Adjust your origin configuration(s) to reflect any changes required by your new site.
4. Deploy your changes.
5. Test your new website using a URL generated by the deployment.

1. Create a copy of your project.
2. Optional. Place your new project under source control.
3. Optional. From within your routes.[js|ts] file, adjust your rules to reflect any changes required by your new site.
4. Optional. From within your edgio.config.js file, adjust your origin configuration(s) to reflect any changes required by your new site.
5. Set up this environment within a different property’s production environment by running the following command from your project’s root directory:
   Bash

   Copy

   1edgio deploy --property migration-second-variant --environment=new-site

6. Set new-site as the production environment.
   Learn how to set the production environment.
7. Verify your website’s functionality using a URL generated by the deployment.

Setting Up the Entry Environment #

1. Identify your production environment.
2. Create an origin configuration that points to the current-site environment.
   1. Navigate to the current-site environment’s Deployments page.
   2. Load the most recent deployment.
   3. Copy a domain from the URL section.

      

   4. From the entry environment’s Origins page, create an origin configuration.
      1. Click + Add Origin.
      2. Set the Name option to current-site.
      3. Paste the domain, which was copied in the previous step, within the Override Host Header option.
      4. Paste the domain, which was copied in the previous step, within the Origin Hostname option.
      5. If the domain contains .glb, remove it from both options.
      6. Verify that the Use the following SNI hint and enforce origin SAN/CN checking option was autopopulated with the same domain.
      Your origin configuration should should look similar to the following illustration:

      

3. Create an origin configuration called new-site. Point this origin configuration to the new-site environment.
   1. Navigate to the new-site environment’s Deployments page.
   2. Load the most recent deployment.
   3. Copy a domain from the URL section.
   4. From the entry environment’s Origins page, create an origin configuration. Set the
      1. Click + Add Origin.
      2. Set the Name option to new-site.
      3. Paste the domain, which was copied in the previous step, within the Override Host Header option.
      4. Paste the domain, which was copied in the previous step, within the Origin Hostname option.
      5. If the domain contains .glb, remove it from both options.
      6. Verify that the Use the following SNI hint and enforce origin SAN/CN checking option was autopopulated with the same domain.
4. Create an experiment.
   1. Configure the first variant to:
      • Receive 90% of the site’s traffic.
      • Set the origin to current-site.

        

   2. Configure the second variant to:
      • Receive 10% of the site’s traffic.
      • Set the origin to new-site.

        

      Your experiment should look similar to the following illustration:

      

5. Deploy your changes. Add a label to this deployment to easily identify it in the future.

   

Production Environment #

Testing #

Monitoring #

1. Navigate to the current-site environment.
2. Load Edge Insights by clicking Edge Insights from the left-hand pane.
3. Under the Top Results section, set the pie charts to metrics that you would like to compare across both sites.
4. Repeat the above steps for the new-site environment.
5. Compare data across both environments.
   Synch the time period between both Edge Insights by clicking Now from the left-hand pane of both instances of Edge Insights.

Adjusting Traffic Ratio #

Concluding the Experiment #