Changeset 233147 in webkit


Ignore:
Timestamp:
Jun 25, 2018 8:38:03 AM (6 years ago)
Author:
jonlee@apple.com
Message:

[MotionMark] Add support for version numbers
​https://bugs.webkit.org/show_bug.cgi?id=186479

Reviewed by Said Abou-Hallawa.

Add support for displaying the version number as well as including it in the JSON results.

When loading the front page, script replaces any element with classname version with the
version number of the benchmark, which is stored in Strings.version.

The JSON structure for the results includes a new version property:

{

"version": "1.0",
"options": { ... },
"data": [ ... ]

}

When dragging a results file, the version listed will come from the JSON file. Older
results will not have had the version property, in which case it will default to "1.0".

  • MotionMark/index.html: Update title to some other default. Script will update it.

Include the version number in the logo title.

  • MotionMark/developer.html: Ditto.
  • MotionMark/about.html: Ditto.
  • MotionMark/resources/runner/motionmark.js:

(ResultsDashboard): Update constructor to include version. This is used when serializing
results out to JSON, and displaying the results panel in developer mode.
(ResultsDashboard._processData): When running the benchmark, include benchmark version string
in the results object.
(ResultsDashboard.version):
(window.benchmarkRunnerClient.willStartFirstIteration): When running the benchmark, pass the
benchmark version string to the dashboard, which holds the results.
(window.sectionsManager.setSectionVersion): Helper function to update the element in the
section with the class name version.
(window.benchmarkController.initialize): Populate all DOM elements with class name "version"
with the version string. Update the page title.
(window.benchmarkController.showResults): When showing results, update the version string
based on what is included in the JSON results, which would be the same as the benchmark version.

  • MotionMark/resources/runner/motionmark.css: Include missing copyright. Wrap the SVG logo

in a div and include the version string.

  • MotionMark/resources/strings.js: Add strings for the page title template, and the version.
  • MotionMark/resources/debug-runner/motionmark.css:
  • MotionMark/resources/debug-runner/motionmark.js:

(window.benchmarkRunnerClient.willStartFirstIteration): When running the benchmark, pass the
benchmark version string to the dashboard, which holds the results.
(window.benchmarkController.initialize): Populate all DOM elements with class name "version"
with the version string. Update the page title. When dragging in JSON results, look for
version to pass to the dashboard. If it doesn't exist, default to "1.0".
(window.benchmarkController.showResults): When showing results, update the version string
based on what is included in the JSON results, instead of the current benchmark version.

  • MotionMark/resources/debug-runner/tests.js: Update page title template.
Location:
trunk/PerformanceTests
Files:
10 edited

Legend:

