Click here to Skip to main content
15,867,939 members
Articles / Web Development / ASP.NET
Tip/Trick

Debug ASP.NET MVC Application with Glimpse

Rate me:
Please Sign up or sign in to vote.
5.00/5 (11 votes)
11 Jan 2015CPOL3 min read 30.3K   16   2
Glimpse Extension for server side debugging and diagnostic information of ASP.NET applications

Introduction

For debugging and diagnostic information for ASP.NET apps, Glimpse is a NuGet package that provides detailed performance. It is fast, super-light and serves developer with best visual display for all performance matrices. It helps developer to debug performance of ASP.NET application through data access layer to presentation layer, debugging your Ajax call is a plus feature of this extension. You don’t need to read several manual pages in order to use this extension as compared to fiddler. :)

Background

The best part of Glimpse is to debug and analyze performance of all server side functionality as for client side we have Firebug, Fiddler and F-12 development tool.

Using the Code

For this tutorial, I am going to use sample Contoso University Project available at MSDN.

  1. Open ContosoUniversity.sln in Visual Studio, It is implemented using ASP.NET MVC5 and Entity Framework 6.

    Image 1

  2. Click on Manage NuGet Packages in Project Tab.

    Image 2

  3. 3a. NuGet will look for your project configuration and will recommend available glimpse extensions, type glimpse in search box.

    Image 3

    3b. You may perform the same function through NuGet Package Manager Console:

    Console Command For MVC5: Install-Package Glimpse.MVC5
    Console Command For MVC4: Install-Package Glimpse.MVC4
    Console Command For MVC3: Install-Package Glimpse.MVC3
    Console Command For WebForms: Install-Package Glimpse.Webforms

    Image 4

    Console Command For ADO.NET: Install-Package Glimpse.Ado
    Console Command For Entity Framework 6: Install-Package Glimpse.EF6
    Console Command For Entity Framework 5: Install-Package Glimpse.EF5
    Console Command For Entity Framework 4 or 3: Install-Package Glimpse.EF43

    Image 5

    If you are installing for the first time, it will automatically include Glimpse.AspNet and Glimpse.Core in order to resolve dependency.

  4. Glimpse references will be added in the project:

    Image 6

    and web.config will be updated as below:

    XML
    <configuration>
      <configSections>
        <section name="glimpse" 
        type="Glimpse.Core.Configuration.Section, Glimpse.Core" />
      </configSections>
      <system.web>
        <httpModules>
            <add name="Glimpse" 
            type="Glimpse.AspNet.HttpModule, Glimpse.AspNet" />
        </httpModules>
            <httpHandlers>
                <add path="glimpse.axd" verb="GET" 
                type="Glimpse.AspNet.HttpHandler, Glimpse.AspNet" />
            </httpHandlers>
      </system.web>
      <system.webServer>
             <modules>
                <add name="Glimpse" type="Glimpse.AspNet.HttpModule, 
                Glimpse.AspNet" preCondition="integratedMode" />
            </modules><handlers>
                <add name="Glimpse" path="glimpse.axd" 
                verb="GET" type="Glimpse.AspNet.HttpHandler, 
                Glimpse.AspNet" preCondition="integratedMode" />
            </handlers>
      </system.webServer>
      <glimpse defaultRuntimePolicy="On" endpointBaseUri="~/Glimpse.axd">
      </glimpse>
    </configuration>
  5. Build the project and open view Home/About in browser.
  6. Type /Glimpse.axd after available URL of your project.

    Image 7

  7. Click on Turn Glimpse On in order to debug your application for better performance.

    Image 8

  8. Glimpse will be available at the bottom right of your browser.

    Image 9

  9. When you hover on HOST section of dashboard, it will show all trivial data about total action time, number of db connections opened, number of queries served by controller to render this view and much more.

    Image 10

  10. Click on 'g' at the bottom right on toolbar and explore all server side debugging features. Through Glimpse, you may go through cache entries.

    Image 11

  11. Glimpse will help you out to analyze performance of controller methods by displaying time elapsed for each method of controller.

    Image 12

  12. This extension will help developer in displaying all key-values of cookie, parameters of query string and attributes of http header.

    Image 13

  13. Best part of Glimpse is to display duration of each SQL query under SQL tab.

    Image 14

  14. Then comes timeline analysis of execution of each event, this will help developer to look for area of concern in a more prominent way.

    Image 15

Points of Interest

There might be a chance that you are not using entity framework in your project, then for ADO.NET, to retrieve data for the SQL tab, Glimpse attaches itself by providing its own GlimpseDbProviderFactory which wraps the standard ones. This lets it collect information about how you're using your data connections. If you're not using an ADO connection that uses the DbProviderFactories, Glimpse won't collect any data for the SQL tab.

JavaScript
DbProviderFactory factory = DbProviderFactories.GetFactory("System.Data.SqlClient");
            using (var connection = factory.CreateConnection())
            {
                using (var command = factory.CreateCommand())
                {
                    try
                    {
                        connection.ConnectionString = connString;
                        command.Connection = connection;
                        command.CommandType = CommandType.StoredProcedure;
                        command.CommandText = "StoreProcedureName";
                        
                        var parameters = new[]{
                             new SqlParameter(){ ParameterName="@param1", Value = param1 }
                        };
                        command.Parameters.AddRange(parameters);
                        command.CommandTimeout = ConnectionTimeOut;
                        connection.Open();
                        
                        using (var myReader = DbProviderFactories.GetFactory
                        ("System.Data.SqlClient").CreateDataAdapter())
                        {
                            //code here
                        }                        
                    }
                    finally
                    {
                        if (command.Connection.State == ConnectionState.Open)
                            command.Connection.Close();
                    }
                }
            }

The code is available @Github: https://github.com/m-hassan-tariq/GlimpseforMVCContosoUniversity.

History

  • Version 1.0

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer
United States United States
Five+ years of demonstrated work experience in developing and implementing business technology applications, systems integration and testing solutions with in-depth domain knowledge of industries like Healthcare, Telecom, Call Center, Financial Instruments, Payroll, HR, and skills including, but not limited to, software analysis, design and development.

Comprehensive understanding of NET Framework 4.5, 4.0, 2.0 and C#, ASP.Net, ADO.Net, Entity Framework, LINQ, Web Service, WCF, AJAX Control Toolkit, Advanced JavaScript, HTML 5.0, CSS3.0, jQuery, SSIS, SSRS, XML, XSLT, JSON.

Expertise in end to end development of enterprise web application and Single Page Application (SPA) using ASP.NET MVC, ASP.NET Web Forms, ASP.NET Web API, AngularJS, TypeScript, NodeJS, SQL Server and Design Pattern fanatic.

Comments and Discussions

 
GeneralMy vote of 5 Pin
Humayun Kabir Mamun11-Jan-15 18:55
Humayun Kabir Mamun11-Jan-15 18:55 
GeneralRe: My vote of 5 Pin
Muhammad Hassan Tariq11-Jan-15 20:35
professionalMuhammad Hassan Tariq11-Jan-15 20:35 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.