Search code examples
javascriptmvc-mini-profiler

Profiling JavaScript code using MiniProfiler

MiniProfiler can log Ajax calls and display a breakdown of the timings.

Is it also possible to add custom steps to my JavaScript code?

Solution

  • You can time client-side script execution time by using the TimeScript command in a Razor view.

    Example from Sample.MVC:

    <head>
  @this.InitClientTimings()
  @this.TimeScript("jQuery 2.0.3", @<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js" type="text/javascript"></script>)

  @using (profiler.Step("<head> rendering"))
  {
    <title>@ViewBag.Title - MVC MiniProfiler Demo</title>
    @(this.TimeScript("Our CSS", @<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />))
    @RenderSection("head", required:false)
  }
</head>

    Here the time spent loading the jQuery and CSS scripts are being timed. You could of course inject any client-side code using this function.