Unmodified
Added
Removed

  • trunk/PerformanceTests/ChangeLog

    r232653 r233147  
     12018-06-25  Jon Lee  <jonlee@apple.com>
     2
     3        [MotionMark] Add support for version numbers
     4        https://bugs.webkit.org/show_bug.cgi?id=186479
     5
     6        Reviewed by Said Abou-Hallawa.
     7
     8        Add support for displaying the version number as well as including it in the JSON results.
     9
     10        When loading the front page, script replaces any element with classname version with the
     11        version number of the benchmark, which is stored in Strings.version.
     12
     13        The JSON structure for the results includes a new version property:
     14            {
     15              "version": "1.0",
     16              "options": { ... },
     17              "data": [ ... ]
     18            }
     19
     20        When dragging a results file, the version listed will come from the JSON file. Older
     21        results will not have had the version property, in which case it will default to "1.0".
     22
     23        * MotionMark/index.html: Update title to some other default. Script will update it.
     24        Include the version number in the logo title.
     25        * MotionMark/developer.html: Ditto.
     26        * MotionMark/about.html: Ditto.
     27
     28        * MotionMark/resources/runner/motionmark.js:
     29        (ResultsDashboard): Update constructor to include version. This is used when serializing
     30        results out to JSON, and displaying the results panel in developer mode.
     31        (ResultsDashboard._processData): When running the benchmark, include benchmark version string
     32        in the results object.
     33        (ResultsDashboard.version):
     34        (window.benchmarkRunnerClient.willStartFirstIteration): When running the benchmark, pass the
     35        benchmark version string to the dashboard, which holds the results.
     36        (window.sectionsManager.setSectionVersion): Helper function to update the element in the
     37        section with the class name version.
     38        (window.benchmarkController.initialize): Populate all DOM elements with class name "version"
     39        with the version string. Update the page title.
     40        (window.benchmarkController.showResults): When showing results, update the version string
     41        based on what is included in the JSON results, which would be the same as the benchmark version.
     42        * MotionMark/resources/runner/motionmark.css: Include missing copyright. Wrap the SVG logo
     43        in a div and include the version string.
     44        * MotionMark/resources/strings.js: Add strings for the page title template, and the version.
     45
     46        * MotionMark/resources/debug-runner/motionmark.css:
     47        * MotionMark/resources/debug-runner/motionmark.js:
     48        (window.benchmarkRunnerClient.willStartFirstIteration): When running the benchmark, pass the
     49        benchmark version string to the dashboard, which holds the results.
     50        (window.benchmarkController.initialize): Populate all DOM elements with class name "version"
     51        with the version string. Update the page title. When dragging in JSON results, look for
     52        version to pass to the dashboard. If it doesn't exist, default to "1.0".
     53        (window.benchmarkController.showResults): When showing results, update the version string
     54        based on what is included in the JSON results, instead of the current benchmark version.
     55        * MotionMark/resources/debug-runner/tests.js: Update page title template.
     56
    1572018-06-08  Jon Lee  <jonlee@apple.com>
    258

  • trunk/PerformanceTests/MotionMark/about.html

    r224388 r233147  
    11<!--
    2   Copyright (C) 2015-2017 Apple Inc. All rights reserved.
     2  Copyright (C) 2015-2018 Apple Inc. All rights reserved.
    33
    44  Redistribution and use in source and binary forms, with or without
    … …  
    3232
    3333    <link rel="stylesheet" href="resources/runner/motionmark.css">
     34
     35    <script src="resources/strings.js"></script>
    3436</head>
    3537<body class="images-loaded">
    3638    <main>
    3739    <section id="about" class="selected">
    38         <svg class="logo"><use xlink:href="resources/runner/logo.svg#root"></svg>
     40        <div class="logo"><svg><use xlink:href="resources/runner/logo.svg#root" /></svg></div>
    3941
    4042        <div class="body">
    41             <h1>About MotionMark</h1>
     43            <h1>About MotionMark <span class="version"></span></h1>
    4244
    4345            <p>MotionMark is a web benchmark that focuses on graphics performance. It draws multiple rendering elements, each of which uses the same set of graphics primitives. An element could be an SVG node, an HTML element with CSS style, or a series of canvas operations. Slight variations among the elements avoid trivial caching optimizations by the browser. Although fairly simple, the effects were chosen to reflect techniques commonly used on the web. Tests are visually rich, being designed to stress the graphics system rather than JavaScript.</p>
    … …  
    7375        </section>
    7476    </main>
     77
     78    <script>
     79        document.title = "About MotionMark " + Strings.version;
     80        document.querySelector(".version").textContent = Strings.version;
     81    </script>
    7582</body>
    7683</html>

  • trunk/PerformanceTests/MotionMark/developer.html

    r232561 r233147  
    2929    <meta name="viewport" content="width=device-width, user-scalable=no">
    3030
    31     <title>MotionMark 1.0 - developer</title>
     31    <title>MotionMark developer</title>
    3232
    3333    <link rel="stylesheet" href="resources/runner/motionmark.css">
    … …  
    5050    <main>
    5151        <section id="intro" class="selected">
    52             <h1>MotionMark</h1>
     52            <header>
     53                <h1>MotionMark</h1>
     54                <h2>version <span class="version"></span></h2>
     55            </header>
    5356            <div class="body">
    5457                <div>
    … …  
    132135                    <span class="large">on a large screen (desktop)</span>
    133136                </div>
     137                <div>version <span class="version"></span></div>
    134138                <p class="score" onclick="benchmarkController.showDebugInfo()"></p>
    135139                <p class="confidence"></p>

  • trunk/PerformanceTests/MotionMark/index.html

    r224388 r233147  
    11<!--
    2   Copyright (C) 2015-2017 Apple Inc. All rights reserved.
     2  Copyright (C) 2015-2018 Apple Inc. All rights reserved.
    33
    44  Redistribution and use in source and binary forms, with or without
    … …  
    2929    <meta name="viewport" content="width=device-width, user-scalable=no">
    3030
    31     <title>MotionMark 1.0</title>
     31    <title>MotionMark</title>
    3232
    3333    <link rel="stylesheet" href="resources/runner/motionmark.css">
    … …  
    5252    <main>
    5353        <section id="intro" class="selected">
    54             <svg class="logo"><use xlink:href="resources/runner/logo.svg#root"></svg>
     54            <div class="logo">
     55              <svg><use xlink:href="resources/runner/logo.svg#root" /></svg>
     56              <div>version <span class="version"></span></div>
     57            </div>
    5558            <div class="body">
    5659                <p>MotionMark is a graphics benchmark that measures a browser’s capability to animate complex scenes at a target frame rate.</p>
    … …  
    6669
    6770        <section id="results">
    68             <svg class="logo"><use xlink:href="resources/runner/logo.svg#root"></svg>
     71            <div class="logo">
     72              <svg><use xlink:href="resources/runner/logo.svg#root" /></svg>
     73              <div>version <span class="version"></span></div>
     74            </div>
    6975            <div class="body">
    7076                <div class="score-container">

  • trunk/PerformanceTests/MotionMark/resources/debug-runner/motionmark.css

    r232561 r233147  
    4646}
    4747
    48 h1 {
     48header {
     49    margin: 3em 0 1em;
     50    text-align: center;
     51}
     52
     53header h1, header h2 {
    4954    font-size: 3em;
    50     margin: 1.5em 0 .5em;
    51     text-align: center;
     55    margin: 0;
    5256}
    5357
    … …  
    8589@media screen and (max-device-width: 414px),
    8690    screen and (max-device-height: 414px) and (orientation: landscape) {
    87     h1 {
    88         font-size: 2.5em;
     91    header h1 {
     92        font-size: 2em;
    8993    }
    9094

  • trunk/PerformanceTests/MotionMark/resources/debug-runner/motionmark.js

    r232547 r233147  
    135135    willStartFirstIteration: function()
    136136    {
    137         this.results = new ResultsDashboard(this.options);
     137        this.results = new ResultsDashboard(Strings.version, this.options);
    138138        this.progressBar = new ProgressBar(document.getElementById("progress-completed"), this.testsCount);
    139139    },
    … …  
    533533    initialize: function()
    534534    {
     535        document.title = Strings.text.title.replace("%s", Strings.version);
     536        document.querySelectorAll(".version").forEach(function(e) {
     537            e.textContent = Strings.version;
     538        });
     539
    535540        document.forms["benchmark-options"].addEventListener("change", benchmarkController.onBenchmarkOptionsChanged, true);
    536541        document.forms["graph-type"].addEventListener("change", benchmarkController.onGraphTypeChanged, true);
    … …  
    572577                if (run.debugOutput instanceof Array)
    573578                    run = run.debugOutput[0];
    574                 benchmarkRunnerClient.results = new ResultsDashboard(run.options, run.data);
     579                if (!("version" in run))
     580                    run.version = "1.0";
     581                benchmarkRunnerClient.results = new ResultsDashboard(run.version, run.options, run.data);
    575582                benchmarkController.showResults();
    576583            };
    … …  
    658665        var confidence = ((dashboard.scoreLowerBound / score - 1) * 100).toFixed(2) +
    659666            "% / +" + ((dashboard.scoreUpperBound / score - 1) * 100).toFixed(2) + "%";
     667        sectionsManager.setSectionVersion("results", dashboard.version);
    660668        sectionsManager.setSectionScore("results", score.toFixed(2), confidence);
    661669        sectionsManager.populateTable("results-header", Headers.testName, dashboard);

  • trunk/PerformanceTests/MotionMark/resources/debug-runner/tests.js

    r232645 r233147  
    2929    confidenceInterval: "80% Confidence Interval",
    3030    mergedRawComplexity: "Raw Complexity",
    31     graph: "Graph"
     31    graph: "Graph",
     32    title: "MotionMark %s developer",
    3233});
    3334

  • trunk/PerformanceTests/MotionMark/resources/runner/motionmark.css

    r224317 r233147  
     1/*
     2 * Copyright (C) 2018 Apple Inc. All rights reserved.
     3 *
     4 * Redistribution and use in source and binary forms, with or without
     5 * modification, are permitted provided that the following conditions
     6 * are met:
     7 * 1. Redistributions of source code must retain the above copyright
     8 *    notice, this list of conditions and the following disclaimer.
     9 * 2. Redistributions in binary form must reproduce the above copyright
     10 *    notice, this list of conditions and the following disclaimer in the
     11 *    documentation and/or other materials provided with the distribution.
     12 *
     13 * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
     14 * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
     15 * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
     16 * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
     17 * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
     18 * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
     19 * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
     20 * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
     21 * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
     22 * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
     23 * THE POSSIBILITY OF SUCH DAMAGE.
     24 */
    125/* Outer harness */
    2 
    326html,
    427body {
    … …  
    7396}
    7497
    75 svg.logo {
     98.logo {
     99    position: relative;
     100}
     101
     102.logo svg {
    76103    width: 350px;
    77104    height: 88px;
    … …  
    79106    max-width: 100%;
    80107
    81     padding-bottom: 1em;
    82 
    83108    color: hsl(35, 100%, 50%);
    84109
    … …  
    89114}
    90115
    91 body.images-loaded svg.logo {
     116.logo div {
     117    transform: skewX(-10deg);
     118    margin-left: 1em;
     119}
     120
     121body.images-loaded .logo svg {
    92122    animation-play-state: running;
    93123}
    94124
    95125@media screen and (min-width: 667px) {
    96     svg.logo {
     126    .logo svg {
    97127        width: 525px;
    98128        height: 130px;
     129        padding-left: .4em;
     130    }
     131
     132    .logo div {
     133        position: absolute;
     134        left: 360px;
     135        bottom: 0.2em;
     136        font-size: 75%;
    99137    }
    100138}
    101139
    102140section .body {
    103     margin: 0 1em;
     141    margin: 2em 1em 0;
    104142    max-width: 350px;
    105143}

  • trunk/PerformanceTests/MotionMark/resources/runner/motionmark.js

    r232561 r233147  
    2424 */
    2525 ResultsDashboard = Utilities.createClass(
    26     function(options, testData)
     26    function(version, options, testData)
    2727    {
    2828        this._iterationsSamplers = [];
    2929        this._options = options;
    3030        this._results = null;
     31        this._version = version;
    3132        if (testData) {
    3233            this._iterationsSamplers = testData;
    … …  
    8283        }, this);
    8384
     85        this._results[Strings.json.version] = this._version;
    8486        this._results[Strings.json.score] = Statistics.sampleMean(iterationsScores.length, iterationsScores.reduce(function(a, b) { return a + b; }));
    8587        this._results[Strings.json.scoreLowerBound] = this._results[Strings.json.results.iterations][0][Strings.json.scoreLowerBound];
    … …  
    251253    },
    252254
     255    get version()
     256    {
     257        return this._version;
     258    },
     259
    253260    _getResultsProperty: function(property)
    254261    {
    … …  
    389396    willStartFirstIteration: function()
    390397    {
    391         this.results = new ResultsDashboard(this.options);
     398        this.results = new ResultsDashboard(Strings.version, this.options);
    392399    },
    393400
    … …  
    429436        if (pushState)
    430437            history.pushState({section: sectionIdentifier}, document.title);
     438    },
     439
     440    setSectionVersion: function(sectionIdentifier, version)
     441    {
     442        document.querySelector("#" + sectionIdentifier + " .version").textContent = version;
    431443    },
    432444
    … …  
    448460    initialize: function()
    449461    {
     462        document.title = Strings.text.title.replace("%s", Strings.version);
     463        document.querySelectorAll(".version").forEach(function(e) {
     464            e.textContent = Strings.version;
     465        });
    450466        benchmarkController.addOrientationListenerIfNecessary();
    451467    },
    … …  
    537553        var score = dashboard.score;
    538554        var confidence = "±" + (Statistics.largestDeviationPercentage(dashboard.scoreLowerBound, score, dashboard.scoreUpperBound) * 100).toFixed(2) + "%";
     555        sectionsManager.setSectionVersion("results", dashboard.version);
    539556        sectionsManager.setSectionScore("results", score.toFixed(2), confidence);
    540557        sectionsManager.populateTable("results-header", Headers.testName, dashboard);
    … …  
    585602        setTimeout(function() {
    586603            var output = {
     604                version: benchmarkRunnerClient.results.version,
    587605                options: benchmarkRunnerClient.results.options,
    588606                data: benchmarkRunnerClient.results.data

  • trunk/PerformanceTests/MotionMark/resources/strings.js

    r232561 r233147  
    2424 */
    2525var Strings = {
     26    version: "1.0",
    2627    text: {
    2728        testName: "Test Name",
    28         score: "Score"
     29        score: "Score",
     30        title: "MotionMark %s",
    2931    },
    3032    json: {
     33        version: "version",
     34
    3135        marks: "marks",
    3236        samplingStartTimeOffset: "Start sampling",
Note: See TracChangeset for help on using the changeset viewer.