Javascript Spaghetti Profiler

Untangling and counting the spaghettis...
Tested url:   {{phantomasResults.url}}
New test
Summary
Spaghetti
Metrics

Error: {{phantomasResults.error}}

Phantomas timed out
Phantomas config error
Phantomas failed to load page
Phantomas internal error
Javascript execution tree error

Summary

{{notations.domComplexity}}
DOM complexity
  • DOM elements count: {{phantomasResults.metrics.DOMelementsCount}}
  • DOM max depth: {{phantomasResults.metrics.DOMelementMaxDepth}}
  • Number of iframes: {{phantomasResults.metrics.iframesCount}}
{{notations.domManipulations}}
DOM read and write
  • DOM inserts: {{phantomasResults.metrics.DOMinserts}}
  • DOM queries: {{phantomasResults.metrics.DOMqueries}}
  • Time it took: {{totalJSTime}} ms
{{notations.duplicatedDomQueries}}
Duplicated DOM queries
  • Avoidable queries: {{duplicatedQueriesCountAll}}
{{notations.eventsBound}}
Events bound
  • Events bound: {{phantomasResults.metrics.eventsBound}}
{{notations.badPractices}}
Evil Javascript
  • Javascript errors: {{phantomasResults.metrics.jsErrors}}
  • eval calls: {{phantomasResults.metrics.evalCalls}}
  • document.write calls: {{phantomasResults.metrics.documentWriteCalls}}
  • Console messages: {{phantomasResults.metrics.consoleMessages}}
{{notations.scripts}}
Scripts loaded
  • Scripts count: {{phantomasResults.metrics.jsCount}}
{{notations.jQueryLoading}}
jQuery version
  • jQuery version: {{phantomasResults.metrics.jQueryVersion}}
  • {{phantomasResults.metrics.jQueryDifferentVersions}} versions loaded: {{version}} &

Javascript Spaghetti Profiler (interactions with the DOM)

Filter by
ms
Type
Params
Duration
Timestamp
{{$index}}
{{node.data.type}}
{{node.data.callDetails.arguments[0]}} : {{node.data.callDetails.arguments[1]}} : {{node.data.callDetails.arguments[2]}} : {{node.data.callDetails.arguments[3]}}
✖

Called on DOM element

{{node.data.callDetails.context.domElement}}

Called on 1 jQuery element

{{node.data.callDetails.context.firstElementPath}}

Called on {{node.data.callDetails.context.length}} jQuery elements

The .bind() method attaches the event listener to each jQuery element one by one. Using the .on() method is preferred if available (from v1.7).

First one is: {{node.data.callDetails.context.firstElementPath}}

Backtrace

{{trace.fnName || '(anonymous)'}}
{{trace.fileName || 'HTML'}}:{{trace.line}}
can't find any backtrace :/

Sub processes

Type
Params
Duration
{{$index}}
{{node.data.type}}
{{node.data.callDetails.arguments[0]}} : {{node.data.callDetails.arguments[1]}} : {{node.data.callDetails.arguments[2]}} : {{node.data.callDetails.arguments[3]}}
{{node.data.time}} ms
{{node.data.time}} ms
{{node.data.timestamp}}

Metrics from Phantomas report

Phantomas is a web performance metrics collector. You can find here the (almost) entire list of metrics from Phantomas.

{{moduleName}}

{{metricName}}: {{phantomasResults.metrics[metricName]}} {{metric.unit}}
{{metric.desc}} (unreliable)
Show offenders
Hide offenders
  • {{offender}}