render()

in frontend/src/components/jfr/flame-graph.js [1129:1247]


    render(reInitRenderContext, reGenFrames) {
      {
        // cache: from dataSource
        if (this.$dataSource) {
          this.$$isLineFormat = this.$dataSource.format.toLowerCase() === 'line';
          this.$$diff = !!this.$dataSource.diff;

          // cache: from configuration
          this.$$dataExtractor = this.dataExtractor;

          this.$$stackTracesCounter = this.stackTracesCounter;
          this.$$stackTraceExtractor = this.stackTraceExtractor;
          this.$$framesCounter = this.framesCounter;
          this.$$frameExtractor = this.frameExtractor;
          this.$$framesIndexer = this.framesIndexer;
          this.$$stackTraceFilter = this.stackTraceFilter;
          this.$$frameEquator = this.frameEquator;
          this.$$reverse = this.reverse;

          this.$$rootFramesCounter = this.rootFramesCounter;
          this.$$rootFrameExtractor = this.rootFrameExtractor;
          this.$$childFramesCounter = this.childFramesCounter;
          this.$$childFrameExtractor = this.childFrameExtractor;
          this.$$frameStepper = this.frameStepper;
          this.$$childFramesIndexer = this.childFramesIndexer;

          this.$$weightsExtractor = this.weightsExtractor;

          this.$$rootTextGenerator = this.rootTextGenerator;
          this.$$textGenerator = this.textGenerator;
          this.$$titleGenerator = this.titleGenerator;
          this.$$detailsGenerator = this.detailsGenerator;
          this.$$footTextGenerator = this.footTextGenerator;

          this.$$rootColorSelector = this.rootColorSelector;
          this.$$colorSelector = this.colorSelector;
          this.$$footColorSelector = this.footColorSelector;
          this.$$hashCodeGenerator = this.hashCodeGenerator;

          this.$$showHelpButton = this.showHelpButton;
        }
      }

      if (reInitRenderContext) {
        this.clearState();
      }

      this.clearCanvas();

      if (reGenFrames) {
        this.genFrames();
      }

      if (reInitRenderContext) {
        this.initRenderContext();
      }

      if (this.$totalWeight === 0) {
        this.$helpButton.style.visibility = 'hidden';
        this.$sibling = null;
        return;
      }

      if (this.$$diff) {
        this.$colorBarDiv.style.display = 'flex';
      }

      if (this.$$showHelpButton) {
        this.$helpButton.style.visibility = 'visible';
        this.$fgHGap = 15;
      } else {
        this.$helpButton.style.visibility = 'hidden';
        this.$fgHGap = 0;
      }

      let rect = this.$canvas.getBoundingClientRect();

      this.$stackTraceMaxDrawnDepth = 0;
      this.$sibling = Array(this.$stackTraceMaxDepth + 1);
      for (let i = 0; i < this.$stackTraceMaxDepth + 1; i++) {
        this.$sibling[i] = [];
      }
      if (this.downward) {
        this.$root.draw(
          this.$fgHGap,
          this.$fgVGap,
          rect.width - this.$fgHGap * 2,
          this.$frameHeight
        );
      } else {
        this.$root.draw(
          this.$fgHGap,
          rect.height - this.$fgVGap - this.$frameHeight,
          rect.width - this.$fgHGap * 2,
          this.$frameHeight
        );
      }

      if (this.$stackTraceMaxDrawnDepth < this.$stackTraceMaxDepth) {
        let height = (this.$stackTraceMaxDrawnDepth + 1) * this.$frameHeight;

        if (this.$stackTraceMaxDrawnDepth > 0) {
          height += this.$stackTraceMaxDrawnDepth * this.$yGap;
        }
        height += this.$fgVGap + this.$fgVEndGap;

        if (this.downward) {
          this.$currentScrollTopLimit = Math.max(
            height - this.$flameGraphInner.getBoundingClientRect().height,
            this.$flameGraphInner.scrollTop
          );
        } else {
          this.$currentScrollTopLimit = Math.min(
            this.$flameGraphHeight - height,
            this.$flameGraphInner.scrollTop
          );
        }
      }
    }