@yuebai008/cli
Version:
Command line interface for rapid qg-minigame development
1 lines • 5.67 kB
JavaScript
import*as Common from"../../core/common/common.js";import*as i18n from"../../core/i18n/i18n.js";import*as Platform from"../../core/platform/platform.js";import*as TraceEngine from"../../models/trace/trace.js";import*as PerfUI from"../../ui/legacy/components/perf_ui/perf_ui.js";import*as UI from"../../ui/legacy/legacy.js";import*as ThemeSupport from"../../ui/legacy/theme_support/theme_support.js";import{NetworkTrackAppender}from"./NetworkTrackAppender.js";import timelineFlamechartPopoverStyles from"./timelineFlamechartPopover.css.js";import{FlameChartStyle,Selection}from"./TimelineFlameChartView.js";import{TimelineSelection}from"./TimelineSelection.js";export class TimelineFlameChartNetworkDataProvider{#e;#t;#i;#n;#r;#a;#o;#s;#l;constructor(){this.#e=0,this.#t=0,this.#i=[],this.#n=0,this.#r=null,this.#l=null}setModel(e){this.#a=null,this.#l=e,this.#i=e?.NetworkRequests.byTime||[],this.#l&&this.#m(this.#l)}isEmpty(){return this.timelineData(),!this.#i.length}maxStackDepth(){return this.#n}timelineData(){return this.#a&&0!==this.#a.entryLevels.length?this.#a:(this.#a=PerfUI.FlameChart.FlameChartTimelineData.createEmpty(),this.#l?(this.#i=this.#l.NetworkRequests.byTime,this.#r=new NetworkTrackAppender(this.#l,this.#a),this.#n=this.#r.appendTrackAtLevel(0),this.#a):this.#a)}minimumBoundary(){return this.#e}totalTime(){return this.#t}setWindowTimes(e,t){this.#c(e,t)}createSelection(e){if(-1===e)return null;const t=this.#i[e];return this.#o=new Selection(TimelineSelection.fromTraceEvent(t),e),this.#o.timelineSelection}entryIndexForSelection(e){if(!e)return-1;if(this.#o&&this.#o.timelineSelection.object===e.object)return this.#o.entryIndex;if(!TimelineSelection.isSyntheticNetworkRequestDetailsEventSelection(e.object))return-1;const t=this.#i.indexOf(e.object);return-1!==t&&(this.#o=new Selection(TimelineSelection.fromTraceEvent(e.object),t)),t}entryColor(e){if(!this.#r)throw new Error("networkTrackAppender should not be empty");return this.#r.colorForEvent(this.#i[e])}textColor(e){return FlameChartStyle.textColor}entryTitle(e){const t=this.#i[e],i=new Common.ParsedURL.ParsedURL(t.args.data.url);return i.isValid?`${i.displayName} (${i.host})`:t.args.data.url||null}entryFont(e){return this.#r?.font()||null}getDecorationPixels(e,t,i){const n=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.ts),r=e=>Math.floor(t+(e-n)*i),a=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.ts),o=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.ts+e.dur),s=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.args.data.syntheticData.sendStartTime),l=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.args.data.syntheticData.downloadStart),m=Math.max(r(s),t),c=Math.max(r(l),m),h=Math.max(r(TraceEngine.Helpers.Timing.microSecondsToMilliseconds(e.args.data.syntheticData.finishTime)),c+2);return{sendStart:m,headersEnd:c,finish:h,start:r(a),end:Math.max(r(o),h)}}decorateEntry(e,t,i,n,r,a,o,s,l){const m=this.#i[e],{sendStart:c,headersEnd:h,finish:p,start:d,end:T}=this.getDecorationPixels(m,s,l);function u(e,i,n){t.moveTo(e,n-3),t.lineTo(e,n+3),t.moveTo(e,n),t.lineTo(i,n)}t.fillStyle="hsla(0, 100%, 100%, 0.8)",t.fillRect(c+.5,r+.5,h-c-.5,o-2),t.fillStyle=ThemeSupport.ThemeSupport.instance().getComputedValue("--color-background"),t.fillRect(n,r-.5,c-n,o),t.fillRect(p,r-.5,n+a-p,o),t.beginPath(),t.lineWidth=1,t.strokeStyle="#ccc";const g=Math.floor(r+o/2)+.5,y=T-.5;u(d+.5,c,g),u(y,p,g),t.stroke();const S=this.#h(m.args.data.priority);S&&(t.fillStyle=S,t.fillRect(c+.5,r+.5,3.5,3.5));const f=Math.max(c,0),k=p-f;if(k>=20){let i=this.entryTitle(e)||"";if(m.args.data.fromServiceWorker&&(i="⚙ "+i),i){const e=4,n=o-5,a=UI.UIUtils.trimTextEnd(t,i,k-2*e);t.fillStyle="#333",t.fillText(a,f+e,r+n)}}return!0}forceDecoration(e){return!0}prepareHighlightedEntryInfo(e){const t=this.#i[e],i=document.createElement("div"),n=UI.Utils.createShadowRootWithCoreStyles(i,{cssFile:[timelineFlamechartPopoverStyles],delegatesFocus:void 0}).createChild("div","timeline-flamechart-popover"),r=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(t.ts),a=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(t.dur);r&&isFinite(a)&&(n.createChild("span","timeline-info-network-time").textContent=i18n.TimeUtilities.millisToString(a,!0));const o=n.createChild("span");return o.textContent=PerfUI.NetworkPriorities.uiLabelForNetworkPriority(t.args.data.priority),o.style.color=this.#h(t.args.data.priority)||"black",n.createChild("span").textContent=Platform.StringUtilities.trimMiddle(t.args.data.url,80),i}#h(e){this.#s||(this.#s=new Map([["VeryLow",1],["Low",2],["Medium",3],["High",4],["VeryHigh",5]]));const t=this.#s.get(e);return t?`hsla(214, 80%, 50%, ${t/5})`:null}#m(e){const{traceBounds:t}=e.Meta,i=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(t.min),n=TraceEngine.Helpers.Timing.microSecondsToMilliseconds(t.max);this.#e=i,this.#t=i===n?1e3:n-this.#e}#c(e,t){this.#r&&this.#a&&(this.#n=this.#r.filterTimelineDataBetweenTimes(TraceEngine.Types.Timing.MilliSeconds(e),TraceEngine.Types.Timing.MilliSeconds(t)),this.#a=PerfUI.FlameChart.FlameChartTimelineData.create({entryLevels:this.#a?.entryLevels,entryTotalTimes:this.#a?.entryTotalTimes,entryStartTimes:this.#a?.entryStartTimes,groups:this.#a?.groups}))}preferredHeight(){if(!this.#r||0===this.#n)return 0;const e=this.#r.group();return e?e.style.height*(this.isExpanded()?Platform.NumberUtilities.clamp(this.#n+1,4,8.5):1):0}isExpanded(){return Boolean(this.#r?.group()?.expanded)}formatValue(e,t){return i18n.TimeUtilities.preciseMillisToString(e,t)}canJumpToEntry(e){return!1}mainFrameNavigationStartEvents(){return this.#l?this.#l.Meta.mainFrameNavigations:[]}}