-
-
Save axemclion/5a819ceb1b9b4118746b to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head></head> | |
| <body> | |
| <script type="text/javascript"> | |
| function renderedAll(){ | |
| document.getElementById('render').innerHTML = 'Done Rendering'; | |
| document.body.className = 'rendered-all'; | |
| } | |
| // This will be typically an Ajax request | |
| window.setTimeout(renderedAll, 5000); | |
| </script> | |
| <div id="render"> | |
| Loading (will be done in 4 secs) | |
| </div> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var browserPerf = require('browser-perf'); | |
| var BaseMetrics = require('browser-perf/lib/metrics/BaseMetrics'); | |
| var url = process.argv[2]; | |
| var renderChangeFunction = 'renderedAll'; | |
| browserPerf(url, function(err, result) { | |
| console.log(err, result); | |
| }, { | |
| selenium: 'http://localhost:9515', | |
| browsers: [{ | |
| browserName: 'chrome', | |
| loggingPrefs: { | |
| performance: 'ALL' | |
| } | |
| }], | |
| actions: waitForRender, | |
| metrics: [renderMetric()] | |
| }); | |
| function waitForRender(browser) { | |
| return browser.get(url).then(function() { | |
| return browser.waitForElementByCss("body.rendered-all", 10000, 5000); | |
| }); | |
| } | |
| function renderMetric() { | |
| var startTime, endTime, waitForEnd = false; | |
| function processLogEntity(data) { | |
| if (data.type === 'InvalidateLayout') { | |
| console.log('Layout invalidated, checking if this is due to our function'); | |
| if (data.stackTrace) { | |
| for (var i = 0; i < data.stackTrace.length; i++) { | |
| if (data.stackTrace[i].functionName === renderChangeFunction) { | |
| console.log('Render function triggered, now waiting for layout to complete'); | |
| waitForEnd = true; | |
| } | |
| } | |
| } | |
| } | |
| if (data.type === 'DrawFrame' && waitForEnd === true) { | |
| console.log('Found a draw frame after our function call'); | |
| endTime = data.startTime; | |
| } | |
| if (data.type === 'ResourceSendRequest') { | |
| startTime = data.startTime; | |
| console.log('Start Time set'); | |
| } | |
| for (var i = 0; data.children && i < data.children.length; i++) { | |
| processLogEntity(data.children[i]); | |
| } | |
| } | |
| return { | |
| start: function(browser) { | |
| return browser.log('performance'); | |
| }, | |
| teardown: function(browser) { | |
| return browser.log('performance').then(function(log) { | |
| log.forEach(function(log) { | |
| var data = JSON.parse(log.message).message.params; | |
| if (data.record) { | |
| processLogEntity(data.record); | |
| } | |
| }); | |
| }); | |
| }, | |
| getResults: function() { | |
| return { | |
| startTime: startTime, | |
| endTime: endTime, | |
| duration: endTime - startTime | |
| }; | |
| } | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment