Author: Edd Barrett <vex...@gmail.com> Branch: ui_improvements Changeset: r269:c6415f862f16 Date: 2015-05-01 11:41 +0100 http://bitbucket.org/pypy/jitviewer/changeset/c6415f862f16/
Log: Various UI improvements. Display loop list as a table. Include columns for length, times executes, # of new ops, # of call ops. Display loop description in a more palatable manner. Unfloat the menu so it can't cover the traces (pet hate). Feedback welcomed. diff --git a/_jitviewer/app.py b/_jitviewer/app.py --- a/_jitviewer/app.py +++ b/_jitviewer/app.py @@ -91,6 +91,26 @@ self.filename = filename self.storage = storage + def count_artefacts(self, loop): + calls = news = 0 + for op in loop.operations: + if "call" in op.name: + calls += 1 + if op.name.startswith("new"): + news += 1 + return calls, news + + def parse_repr(self, r): + elems = r.split(",") + title = elems[0] + if len(elems) == 1: + filenm = None + line = None + else: + filenm = elems[1] + line = elems[2] + return title, filenm, line + def index(self): all = flask.request.args.get('all', None) loops = [] @@ -106,6 +126,11 @@ func = DummyFunc() func.count = getattr(loop, 'count', '?') func.descr = mangle_descr(loop.descr) + func.n_ops = len(loop.operations) + + func.n_calls, func.n_news = self.count_artefacts(loop) + func.title, func.filenm, func.line = self.parse_repr(func.repr()) + loops.append(func) loops.sort(lambda a, b: cmp(b.count, a.count)) if len(loops) > CUTOFF: diff --git a/_jitviewer/static/style.css b/_jitviewer/static/style.css --- a/_jitviewer/static/style.css +++ b/_jitviewer/static/style.css @@ -1,5 +1,6 @@ /*HTML5 Reset*/ -a,abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{ margin:0; padding:0; border:0; font-size:100%; font-weight:inherit; font-style:inherit; vertical-align:baseline}article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{ display:block}a,ins,del{ text-decoration:none}ul,ol{ list-style:none}table{ border-spacing:0; border-collapse:collapse}caption,th{ text-align:left}q:after,q:before{ content:��} +/*a,abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{ margin:0; padding:0; border:0; font-size:100%; font-weight:inherit; font-style:inherit; vertical-align:baseline}article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{ display:block}a,ins,del{ text-decoration:none}ul,ol{ list-style:none}table{ border-spacing:0; border-collapse:collapse}caption,th{ text-align:left}q:after,q:before{ content:��} + * */ /*End of HTML5 Reset*/ /* General Layout & Typography @@ -69,14 +70,14 @@ #main { display: block; float: left; - width: 90%; + width: 97%; margin-left: 30px; } header { display: block; - width: 360px; + /*width: 95%; */ - position: fixed; + /*position: fixed; */ top: 10px; right: 10px; @@ -137,9 +138,10 @@ -moz-box-shadow: 0px 0px 7px #cacaca; -webkit-box-shadow: 0px 0px 7px #cacaca; box-shadow: 0px 0px 7px #cacaca; - margin-left: 100px; + /*margin-left: 100px; padding-bottom: 5px; padding-top: 5px; + */ } .single-operation { @@ -249,5 +251,23 @@ font-size: 25px; } +th { + text-align: left; + background-color: #cccccc; +} + +tr:nth-child(even) { + background-color: #dddddd; +} + +table { + font-size: small; + border-spacing: 3px; +} + +.count { + text-align: right; +} + /* End of Formatting -----------------------------------------*/ diff --git a/_jitviewer/templates/index.html b/_jitviewer/templates/index.html --- a/_jitviewer/templates/index.html +++ b/_jitviewer/templates/index.html @@ -19,6 +19,7 @@ </script> </head> <body> + <h1>JIT Viewer</h1> <header> <div class="menu">Menu</div> <a id="asmtoggler" href="#">Show assembler [a]</a><br> @@ -26,7 +27,6 @@ <div id="callstack"> </div> </header> - <h1>JIT Viewer</h1> <!-- <div id="title"> <span id="title-text">JIT viewer</span> @@ -36,11 +36,23 @@ Filter [/]: <input id="inp-bar" type="text" size="80"></input> <div> <div id="loops"> - <ul> + <table> + <tr style="background-color: #cccccc;"><th>Loop</th><th>execs</th><th>ops</th><th>news</th><th>calls</th></tr> {% for item in loops %} - <li class="loopitem" id="{{item.descr}}" name="{{item.repr()}}"><span><a href="#" data-name="{{ item.descr }}">{{item.repr()}}</a> run {{item.count}} times</span></li> + <tr class="loopitem" id="{{item.descr}}" name="{{item.repr()}}"> + <!--<li class="loopitem" id="{{item.descr}}" name="{{item.repr()}}"><span><a href="#" data-name="{{ item.descr }}">{{item.repr()}}</a> run {{item.count}} times</span></li>--> + <td> + <i><a href="#" data-name="{{ item.descr }}">{{item.title}}</a></i> + {% if item.filenm %} + <br /> {{item.filenm}} + {% endif %} + {% if item.line %} + <br /> {{item.line}} + {% endif %} + </td><td class="count">{{item.count}}</td><td class="count">{{item.n_ops}}</td><td class="count">{{item.n_news}}</td><td class="count">{{item.n_calls}}</td> + </tr> {% endfor %} - </ul> + </table> {% if extra_data %} <a href="/?all=true">{{extra_data}}</a> {% endif %} _______________________________________________ pypy-commit mailing list pypy-commit@python.org https://mail.python.org/mailman/listinfo/pypy-commit