This is an automated email from the ASF dual-hosted git repository. srowen pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/spark.git
The following commit(s) were added to refs/heads/master by this push: new ebd8bc9 [SPARK-34123][WEB UI] optimize spark history summary page loading ebd8bc9 is described below commit ebd8bc934de9d6aec53beb4ab60c998052038fad Author: mohan3d <mohan3...@gmail.com> AuthorDate: Sun Jan 17 14:37:28 2021 -0600 [SPARK-34123][WEB UI] optimize spark history summary page loading ### What changes were proposed in this pull request? Display history server entries using datatables instead of Mustache + Datatables which proved to be faster and non-blocking for the webpage while searching (using search bar in the page) ### Why are the changes needed? Small changes in the attempts (entries) and removed part of HTML (Mustache template). ### Does this PR introduce _any_ user-facing change? Not very sure, but it's not supposed to change the way the page looks rather it changes how entries are displayed. ### How was this patch tested? Running test, since it's not adding new functionality. Closes #31191 from mohan3d/feat/history-server-ui-optimization. Lead-authored-by: mohan3d <mohan3...@gmail.com> Co-authored-by: Author: mohan3d <mohan3...@gmail.com> Signed-off-by: Sean Owen <sro...@gmail.com> --- .../spark/ui/static/historypage-template.html | 20 -------- .../org/apache/spark/ui/static/historypage.js | 54 ++++++++++++++++------ 2 files changed, 41 insertions(+), 33 deletions(-) diff --git a/core/src/main/resources/org/apache/spark/ui/static/historypage-template.html b/core/src/main/resources/org/apache/spark/ui/static/historypage-template.html index 7e9927d..5427125 100644 --- a/core/src/main/resources/org/apache/spark/ui/static/historypage-template.html +++ b/core/src/main/resources/org/apache/spark/ui/static/historypage-template.html @@ -75,26 +75,6 @@ </th> </thead> <tbody> - {{#applications}} - <tr> - {{#attempts}} - <td {{#hasMultipleAttempts}}style="background-color:#fff"{{/hasMultipleAttempts}}>{{version}}</td> - <td {{#hasMultipleAttempts}}style="background-color:#fff"{{/hasMultipleAttempts}}><span title="{{id}}"><a href="{{uiroot}}/history/{{id}}{{#hasAttemptId}}/{{attemptId}}{{/hasAttemptId}}/jobs/">{{id}}</a></span></td> - <td {{#hasMultipleAttempts}}style="background-color:#fff"{{/hasMultipleAttempts}}>{{name}}</td> - {{#hasMultipleAttempts}} - <td><a href="{{uiroot}}/history/{{id}}{{#hasAttemptId}}/{{attemptId}}{{/hasAttemptId}}/jobs/">{{attemptId}}</a></td> - {{/hasMultipleAttempts}} - <td>{{startTime}}</td> - {{#showCompletedColumns}} - <td>{{endTime}}</td> - <td><span title="{{durationMillisec}}">{{duration}}</span></td> - {{/showCompletedColumns}} - <td>{{sparkUser}}</td> - <td>{{lastUpdated}}</td> - <td><a href="{{log}}" class="btn btn-info btn-mini">Download</a></td> - {{/attempts}} - </tr> - {{/applications}} </tbody> </table> </script> diff --git a/core/src/main/resources/org/apache/spark/ui/static/historypage.js b/core/src/main/resources/org/apache/spark/ui/static/historypage.js index 3a4c815..aa542a7 100644 --- a/core/src/main/resources/org/apache/spark/ui/static/historypage.js +++ b/core/src/main/resources/org/apache/spark/ui/static/historypage.js @@ -140,9 +140,13 @@ $(document).ready(function() { (attempt.hasOwnProperty("attemptId") ? attempt["attemptId"] + "/" : "") + "logs"; attempt["durationMillisec"] = attempt["duration"]; attempt["duration"] = formatDuration(attempt["duration"]); - var hasAttemptId = attempt.hasOwnProperty("attemptId"); - var app_clone = {"id" : id, "name" : name, "version": version, "hasAttemptId" : hasAttemptId, "attempts" : [attempt]}; - array.push(app_clone); + attempt["id"] = id; + attempt["name"] = name; + attempt["version"] = version; + attempt["attemptUrl"] = uiRoot + "/history/" + id + "/" + + (attempt.hasOwnProperty("attemptId") ? attempt["attemptId"] + "/" : "") + "jobs/"; + + array.push(attempt); } } if(array.length < 20) { @@ -165,17 +169,41 @@ $(document).ready(function() { var completedColumnName = 'completed'; var durationColumnName = 'duration'; var conf = { + "data": array, "columns": [ - {name: 'version'}, - {name: 'appId', type: "appid-numeric"}, - {name: 'appName'}, - {name: attemptIdColumnName}, - {name: startedColumnName}, - {name: completedColumnName}, - {name: durationColumnName, type: "title-numeric"}, - {name: 'user'}, - {name: 'lastUpdated'}, - {name: 'eventLog'}, + {name: 'version', data: 'version' }, + { + name: 'appId', + type: "appid-numeric", + data: 'id', + render: (id, type, row) => `<span title="${id}"><a href="${row.attemptUrl}">${id}</a></span>` + }, + {name: 'appName', data: 'name' }, + { + name: attemptIdColumnName, + data: 'attemptId', + render: (attemptId, type, row) => (attemptId ? `<a href="${row.attemptUrl}">${attemptId}</a>` : '') + }, + {name: startedColumnName, data: 'startTime' }, + {name: completedColumnName, data: 'endTime' }, + {name: durationColumnName, type: "title-numeric", data: 'duration' }, + {name: 'user', data: 'sparkUser' }, + {name: 'lastUpdated', data: 'lastUpdated' }, + { + name: 'eventLog', + data: 'log', + render: (log, type, row) => `<a href="${log}" class="btn btn-info btn-mini">Download</a>` + }, + ], + "aoColumnDefs": [ + { + aTargets: [0, 1, 2], + fnCreatedCell: (nTd, sData, oData, iRow, iCol) => { + if (hasMultipleAttempts) { + $(nTd).css('background-color', '#fff'); + } + } + }, ], "autoWidth": false, "deferRender": true --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@spark.apache.org For additional commands, e-mail: commits-h...@spark.apache.org