The DevOps team has noticed that the Dealers page is slow to load and shows performance spikes with database calls in the Application Insights telemetry. By viewing the details of performance monitoring through Application Insights, we will be able to drill down to the code that has affected the slow performance of the web application and fix the code.

In this lab, you will learn how to set up Application Insights telemetry, and drill down into performance monitoring data through Application Insights in the new Azure Portal.

DevOps MPP Course Source

Lab Video:

Pre-Requisites:

  • Code Editor (VSCode, Eclipse, etc.)

  • Continuous Integration build with Gradle to the PartsUnlimitedMRP virtual machine (see link)

  • Continuous Deployment with hosted agent (see link)

Lab Tasks:

  1. Set up Application Insights for PartsUnlimitedMRP

  2. Using Application Performance Monitoring to resolve performance issues

Estimated Lab Time:

  • approx. 45 minutes

Task 1: Create the Application Insights Resource on Azure

  1. In an Internet browser, navigate to http://portal.azure.com and sign in with your credentials.

  2. Click on the + Create a resource tile on the left column, Search for Application Insights, and click on the first result Application Insights, then in the right-hand pane, click Create.

  3. Enter the Name as PartsUnlimitedMVPInsights, for the Application Type, choose Java web application. We recommand to deploy this resource in the same Resource Group that you choose for the virtual machine in the previous HOL. Click Use existing and choose or type the name of the resource group. Finally, choose a region that is located near to you.

Task 2: Set up Application Insights for PartsUnlimitedMRP

  1. Still from the Azure Portal : http://portal.azure.com go to the resource group where you placed Application Insights and open the Application Insights telemetry service previsously created for PartsUnlimitedMRP.

  2. Within you Appication Insights service go to CONFIGURE > Properties and locate the INSTRUMENTATION KEY.

  3. Copy the Instrumentation Key, you will need this when inserting the key into the ApplicationInsights.xml file in PartsUnlimitedMRP’s resources folder.

  4. Navigate to the working folders of the PartsUnlimitedMRP repo in a code editor (such as Visual Studio Code).

  5. In PartsUnlimitedMRP/src/Backend/OrderService/build.gradle, confirm that the build file is importing com.microsoft.appinsights.* and is also compiling com.microsoft.azure:applicationinsights-core:1.n.

  6. In PartsUnlimitedMRP/src/OrderService/src/main/resources/ApplicationInsights.xml, paste in the instrumentation key that you copied previously from the Azure Portal in between the <InstrumentationKey> tags.

  7. Additionally, verify that the following telemetry modules and telemetry initializers exist in between the <TelemetryModules> and <TelemetryIntializers> tags.

    Telemetry Modules:

     <TelemetryModules>
         <Add type="com.microsoft.applicationinsights.web.extensibility.modules.WebRequestTrackingTelemetryModule"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.modules.WebSessionTrackingTelemetryModule"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.modules.WebUserTrackingTelemetryModule"/>		
         </TelemetryModules>
    

    Telemetry Initializers:

     <TelemetryInitializers>
         <Add type="com.microsoft.applicationinsights.web.extensibility.initializers.WebOperationIdTelemetryInitializer"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.initializers.WebOperationNameTelemetryInitializer"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.initializers.WebSessionTelemetryInitializer"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.initializers.WebUserTelemetryInitializer"/>
         <Add type="com.microsoft.applicationinsights.web.extensibility.initializers.WebUserAgentTelemetryInitializer"/>
     </TelemetryInitializers>
    

  8. Return to the Azure Portal and under the Application Insights telemetry for PartsUnlimitedMRP, click on the tile in the overview timeline for application health, “Learn how to collect browser page load data.” Once you click on it, a new panel should open that shows the end-user usage analytics code. Copy lines 8 through 17 (the script itself).

  9. Back in the code editor, we will want to insert the script code previously copied before the end of the <HEAD> tag for each of the HTML pages in PartsUnlimitedMRP, starting with the index page. In PartsUnlimitedMRP/src/Clients/Web/index.html, paste the script code before the other scripts inside of the <HEAD> tag.

  10. Repeat step 10 for the following HTML files:

    • PartsUnlimitedMRP/src/Clients/Web/pages/catalog/catalog.html
    • PartsUnlimitedMRP/src/Clients/Web/pages/dealers/dealers.html
    • PartsUnlimitedMRP/src/Clients/Web/pages/deliveries/deliveries.html
    • PartsUnlimitedMRP/src/Clients/Web/pages/orders/orders.html
    • PartsUnlimitedMRP/src/Clients/Web/pages/quotes/quotes.html
  11. Commit and push the changes to kick off the Continuous Integration build with Gradle.

  12. Return to the Azure Portal into the PartsUnlimitedMRP Application Insights telemetry to find data available for browser page loading and dependency durations. It may take a few moments for Application Insights to reload.

Task 3: Using Application Performance Monitoring to resolve performance issues

  1. In an Internet browser, navigate to the PartsUnlimitedMRP website that you previously deployed and go to the Dealers page. You’ll notice immediately that the page takes a while for the dealers to load on the left-hand side.

  2. Click on the “Browse All” tile on the left column, select “Application Insights,” and click on the name of your Application Insights telemetry for your web app.

  3. After selecting the Application Insights telemetry for your web app, in the left-hand pane, scroll down and select the “Performance” to view performance monitoring information.

  4. In the performance tile of the Application Insights telemetry, note the timeline. The timeline data may not show up immediately, so you will want to wait for a few minutes for the telemetry to collect performance data.

  5. Once data shows in the timeline, view the operations listed under the Operation Name section under the timeline. Click around a variety of pages in the website, and return to this list of operations. Refresh it until other operations appear. You’ll notice that the “/dealers” page is problematic. Click on the “/dealers” operation to view details of that operation.

  6. In the right-hand pane, click “Samples” at the bottom of the page to see the related issues. In the blade that opens, select a long-running operation from teh “All” list, and click it. In the detail blade that opens, note the details of the request, and note the “Calls to Remote Dependencies” that shows the problematic calls.

  7. Navigate to the working folders of the PartsUnlimitedMRP repo in a code editor (such as VSCode).

  8. The problem is the call to MongoDB.findAll that’s coming from the dealers page. Find the getDealers() method in PartsUnlimitedMRP/src/Backend/OrderService/src/main/java/smpl/ordering/controllers/DealerController.java that is causing slow performance.

  9. In the getDealers() method, notice that there is a database call 100000 times with the variable, numMongoDBCalls. Change the value of this variable to be 1 so that there is only one call to the database to populate the dealers list.

  10. Save the changes and commit the changes on the master branch. Push the changes to the remote repo in VSO to kick off a Continuous Integration build. (You may have to also Sync, depending upon how VSCode is configured).

  11. Now that our changes have deployed to the website, open up a new incognito browser window (to prevent caching) and return to the Dealers page. The dealers will show up faster than they did previously now having one call to the database.

  12. Return to the Application Insights performance monitoring view in the Azure Preview Portal and refresh the page. If you continue to access the dealers page, you will see the average reponse time falling for the “/dealers” page.

Summary

In this lab, you learned how to set up Application Insights telemetry, and drill down into performance monitoring data through Application Insights in the Azure Portal.

Further Resources**

Continuous Feedback

Issues / Questions about this HOL ??

If you are encountering some issues or questions during this Hands on Labs, please open an issue by clicking here

Thanks