parent
784d148e50
commit
f955b8f375
GPG Key ID:
284488987C31F630
@ -0,0 +1,419 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg version="1.1" width="1200" height="182" onload="init(evt)" viewBox="0 0 1200 182" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><!--Flame graph stack visualization. See https://github.com/brendangregg/FlameGraph for latest version, and http://www.brendangregg.com/flamegraphs.html for examples.--><!--NOTES: --><defs><linearGradient id="background" y1="0" y2="1" x1="0" x2="0"><stop stop-color="#eeeeee" offset="5%"/><stop stop-color="#eeeeb0" offset="95%"/></linearGradient></defs><style type="text/css">
|
||||
text { font-family:"Verdana"; font-size:12px; fill:rgb(0,0,0); }
|
||||
#title { text-anchor:middle; font-size:17px; }
|
||||
#search { opacity:0.1; cursor:pointer; }
|
||||
#search:hover, #search.show { opacity:1; }
|
||||
#subtitle { text-anchor:middle; font-color:rgb(160,160,160); }
|
||||
#unzoom { cursor:pointer; }
|
||||
#frames > *:hover { stroke:black; stroke-width:0.5; cursor:pointer; }
|
||||
.hide { display:none; }
|
||||
.parent { opacity:0.5; }
|
||||
</style><script type="text/ecmascript"><![CDATA[var nametype = 'Function:';
|
||||
var fontsize = 12;
|
||||
var fontwidth = 0.59;
|
||||
var xpad = 10;
|
||||
var inverted = false;
|
||||
var searchcolor = 'rgb(230,0,230)';
|
||||
var fluiddrawing = true;
|
||||
var truncate_text_right = false;]]><![CDATA["use strict";
|
||||
var details, searchbtn, unzoombtn, matchedtxt, svg, searching, frames;
|
||||
function init(evt) {
|
||||
details = document.getElementById("details").firstChild;
|
||||
searchbtn = document.getElementById("search");
|
||||
unzoombtn = document.getElementById("unzoom");
|
||||
matchedtxt = document.getElementById("matched");
|
||||
svg = document.getElementsByTagName("svg")[0];
|
||||
frames = document.getElementById("frames");
|
||||
searching = 0;
|
||||
|
||||
// Use GET parameters to restore a flamegraph's state.
|
||||
var restore_state = function() {
|
||||
var params = get_params();
|
||||
if (params.x && params.y)
|
||||
zoom(find_group(document.querySelector('[x="' + params.x + '"][y="' + params.y + '"]')));
|
||||
if (params.s)
|
||||
search(params.s);
|
||||
};
|
||||
|
||||
if (fluiddrawing) {
|
||||
// Make width dynamic so the SVG fits its parent's width.
|
||||
svg.removeAttribute("width");
|
||||
// Edge requires us to have a viewBox that gets updated with size changes.
|
||||
var isEdge = /Edge\/\d./i.test(navigator.userAgent);
|
||||
if (!isEdge) {
|
||||
svg.removeAttribute("viewBox");
|
||||
}
|
||||
var update_for_width_change = function() {
|
||||
if (isEdge) {
|
||||
svg.attributes.viewBox.value = "0 0 " + svg.width.baseVal.value + " " + svg.height.baseVal.value;
|
||||
}
|
||||
|
||||
// Keep consistent padding on left and right of frames container.
|
||||
frames.attributes.width.value = svg.width.baseVal.value - xpad * 2;
|
||||
|
||||
// Text truncation needs to be adjusted for the current width.
|
||||
var el = frames.children;
|
||||
for(var i = 0; i < el.length; i++) {
|
||||
update_text(el[i]);
|
||||
}
|
||||
|
||||
// Keep search elements at a fixed distance from right edge.
|
||||
var svgWidth = svg.width.baseVal.value;
|
||||
searchbtn.attributes.x.value = svgWidth - xpad - 100;
|
||||
matchedtxt.attributes.x.value = svgWidth - xpad - 100;
|
||||
};
|
||||
window.addEventListener('resize', function() {
|
||||
update_for_width_change();
|
||||
});
|
||||
// This needs to be done asynchronously for Safari to work.
|
||||
setTimeout(function() {
|
||||
unzoom();
|
||||
update_for_width_change();
|
||||
restore_state();
|
||||
}, 0);
|
||||
} else {
|
||||
restore_state();
|
||||
}
|
||||
}
|
||||
// event listeners
|
||||
window.addEventListener("click", function(e) {
|
||||
var target = find_group(e.target);
|
||||
if (target) {
|
||||
if (target.nodeName == "a") {
|
||||
if (e.ctrlKey === false) return;
|
||||
e.preventDefault();
|
||||
}
|
||||
if (target.classList.contains("parent")) unzoom();
|
||||
zoom(target);
|
||||
|
||||
// set parameters for zoom state
|
||||
var el = target.querySelector("rect");
|
||||
if (el && el.attributes && el.attributes.y && el.attributes._orig_x) {
|
||||
var params = get_params()
|
||||
params.x = el.attributes._orig_x.value;
|
||||
params.y = el.attributes.y.value;
|
||||
history.replaceState(null, null, parse_params(params));
|
||||
}
|
||||
}
|
||||
else if (e.target.id == "unzoom") {
|
||||
unzoom();
|
||||
|
||||
// remove zoom state
|
||||
var params = get_params();
|
||||
if (params.x) delete params.x;
|
||||
if (params.y) delete params.y;
|
||||
history.replaceState(null, null, parse_params(params));
|
||||
}
|
||||
else if (e.target.id == "search") search_prompt();
|
||||
}, false)
|
||||
// mouse-over for info
|
||||
// show
|
||||
window.addEventListener("mouseover", function(e) {
|
||||
var target = find_group(e.target);
|
||||
if (target) details.nodeValue = nametype + " " + g_to_text(target);
|
||||
}, false)
|
||||
// clear
|
||||
window.addEventListener("mouseout", function(e) {
|
||||
var target = find_group(e.target);
|
||||
if (target) details.nodeValue = ' ';
|
||||
}, false)
|
||||
// ctrl-F for search
|
||||
window.addEventListener("keydown",function (e) {
|
||||
if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {
|
||||
e.preventDefault();
|
||||
search_prompt();
|
||||
}
|
||||
}, false)
|
||||
// functions
|
||||
function get_params() {
|
||||
var params = {};
|
||||
var paramsarr = window.location.search.substr(1).split('&');
|
||||
for (var i = 0; i < paramsarr.length; ++i) {
|
||||
var tmp = paramsarr[i].split("=");
|
||||
if (!tmp[0] || !tmp[1]) continue;
|
||||
params[tmp[0]] = decodeURIComponent(tmp[1]);
|
||||
}
|
||||
return params;
|
||||
}
|
||||
function parse_params(params) {
|
||||
var uri = "?";
|
||||
for (var key in params) {
|
||||
uri += key + '=' + encodeURIComponent(params[key]) + '&';
|
||||
}
|
||||
if (uri.slice(-1) == "&")
|
||||
uri = uri.substring(0, uri.length - 1);
|
||||
if (uri == '?')
|
||||
uri = window.location.href.split('?')[0];
|
||||
return uri;
|
||||
}
|
||||
function find_child(node, selector) {
|
||||
var children = node.querySelectorAll(selector);
|
||||
if (children.length) return children[0];
|
||||
return;
|
||||
}
|
||||
function find_group(node) {
|
||||
var parent = node.parentElement;
|
||||
if (!parent) return;
|
||||
if (parent.id == "frames") return node;
|
||||
return find_group(parent);
|
||||
}
|
||||
function orig_save(e, attr, val) {
|
||||
if (e.attributes["_orig_" + attr] != undefined) return;
|
||||
if (e.attributes[attr] == undefined) return;
|
||||
if (val == undefined) val = e.attributes[attr].value;
|
||||
e.setAttribute("_orig_" + attr, val);
|
||||
}
|
||||
function orig_load(e, attr) {
|
||||
if (e.attributes["_orig_"+attr] == undefined) return;
|
||||
e.attributes[attr].value = e.attributes["_orig_" + attr].value;
|
||||
e.removeAttribute("_orig_" + attr);
|
||||
}
|
||||
function g_to_text(e) {
|
||||
var text = find_child(e, "title").firstChild.nodeValue;
|
||||
return (text)
|
||||
}
|
||||
function g_to_func(e) {
|
||||
var func = g_to_text(e);
|
||||
// if there's any manipulation we want to do to the function
|
||||
// name before it's searched, do it here before returning.
|
||||
return (func);
|
||||
}
|
||||
function update_text(e) {
|
||||
var r = find_child(e, "rect");
|
||||
var t = find_child(e, "text");
|
||||
var w = parseFloat(r.attributes.width.value) * frames.attributes.width.value / 100 - 3;
|
||||
var txt = find_child(e, "title").textContent.replace(/\([^(]*\)$/,"");
|
||||
t.attributes.x.value = format_percent((parseFloat(r.attributes.x.value) + (100 * 3 / frames.attributes.width.value)));
|
||||
// Smaller than this size won't fit anything
|
||||
if (w < 2 * fontsize * fontwidth) {
|
||||
t.textContent = "";
|
||||
return;
|
||||
}
|
||||
t.textContent = txt;
|
||||
// Fit in full text width
|
||||
if (/^ *\$/.test(txt) || t.getComputedTextLength() < w)
|
||||
return;
|
||||
if (truncate_text_right) {
|
||||
// Truncate the right side of the text.
|
||||
for (var x = txt.length - 2; x > 0; x--) {
|
||||
if (t.getSubStringLength(0, x + 2) <= w) {
|
||||
t.textContent = txt.substring(0, x) + "..";
|
||||
return;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Truncate the left side of the text.
|
||||
for (var x = 2; x < txt.length; x++) {
|
||||
if (t.getSubStringLength(x - 2, txt.length) <= w) {
|
||||
t.textContent = ".." + txt.substring(x, txt.length);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
t.textContent = "";
|
||||
}
|
||||
// zoom
|
||||
function zoom_reset(e) {
|
||||
if (e.attributes != undefined) {
|
||||
orig_load(e, "x");
|
||||
orig_load(e, "width");
|
||||
}
|
||||
if (e.childNodes == undefined) return;
|
||||
for(var i = 0, c = e.childNodes; i < c.length; i++) {
|
||||
zoom_reset(c[i]);
|
||||
}
|
||||
}
|
||||
function zoom_child(e, x, ratio) {
|
||||
if (e.attributes != undefined) {
|
||||
if (e.attributes.x != undefined) {
|
||||
orig_save(e, "x");
|
||||
e.attributes.x.value = format_percent((parseFloat(e.attributes.x.value) - x) * ratio);
|
||||
if (e.tagName == "text") {
|
||||
e.attributes.x.value = format_percent(parseFloat(find_child(e.parentNode, "rect[x]").attributes.x.value) + (100 * 3 / frames.attributes.width.value));
|
||||
}
|
||||
}
|
||||
if (e.attributes.width != undefined) {
|
||||
orig_save(e, "width");
|
||||
e.attributes.width.value = format_percent(parseFloat(e.attributes.width.value) * ratio);
|
||||
}
|
||||
}
|
||||
if (e.childNodes == undefined) return;
|
||||
for(var i = 0, c = e.childNodes; i < c.length; i++) {
|
||||
zoom_child(c[i], x, ratio);
|
||||
}
|
||||
}
|
||||
function zoom_parent(e) {
|
||||
if (e.attributes) {
|
||||
if (e.attributes.x != undefined) {
|
||||
orig_save(e, "x");
|
||||
e.attributes.x.value = "0.0%";
|
||||
}
|
||||
if (e.attributes.width != undefined) {
|
||||
orig_save(e, "width");
|
||||
e.attributes.width.value = "100.0%";
|
||||
}
|
||||
}
|
||||
if (e.childNodes == undefined) return;
|
||||
for(var i = 0, c = e.childNodes; i < c.length; i++) {
|
||||
zoom_parent(c[i]);
|
||||
}
|
||||
}
|
||||
function zoom(node) {
|
||||
var attr = find_child(node, "rect").attributes;
|
||||
var width = parseFloat(attr.width.value);
|
||||
var xmin = parseFloat(attr.x.value);
|
||||
var xmax = xmin + width;
|
||||
var ymin = parseFloat(attr.y.value);
|
||||
var ratio = 100 / width;
|
||||
// XXX: Workaround for JavaScript float issues (fix me)
|
||||
var fudge = 0.001;
|
||||
unzoombtn.classList.remove("hide");
|
||||
var el = frames.children;
|
||||
for (var i = 0; i < el.length; i++) {
|
||||
var e = el[i];
|
||||
var a = find_child(e, "rect").attributes;
|
||||
var ex = parseFloat(a.x.value);
|
||||
var ew = parseFloat(a.width.value);
|
||||
// Is it an ancestor
|
||||
if (!inverted) {
|
||||
var upstack = parseFloat(a.y.value) > ymin;
|
||||
} else {
|
||||
var upstack = parseFloat(a.y.value) < ymin;
|
||||
}
|
||||
if (upstack) {
|
||||
// Direct ancestor
|
||||
if (ex <= xmin && (ex+ew+fudge) >= xmax) {
|
||||
e.classList.add("parent");
|
||||
zoom_parent(e);
|
||||
update_text(e);
|
||||
}
|
||||
// not in current path
|
||||
else
|
||||
e.classList.add("hide");
|
||||
}
|
||||
// Children maybe
|
||||
else {
|
||||
// no common path
|
||||
if (ex < xmin || ex + fudge >= xmax) {
|
||||
e.classList.add("hide");
|
||||
}
|
||||
else {
|
||||
zoom_child(e, xmin, ratio);
|
||||
update_text(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
function unzoom() {
|
||||
unzoombtn.classList.add("hide");
|
||||
var el = frames.children;
|
||||
for(var i = 0; i < el.length; i++) {
|
||||
el[i].classList.remove("parent");
|
||||
el[i].classList.remove("hide");
|
||||
zoom_reset(el[i]);
|
||||
update_text(el[i]);
|
||||
}
|
||||
}
|
||||
// search
|
||||
function reset_search() {
|
||||
var el = document.querySelectorAll("#frames rect");
|
||||
for (var i = 0; i < el.length; i++) {
|
||||
orig_load(el[i], "fill")
|
||||
}
|
||||
var params = get_params();
|
||||
delete params.s;
|
||||
history.replaceState(null, null, parse_params(params));
|
||||
}
|
||||
function search_prompt() {
|
||||
if (!searching) {
|
||||
var term = prompt("Enter a search term (regexp " +
|
||||
"allowed, eg: ^ext4_)", "");
|
||||
if (term != null) {
|
||||
search(term)
|
||||
}
|
||||
} else {
|
||||
reset_search();
|
||||
searching = 0;
|
||||
searchbtn.classList.remove("show");
|
||||
searchbtn.firstChild.nodeValue = "Search"
|
||||
matchedtxt.classList.add("hide");
|
||||
matchedtxt.firstChild.nodeValue = ""
|
||||
}
|
||||
}
|
||||
function search(term) {
|
||||
var re = new RegExp(term);
|
||||
var el = frames.children;
|
||||
var matches = new Object();
|
||||
var maxwidth = 0;
|
||||
for (var i = 0; i < el.length; i++) {
|
||||
var e = el[i];
|
||||
var func = g_to_func(e);
|
||||
var rect = find_child(e, "rect");
|
||||
if (func == null || rect == null)
|
||||
continue;
|
||||
// Save max width. Only works as we have a root frame
|
||||
var w = parseFloat(rect.attributes.width.value);
|
||||
if (w > maxwidth)
|
||||
maxwidth = w;
|
||||
if (func.match(re)) {
|
||||
// highlight
|
||||
var x = parseFloat(rect.attributes.x.value);
|
||||
orig_save(rect, "fill");
|
||||
rect.attributes.fill.value = searchcolor;
|
||||
// remember matches
|
||||
if (matches[x] == undefined) {
|
||||
matches[x] = w;
|
||||
} else {
|
||||
if (w > matches[x]) {
|
||||
// overwrite with parent
|
||||
matches[x] = w;
|
||||
}
|
||||
}
|
||||
searching = 1;
|
||||
}
|
||||
}
|
||||
if (!searching)
|
||||
return;
|
||||
var params = get_params();
|
||||
params.s = term;
|
||||
history.replaceState(null, null, parse_params(params));
|
||||
|
||||
searchbtn.classList.add("show");
|
||||
searchbtn.firstChild.nodeValue = "Reset Search";
|
||||
// calculate percent matched, excluding vertical overlap
|
||||
var count = 0;
|
||||
var lastx = -1;
|
||||
var lastw = 0;
|
||||
var keys = Array();
|
||||
for (k in matches) {
|
||||
if (matches.hasOwnProperty(k))
|
||||
keys.push(k);
|
||||
}
|
||||
// sort the matched frames by their x location
|
||||
// ascending, then width descending
|
||||
keys.sort(function(a, b){
|
||||
return a - b;
|
||||
});
|
||||
// Step through frames saving only the biggest bottom-up frames
|
||||
// thanks to the sort order. This relies on the tree property
|
||||
// where children are always smaller than their parents.
|
||||
var fudge = 0.0001; // JavaScript floating point
|
||||
for (var k in keys) {
|
||||
var x = parseFloat(keys[k]);
|
||||
var w = matches[keys[k]];
|
||||
if (x >= lastx + lastw - fudge) {
|
||||
count += w;
|
||||
lastx = x;
|
||||
lastw = w;
|
||||
}
|
||||
}
|
||||
// display matched percent
|
||||
matchedtxt.classList.remove("hide");
|
||||
var pct = 100 * count / maxwidth;
|
||||
if (pct != 100) pct = pct.toFixed(1);
|
||||
matchedtxt.firstChild.nodeValue = "Matched: " + pct + "%";
|
||||
}
|
||||
function format_percent(n) {
|
||||
return n.toFixed(4) + "%";
|
||||
}
|
||||
]]></script><rect x="0" y="0" width="100%" height="182" fill="url(#background)"/><text id="title" x="50.0000%" y="24.00">Flame Graph</text><text id="details" x="10" y="165.00"> </text><text id="unzoom" class="hide" x="10" y="24.00">Reset Zoom</text><text id="search" x="1090" y="24.00">Search</text><text id="matched" x="1090" y="165.00"> </text><svg id="frames" x="10" width="1180"><g><title>[libm-2.32.so] (1 samples, 0.35%)</title><rect x="0.0000%" y="85" width="0.3460%" height="15" fill="rgb(227,0,7)"/><text x="0.2500%" y="95.50"></text></g><g><title>[unknown] (2 samples, 0.69%)</title><rect x="0.0000%" y="101" width="0.6920%" height="15" fill="rgb(217,0,24)"/><text x="0.2500%" y="111.50"></text></g><g><title>main (1 samples, 0.35%)</title><rect x="0.3460%" y="85" width="0.3460%" height="15" fill="rgb(221,193,54)"/><text x="0.5960%" y="95.50"></text></g><g><title>[libm-2.32.so] (65 samples, 22.49%)</title><rect x="61.9377%" y="53" width="22.4913%" height="15" fill="rgb(248,212,6)"/><text x="62.1877%" y="63.50">[libm-2.32.so]</text></g><g><title>minmax_t<long, minmax_t<long>(span<long> const&)::{lambda(long)#1}> (1 samples, 0.35%)</title><rect x="84.4291%" y="53" width="0.3460%" height="15" fill="rgb(208,68,35)"/><text x="84.6791%" y="63.50"></text></g><g><title>rand_r (6 samples, 2.08%)</title><rect x="84.7751%" y="53" width="2.0761%" height="15" fill="rgb(232,128,0)"/><text x="85.0251%" y="63.50">r..</text></g><g><title>rand_r@plt (2 samples, 0.69%)</title><rect x="86.8512%" y="53" width="0.6920%" height="15" fill="rgb(207,160,47)"/><text x="87.1012%" y="63.50"></text></g><g><title>rng::xoroshiro128plus::sample (3 samples, 1.04%)</title><rect x="87.5433%" y="53" width="1.0381%" height="15" fill="rgb(228,23,34)"/><text x="87.7933%" y="63.50"></text></g><g><title>sin@plt (1 samples, 0.35%)</title><rect x="88.5813%" y="53" width="0.3460%" height="15" fill="rgb(218,30,26)"/><text x="88.8313%" y="63.50"></text></g><g><title>std::vector<unsigned long, std::allocator<unsigned long> >::_M_realloc_insert<unsigned long> (22 samples, 7.61%)</title><rect x="88.9273%" y="53" width="7.6125%" height="15" fill="rgb(220,122,19)"/><text x="89.1773%" y="63.50">std::vecto..</text></g><g><title>__memmove_avx_unaligned_erms (22 samples, 7.61%)</title><rect x="88.9273%" y="37" width="7.6125%" height="15" fill="rgb(250,228,42)"/><text x="89.1773%" y="47.50">__memmove_..</text></g><g><title>__libc_start_main (281 samples, 97.23%)</title><rect x="2.0761%" y="85" width="97.2318%" height="15" fill="rgb(240,193,28)"/><text x="2.3261%" y="95.50">__libc_start_main</text></g><g><title>main (281 samples, 97.23%)</title><rect x="2.0761%" y="69" width="97.2318%" height="15" fill="rgb(216,20,37)"/><text x="2.3261%" y="79.50">main</text></g><g><title>std::vector<unsigned long, std::allocator<unsigned long> >::vector (8 samples, 2.77%)</title><rect x="96.5398%" y="53" width="2.7682%" height="15" fill="rgb(206,188,39)"/><text x="96.7898%" y="63.50">st..</text></g><g><title>__memset_avx2_erms (8 samples, 2.77%)</title><rect x="96.5398%" y="37" width="2.7682%" height="15" fill="rgb(217,207,13)"/><text x="96.7898%" y="47.50">__..</text></g><g><title>_start (286 samples, 98.96%)</title><rect x="0.6920%" y="101" width="98.9619%" height="15" fill="rgb(231,73,38)"/><text x="0.9420%" y="111.50">_start</text></g><g><title>_dl_start (1 samples, 0.35%)</title><rect x="99.3080%" y="85" width="0.3460%" height="15" fill="rgb(225,20,46)"/><text x="99.5580%" y="95.50"></text></g><g><title>_dl_sysdep_start (1 samples, 0.35%)</title><rect x="99.3080%" y="69" width="0.3460%" height="15" fill="rgb(210,31,41)"/><text x="99.5580%" y="79.50"></text></g><g><title>dl_main (1 samples, 0.35%)</title><rect x="99.3080%" y="53" width="0.3460%" height="15" fill="rgb(221,200,47)"/><text x="99.5580%" y="63.50"></text></g><g><title>all (289 samples, 100%)</title><rect x="0.0000%" y="133" width="100.0000%" height="15" fill="rgb(226,26,5)"/><text x="0.2500%" y="143.50"></text></g><g><title>shuffle3-pgo (289 samples, 100.00%)</title><rect x="0.0000%" y="117" width="100.0000%" height="15" fill="rgb(249,33,26)"/><text x="0.2500%" y="127.50">shuffle3-pgo</text></g><g><title>std::wclog (1 samples, 0.35%)</title><rect x="99.6540%" y="101" width="0.3460%" height="15" fill="rgb(235,183,28)"/><text x="99.9040%" y="111.50"></text></g><g><title>rand_r (1 samples, 0.35%)</title><rect x="99.6540%" y="85" width="0.3460%" height="15" fill="rgb(221,5,38)"/><text x="99.9040%" y="95.50"></text></g></svg></svg>
|
||||
|
After Width: | Height: | Size: 19 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue